[Bug]: @storybook/react-vite framework changes in MUI theme file are not reflected in hot reload

eneaaliko0 commented 7 months ago

Describe the bug

When use @storybook/react-vite framework and I have used themes from MUI in storybook components, while making changes in the theme file, the changes are not reflected in hot reload. I have investigated and the problem is the files that are created in node_modules/.cache/sb-vite/deps I have tried to make the cache disable but I have not been able to fix this problem.

When I delete node_modules/.cache/sb-vite/deps manually and restart the change appears in storybook

To Reproduce

No response

System

System:
    OS: macOS 13.6
    CPU: (10) arm64 Apple M1 Pro
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.5.1 - /opt/homebrew/bin/node
    npm: 9.8.0 - /opt/homebrew/bin/npm <----- active
  Browsers:
    Chrome: 121.0.6167.160
    Safari: 16.6

Additional context

I'm using this packages of Storybook:

"@storybook/builder-vite": "^7.4.2", "@storybook/client-api": "^7.4.2", "@storybook/addon-actions": "^7.4.2", "@storybook/addon-essentials": "^7.4.2", "@storybook/addon-links": "^7.4.2", "@storybook/addon-styling": "^1.3.7", "@storybook/addons": "^7.4.2", "@storybook/mdx1-csf": "^1.0.0", "@storybook/react": "^7.4.2", "@storybook/cli": "^7.4.2", "@storybook/react-vite": "^7.4.2",

main.js file:

module.exports = { stories: [ "src/*/.stories.mdx", "src/*/.stories.@(js|jsx|ts|tsx)" ], docs: { autodocs: true }, addons: [ "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-styling", "@storybook/mdx1-csf" ], features: { buildStoriesJson: true, legacyMdx1: true }, framework: { name: "@storybook/react-vite", options: {} }, };

eneaaliko0 commented 7 months ago

Alternative solution only for each story If I put same decorator code as component-level decorators it works

example:

function withThemeFunction(StoryFn, context) { return React.createElement( ThemeProvider, { name: context.globals.theme }, React.createElement(StoryFn, context) )}

DefaultButton.decorators = [withThemeFunction()]

Joshuabaker2 commented 7 months ago

I'm seeing the same issue, hot reload causes my contexts set in the decorator to disappear. Storybook version 7.6.15

storybookjs / storybook