Google Chrome: Simultaneously 'smooth' scrollIntoView() with more elements doesn't work

Question

In Google Chrome, element.scrollIntoView() with behavior: \'smooth\' doesn\'t work on multiple containers at the same time. As soon as smooth scrolling

Answer 1

A similar question was asked here: scrollIntoView() using smooth function on multiple elements in Chrome, but the answer is not satisfying, as it states, that this isn't a bug but.

But it seems to be a bug and it is already reported in the Chromium bug list:

• https://bugs.chromium.org/p/chromium/issues/detail?id=1121151
• https://bugs.chromium.org/p/chromium/issues/detail?id=1043933
• https://bugs.chromium.org/p/chromium/issues/detail?id=833617.

For smooth scrolling of multiple elements at the same time using scrollIntoView (for at least some of the elements) we need to wait for a fix from the Chromium team.

An alternative approach is using scrollTo which is working for multiple elements also in Chrome. See scenario 5 in this example: https://jsfiddle.net/2bnspw8e/8/.

The downside is that you need to get the next scrollable parent of the element you want to scroll into view (see https://stackoverflow.com/a/49186677 for an example), calculate to offset which is needed to scroll the parent to the element and call parent.scrollTo({top: calculatedOffset, behavior: 'smooth'}).