[material-ui] When using CSS vars theme, values from `theme.palette` do not change when `mode` changes.

[jstoeber-workwave]

Steps to reproduce

Steps:

1. Open this link to live example: https://stackblitz.com/edit/github-wpwcwogw?file=src%2FDemo.tsx
2. Toggle the dark mode switches.
3. Look at the value printed for palette.background.paper and palette.mode.
4. when using CSS Vars, note how the above values do not change with the mode.

Current behavior

Using setMode from useColorScheme does not update theme values when using CSS variables theme.
The CSS is updated correctly, so components using theme.vars.palette.x will reflect the change but anything using theme.palette will not.

This seems to be a regression, see this identical example running on v6.0 where both themes behave the same.

Expected behavior

Using setMode from useColorScheme should trigger a rerender of the theme to update palette values when using CSS variable theme.

Context

No response

Your environment

StackBlitz

npx @mui/envinfo

  System:
    OS: Linux 5.0 undefined
  Binaries:
    Node: 20.19.1 - /usr/local/bin/node
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  Browsers:
    Chrome: Not Found
  npmPackages:
    @emotion/react: latest => 11.14.0 
    @emotion/styled: latest => 11.14.1 
    @mui/core-downloads-tracker:  7.2.0 
    @mui/icons-material: latest => 7.2.0 
    @mui/material: latest => 7.2.0 
    @mui/private-theming:  7.2.0 
    @mui/styled-engine:  7.2.0 
    @mui/system:  7.2.0 
    @mui/types:  7.4.4 
    @mui/utils:  7.2.0 
    @types/react: latest => 19.1.8 
    react: latest => 19.1.0 
    react-dom: latest => 19.1.0 
    typescript: latest => 5.8.3 

Search keywords: CSSVarsTheme, useTheme, useColorScheme

[siriwatknp]

Yes, that's the expected behavior as described in this doc https://mui.com/material-ui/migration/upgrade-to-v7/#theme-behavior-changes.

It's for performance improvement. If you want to preserve the same behavior, add this prop to the ThemeProvider:

<ThemeProvider forceThemeRerender />

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.