The root cause of the problem: clicking an element inside the list and then scrolling down removes the said element from the document. From there on, the browser no longer considers the scroller of the list to be the active one.
Thank you, Petyo for helping me understand the "why" the problem occurred.
I've tried the updated list and it scrolls with keys naturally :)
And to rephrase my understanding, when a user clicks on an element, keyevent is bound to the item, and when scrolled away from the viewport, the keyevent is no longer triggered?
Your understanding is correct. The scrolling away from the viewport is not the problem, but rather the fact that the virtualization mechanism removes the element once it is no longer visible.
Once this happens, the browser will emit subsequent keyboard events from the document element.
Hey there,
Hey! I just got the same problem reported in react-virtuoso. Published a fix for it in the
0.2.0
release, that should address the problem in a native manner. Please give the home demo a try.The root cause of the problem: clicking an element inside the list and then scrolling down removes the said element from the document. From there on, the browser no longer considers the scroller of the list to be the active one.
Thank you, Petyo for helping me understand the "why" the problem occurred.
I've tried the updated list and it scrolls with keys naturally :)
And to rephrase my understanding, when a user clicks on an element, keyevent is bound to the item, and when scrolled away from the viewport, the keyevent is no longer triggered?
Your understanding is correct. The scrolling away from the viewport is not the problem, but rather the fact that the virtualization mechanism removes the element once it is no longer visible.
Once this happens, the browser will emit subsequent keyboard events from the document element.
Thank you again for clearing up my understanding, Petyo :)