Don's mutate the theme object in ThemeProvider.
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
Duplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
ThemeProvider try adding a property Symbol( mui.nested ) to the original theme object.
It causes error while using some state management libraries, such a Recoil, to manage theme objects, because the libraries may freeze objects they are handling, then Error Object is not extensible will be thrown.
On the other hand, changing origin object will also cause other side effects.
Expected behavior 🤔
Don't change the original object.
Steps to reproduce 🕹
Steps:
Context 🔦
No response
Your environment 🌎
npx @mui/envinfo
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start in packages/mui-private-theming/src/ThemeProvider/ThemeProvider.js at the linked line where the nested theme property is added. Check how ThemeProvider handles the incoming theme object and verify the change preserves frozen or otherwise non-extensible themes without mutating the original object.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 45/100