Menu rendering should be delayed until new options arrive

Version

1.4.2

Steps to reproduce

Create an <AsyncTypeahead> with minLength=3. After the user types in the third character, a search is executed and the results are shown, just as expected.

The user then deletes all characters and starts typing again, with another search query term. After the third keystroke, a new search is being executed, but in the meantime the dropdown menu shows up, showing the results of the first query. Once the results of the second query come in, the drop down menu is re-rendered. This leads to user confusion and interface flickering.

(The problem is independent of minLength, but is more prominent when using it.)

Expected Behavior

Async Typeahead should wait after a query is being executed until new (changed) options arrive.

[ericgio]

This is happening because of the debouncing that’s built into the async version. There’s a delay between the time the user has finished typing and when the onSearch callback fires, during which other things might happen immediately. This is admittedly weird, so I’ll have to think about what the right behavior is and how it might be fixed (eg: temporarily suppressing the menu).

[pmcavoy89]

@derwaldgeist My bad, I missed that last bit.