search

webscopeio / react-textarea-autocomplete

📝 React component implements configurable GitHub's like textarea autocomplete.
MIT License
454 stars 80 forks source link

Fix scroll position for chrome #97

Closed superandrew213 closed 6 years ago

superandrew213 commented 6 years ago

Chrome does not maintain scroll position after item is selected.

To replicate: On chrome browser go here and enter a couple of lines of text. Scroll to top and add :smile.

Solution Just save scroll position before and apply it after caret position has been set.

2 other solutions have been suggested here: https://stackoverflow.com/questions/7464282/javascript-scroll-to-selection-after-using-textarea-setselectionrange-in-chrome

I coudn't get them to work properly. One doesn't work with line breaks and the other one doesn't scroll to the exact same position user was before they selected one of the items.

jukben commented 6 years ago

Hey! Thanks for the contribution, could you please provide pictures before and after the patch? I'm not able to observe anything wrong on my Chrome (macos 70.0.3538.77). 🙏

superandrew213 commented 6 years ago

This is on Chrome (macos 70.0.3538.77). Works fine on Safari and Firefox.

screenrecording

superandrew213 commented 6 years ago

Test fix here: https://codesandbox.io/s/wwv99zo545

jukben commented 6 years ago

Thanks, @superandrew213 so much for that reproduction material! I love the sandbox :) However, it's super crazy weird, because for me it works just fine. (both textareas, that's the thing!). Are you able to reproduce this in the different environment?

PS: Oh I can see! I have to click on it! (I always used the enter 😥). Nice let's merge it, thanks for that!