Tuesday, 10 May 2022

scrollIntoView seems to be only then executed if triggered by a click event directly

I have created a table and to the left and right of it some arrows, which allow for changing and highlighting the selected row. Upon clicking on either of these arrows, I call a scrollIntoView method:

row.scrollIntoView({
    block: "nearest",
    behavior: "smooth"
});

Instead of only adding a click-Listener to the arrows, I have now added a keydown-Listener to the window-element. If I am pressing the ArrowLeft button on my keyboard, I execute the arrowLeftIcon.click() event. The same holds for the right arrow. Highlighting the corresponding table row works smoothly. However, I have noticed that the scrollIntoView method does not work at all when switching rows by the keydown-Events.

I have no explanation for this behaviour - the keydown-Event is just triggering the click-Event, which works fine. For some reason, I believe, scrollIntoView does only work if it was triggered by a click event directly. Can somebody explain this to me? Do you have an idea how I could still scroll the table row into view, when selecting it by a keydown-Event?

===================

update:

I have just realized that this behaviour occurs only on Chrome. Firefox works allright.



from scrollIntoView seems to be only then executed if triggered by a click event directly

No comments:

Post a Comment