fix(combobox): re-open menu when async items arrive after empty response#9823
Open
costajohnt wants to merge 2 commits intoadobe:mainfrom
Open
fix(combobox): re-open menu when async items arrive after empty response#9823costajohnt wants to merge 2 commits intoadobe:mainfrom
costajohnt wants to merge 2 commits intoadobe:mainfrom
Conversation
…empty response When using useComboBox with useAsyncList, if a query returns zero results the menu closes. A subsequent query that returns results fails to re-open the menu because the inputValue tracking has already been updated by the time the async items arrive. Track when the menu was auto-closed due to an empty controlled collection and re-open it when items become non-empty while the input is still focused. Reset the flag on user-initiated closes (blur, Escape, commit) so those remain permanent. Fixes adobe#9820
- Reset closedDueToEmptyControlled in revert() so Escape prevents re-opening when async items arrive after user dismissal - Add test for Escape key scenario - Add onOpenChange assertion for trigger reason on re-open - Fix minor style: use direct variable instead of destructured object literal
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #9820
When using
useComboBoxwithuseAsyncList, if a query returns zero results (e.g. typing "luka" against a Star Wars API), the menu closes. Subsequent queries that return results (e.g. backspacing to "luk" which matches "Luke Skywalker") fail to re-open the menu because theinputValuetracking has already been updated by the time the async items arrive.The root cause is an asymmetry between the
open()function (which has a|| props.itemsguard to allow opening with controlled empty collections) and the auto-close check in theuseEffect(which closes unconditionally whenfilteredCollection.size === 0).The fix tracks when the menu was auto-closed due to an empty controlled collection and re-opens it when items become non-empty while the input is still focused. The flag is reset on user-initiated closes (blur, Escape, commit) so those remain permanent.
Note: the
@react-spectrum/comboboxcomponent already works around this by auto-settingallowsEmptyCollection: truewhenloadingStateis provided, but direct hook users (useComboBox+useComboBoxState) and RAC ComboBox users don't get this automatic behavior.Test plan
Closes #9820