ComboBox calls onSelectionChange with null value when helpers.setValue is used in Formik
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
# 🐛 Bug Report
When using ComboBox with Formik and setting `onSelectionChange={helpers.setValue}` to set the Formik value onSelectionChange is called twice, first with the selected value and immediately after with null.
## 🤔 Expected Behavior
onSelectionChange should be called once with the selected value.
## 😯 Current Behavior
Currently it calls the callback with the selected value but then immediately calls it with null. This only happens when Formik is used.
## 💁 Possible Solution
Workarounds include using setTimeout (not sure why this works)or disabling Formik validation.
## 🔦 Context
Have to use the workaround to get ComboBox to work - weird problem that is hard to describe and keep remembering to fix whenever ComboBox is used with Formik.
Seems unlikely to be an issue with Formik, although Formik may be causing the component to be re-rendered more often than it should which could be a cause(?)
## 💻 Code Sample
Minimal example with examples of workarounds:
https://codesandbox.io/s/react-aria-combobox-issue-d5y4j2?file=/src/App.js
## 🌍 Your Environment
| Software | Version(s) |
| ---------------- | ---------- |
| react-aria | ^3.25.0
| react-stately | ^3.23.0
| react | 18.2.0
| react-dom | 18.2.0
| Browser | Chrome
| Operating System | MacOS
## 🧢 Your Company/Team
N/A
## 🕷 Tracking Issue (optional)
N/A
Contributor guide
Assessment
This issue has not been assessed yet.