[base-ui][material-ui] Uncontrolled Switch component do not fully reset when inside a <form> with a reset button
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
Steps to reproduce 🕹
Link to live example without using state: https://codesandbox.io/p/sandbox/eager-rgb-m43d9q
Link to live example using state: https://codesandbox.io/p/sandbox/focused-hellman-z83g9c
Current behavior 😯
When using Switch component, Pressing the reset button in a form does not revert value of the Switch to its default value.
If I use Switch with state then it will work properly.
Expected behavior 🤔
Changes in the value of the Switch will get reset while clicking on the reset button when we are not using the state (for the first codesandbox).
Context 🔦
No response
Your environment 🌎
npx @mui/envinfo
System:
OS: Windows 10 10.0.19045
Binaries:
Node: 20.9.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
npm: 10.1.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: Not Found
Edge: Chromium (120.0.2210.77)
npmPackages:
@emotion/react: ^11.11.1 => 11.11.1
@emotion/styled: ^11.11.0 => 11.11.0
@mui/base: 5.0.0-beta.28
@mui/core-downloads-tracker: 5.15.1
@mui/material: ^5.15.1 => 5.15.1
@mui/private-theming: 5.15.1
@mui/styled-engine: 5.15.1
@mui/system: 5.15.1
@mui/types: 7.2.11
@mui/utils: 5.15.1
@types/react: ^18.2.45 => 18.2.45
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
typescript: ^4.9.5 => 4.9.5
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 by reproducing the uncontrolled Switch behavior in the linked CodeSandbox examples, comparing the stateful and stateless cases. Trace how the Switch handles a form reset and identify the relevant component entry point and tests; done means clicking reset restores the uncontrolled Switch to its default value.
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
- Mostly clear
- Newbie friendliness
- 35/100