react-scroll-to-bottom icon indicating copy to clipboard operation
react-scroll-to-bottom copied to clipboard

List at top and insert new items

Open freenetbrasil opened this issue 6 years ago • 1 comments

When I scroll up to the top my components requests, new items are inserted at the start of the list, so for example if we have an array of:

[10, 11, 12, 13]

After the scrolling up it would become:

[1,2,3,4,10,11,12,13]

But now the scroll is positioned on item 1, would it be possible to keep the cursor at item 10 where it was before the new items?

Thanks

freenetbrasil avatar Oct 07 '19 14:10 freenetbrasil

This is not trivial since the browser may also provide artificial scrolling.

For example, if you go to https://compulim.github.io/react-scroll-to-bottom, the right hand side is a sticky top panel.

When you click the "Insert item" on top, it is prepending to the list, which is same as what you mention in the issue.

If you use Chrome, you will see what you want. But if you use Edge, Firefox, and Safari, it won't. This is because Chrome artificially locked the scroll bar before inserting the element, and unlocked afterward. This is done natively.

I need to investigate but it doesn't sounds trivial to me at first, given that a lot of scroll event we received are not due to user gesture, but browser artificial scrolling like this one.

compulim avatar Nov 09 '19 01:11 compulim