Skip to content

Commit f248522

Browse files
committed
🤖 fix: clear localStorage theme before Storybook loads
Added preview-head.html to clear the 'uiTheme' from localStorage before Storybook initializes. This prevents the stored theme from overriding the Chromatic mode theme that our decorator tries to set. The flow is now: 1. preview-head.html clears localStorage theme 2. Storybook loads with clean slate 3. Decorator applies theme from context.globals.theme (Chromatic modes) 4. ThemeProvider respects the forcedTheme This ensures light mode stories render in light and dark in dark.
1 parent d83e9d2 commit f248522

File tree

1 file changed

+16
-0
lines changed

1 file changed

+16
-0
lines changed

.storybook/preview-head.html

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<script>
2+
// This runs BEFORE Storybook and React load
3+
// Clear any stored theme so our decorator can set it based on Chromatic modes
4+
(function () {
5+
const THEME_KEY = "uiTheme";
6+
try {
7+
// Clear the stored theme - let the decorator handle it
8+
window.localStorage.removeItem(THEME_KEY);
9+
// Set a neutral initial state
10+
document.documentElement.dataset.theme = "dark";
11+
document.documentElement.style.colorScheme = "dark";
12+
} catch (error) {
13+
console.warn("Failed to clear theme in preview-head", error);
14+
}
15+
})();
16+
</script>

0 commit comments

Comments
 (0)