React-autosuggest: Suggestions list stuck open after dragging a suggestion outside of the autosuggest
Issue from here: https://github.com/callemall/material-ui/issues/7526#
imerkle
All 8 comments
Having read callemall/material-ui#7526, it's not clear to me what the issue is.
Could you please list the steps to reproduce the issue?
cc @oliviertassinari
moroshko
on 24 Jul 2017
Here is an example, I hope that helps:
oliviertassinari
on 24 Jul 2017
After you drag the suggestion, the focus is no longer on the input.
What exactly do you expect to happen when pressing Up/Down afterwards?
moroshko
on 24 Jul 2017
@moroshko I don't think that the issue is with the keybinding, but rather with an opened suggestion list. Focusing and blurring the input will no longer close the suggestions.
oliviertassinari
on 24 Jul 2017
I'm experiencing the same behavior after the click hold and mouse-out, where the suggestions will no longer close. Did anyone figure out a work around?
mrmojica
on 27 Jul 2017
Yep, it's a bug.
In case anyone would like to contribute a PR, here are the steps to reproduce it:
- Visit http://react-autosuggest.js.org
- Focus on the Basic example input
- Type
c - Drag one of the suggestions to the rest of the page
Observed behavior: The input loses focus, causing the suggestions to be stuck in a visible state (clicking outside of the autosuggest doesn't close the suggestions).
Expected behavior: The input keeps focus. Clicking outside of the autosuggest closes the suggestions. See Google's autosuggest as an example.
moroshko
on 28 Jul 2017
- The Mousedown handler is called and justSelectedSuggestion is set to true
- Then the input is blurred by the browser because you've clicked/dragged on another element other than the input box (aria-activedescendant doesn't seem to be doing its job)
- Even clicking the input box to try focus and unfocus it doesn't work because justSelectedSuggestion remains true and isn't set back to false except until you click a suggestion.
This code separates the blurring of the input box from the hiding of the container
if (!_this2.justSelectedSuggestion) {
_this2.onBlur();
_this2.onSuggestionsClearRequested();
}
I'm still trying to figure out a fix for this, but this is the cause I believe.
scotta-koorong
on 31 Jul 2017
Have anyone fix this issues? could you share how to fix this issues?
minhsong
on 23 Mar 2018
Related issues
Razinsky
路
3Comments
mkaemmerer
路
3Comments
fondberg
路
4Comments
marclemagne
路
4Comments
ashwintastic
路
3Comments
Most helpful comment
This code separates the blurring of the input box from the hiding of the container
if (!_this2.justSelectedSuggestion) { _this2.onBlur(); _this2.onSuggestionsClearRequested(); }I'm still trying to figure out a fix for this, but this is the cause I believe.