Problem with ensureFocusedSuggestionIsVisible

[thomasbottonari]

Hi @moroshko,

I'm using the react-autosuggest component and applying the following two styles to the suggestionsContainer in my theme in order to get a scrollable dropdown when there are enough suggestions to exceed 300px:

.autosuggest-menu-outer {
  max-height: 300px;
  overflow: auto;
}

A recent change to react-autowhatever seemed to introduce a bug where if I scroll down in the list and then move my mouse pointer to the top element I can get the list to scroll by itself all of the way to the top of the list without ever touching the mouse wheel. I've been able to reproduce this on a variety of platforms and browsers (currently on Mac Chrome), but it seemed to be more serious in Windows. Looking at the code in ensureFocusedSuggestionIsVisible, it seems that it will autoscroll to align the top of a focused item to the container. The bug is likely around this logic as even after the initial alignment I seem to be able to get it to then align to the previous item indefinitely. When I built react-autosuggest with a react-autowhatever dependency of '~3.1.0' instead of '^3.1.0' the problem went away.

Steps to reproduce:

1. Check out this JSFiddle
2. Type A in the input
3. Scroll to the bottom
4. Move the mouse pointer to the first visible item in the dropdown (it should align to the top of that item)
5. Continuously move the mouse just above the react-autosuggest__suggestions-container and then back on to the first visible item and watch the list continue to scroll until it hits the top.

[moroshko]

@pdc Any chance you could help with this one?

[cuervodelviento]

Is any workaround available for this issue? I'm having the same autoscroll issue in react-autosuggest 10.1.0