fix: Fixed errorOverlay theme toggle bug. (#10661)

* fix: save `localStorage.astroErrorOverlayTheme` when detected dark mode * add changeset * Fix theme toggle in ErrorOverlay * update changeset
withastro · Apr 10, 2024 · e2cd7f4 · e2cd7f4
1 parent 0fec72b
commit e2cd7f4
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/.changeset/short-flies-itch.md b/.changeset/short-flies-itch.md
@@ -0,0 +1,5 @@
+---
+"astro": patch
+---
+
+Fixed errorOverlay theme toggle bug.
diff --git a/packages/astro/src/core/errors/overlay.ts b/packages/astro/src/core/errors/overlay.ts
@@ -593,13 +593,14 @@ class ErrorOverlay extends HTMLElement {
 				window.matchMedia('(prefers-color-scheme: dark)').matches)
 		) {
 			this?.classList.add('astro-dark');
+			localStorage.astroErrorOverlayTheme = 'dark';
 			themeToggle!.checked = true;
 		} else {
 			this?.classList.remove('astro-dark');
 			themeToggle!.checked = false;
 		}
 		themeToggle?.addEventListener('click', () => {
-			const isDark = localStorage.astroErrorOverlayTheme === 'dark';
+			const isDark = localStorage.astroErrorOverlayTheme === 'dark' || this?.classList.contains('astro-dark');
 			this?.classList.toggle('astro-dark', !isDark);
 			localStorage.astroErrorOverlayTheme = isDark ? 'light' : 'dark';
 		});