feat(hooks): remove mouse and touch events on unmount #1581
Conversation
Codecov ReportAll modified and coverable lines are covered by tests ✅
❗ Your organization needs to install the Codecov GitHub app to enable full functionality. Additional details and impacted files@@ Coverage Diff @@
## master #1581 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 18 18
Lines 1755 1749 -6
Branches 529 524 -5
=========================================
- Hits 1755 1749 -6 ☔ View full report in Codecov by Sentry. |
|
🎉 This PR is included in version 8.5.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, [isOpen, environment]) | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps -- refs don't change | ||
| }, [environment, handleBlur]) |
There was a problem hiding this comment.
I think this change broke the blur behaviour. Now using @testing-library/user-event, when we clears the input (and don't focus out) it triggers the blur and unselect the selected item:
await user.clear(input)
In my implementation, I am using the stateReducer to unselected the selected value of a combobox on blur if the input value is empty:
case useCombobox.stateChangeTypes.InputBlur:
if (allowCustomValue) return changes
if (state.inputValue === '') {
setSelectedItem(null)
return { ...changes, selectedItem: null }
}
It's breaking the tests because I no longer have a way to clear the input without triggering the blur.
What:
Remove the mouse and touch event handlers on unmount.
Why:
The previous implementation was removing the handlers and adding new ones on each isOpen change.
How:
Removed the isOpen dependency from the hook and moved the logic to the callback passed by useCombobox and useSelect.
Checklist: