Description
Provide a general summary of the issue here
The CheckboxGroup form reset does not work as expected. When multiple checkboxes are checked and the form is reset, the checkboxes are cleared one by one instead of all at once, as seen with native HTML <input type="checkbox">
elements. I want to reset the form content using either or React’s provided requestFormReset, but neither is working.
2025-02-09.19.59.49.mov
I confirmed that in react-aria-components version 1.1.0, all checkboxes were reset correctly. However, in version 1.2.0 and later, only one checkbox is reset at a time.
🤔 Expected Behavior?
When the form is reset, all checkboxes in the CheckboxGroup should be unchecked simultaneously, matching the behavior of native HTML checkboxes.
😯 Current Behavior
Currently, if you check several checkboxes in a CheckboxGroup and then trigger a form reset, the checkboxes are cleared one at a time rather than all at once. In contrast, native HTML checkboxes (e.g., <input type="checkbox">
) remove all checks immediately when the form is reset.
💁 Possible Solution
No response
🔦 Context
No response
🖥️ Steps to Reproduce
https://codesandbox.io/p/sandbox/ecstatic-bird-p2n2r5?file=%2Fsrc%2FApp.js
export const Example = (args: any) => (
<Form>
<CheckboxGroup name="sample">
<Checkbox value="soccer">Soccer</Checkbox>
<Checkbox value="baseball">Baseball</Checkbox>
<Checkbox value="basketball">Basketball</Checkbox>
</CheckboxGroup>
<div>
<input type="checkbox" name="sample" value="1" /> native checkbox
</div>
<div>
<input type="checkbox" name="sample" value="2" /> native checkbox
</div>
<div>
<input type="checkbox" name="sample" value="3" /> native checkbox
</div>
<button type="reset">Reset</button>
</Form>
);
Version
1.6.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
macOS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response