ComboBox - searching items from table data source doesn't always open the picker

[bmingles]

When searching for items in a ComboBox backed by a table data source, sometimes the picker opens to show results as you type. Sometimes it does not.

I've filed a bug with Spectrum to address the root cause: adobe/react-spectrum#6638

UPDATE 07/11: Spectrum closed my bug ticket in lieu of this one adobe/react-spectrum#5234

Reproduction Steps

Run the below script

Working Scenario

1. Before selecting anything in the ComboBox, type 2024 very quickly (has to be quick to beat the debounce applying the change)
2. Should see ComboBox open showing all items for 2024
3. Clear the typing

Non-working Scenario

1. This time, type 2024 slowly so that the filter gets applied before you finish typing.
2. CombBox is no longer open
3. If you backspace the 4, ComboBox will open briefly then close. Typing 4 again will not re-open the ComboBox
4. If you backspace the 4 and type it again very quickly, it will re-open

from deephaven import empty_table, ui, time_table
import datetime

initial_row_count=5 * 8760 # 5 years
_items = time_table("PT6H", start_time=datetime.datetime.now() - datetime.timedelta(hours=initial_row_count)).update([])

key_column="Timestamp"

@ui.component
def ui_combo_box(items):
    value, set_value = ui.use_state()

    combo = ui.combo_box(
        items,
        key_column=key_column,
        label_column=key_column,
        label=key_column,
        on_selection_change=set_value,
        selected_key=value,
    )

    # Show current selection in a ui.text component
    text = ui.text("Selection: " + str(value))

    return combo, text


my_combo_box = ui_combo_box(_items)

I believe the root cause is the Spectrum ComboBox only shows the popup after the user types and there are items in the source array. Changing from an empty items array to one with data won't open the popup until user types.

Here's the impact of this:

1. User types 202 which gets applied to the list and results in no matching results due to how our date filter works.
2. User types 4
3. ComboBox still has empty items, so it doesn't open even though user typed
4. We apply the filter to jsapi which results in items array containing all 2024 data. This updates the ComboBox, but it doesn't automatically open when items change, only when user types
5. User backspaces 4 slowly. This flickers for a moment the 2024 data since it still exists in items, but then 202 is applied as filter resulting in empty items array. ComboBox rightly closes due to empty data
6. Typing 4 again repeats the issue in step 3.
7. Backspacing 4 and retyping quickly opens because the filter resulting in empty items is never applied, and user has typed while there are still results in items

I'm not sure how to get around this but seems we need a way to force the ComboBox to open if the items array goes from empty to populated as a result of a user key stroke.

Note: Worth mentioning that there are 2 additional menuTrigger modes that change the behavior of the dropdown opening that will need to be accounted for in whatever solution we may find.