search

Inwerpsel / use-theme-editor

A React theme editor
GNU General Public License v3.0
4 stars 0 forks source link

When using `scrollIntoView`, smooth scrolling is very fragile and easy to interrupt #60

Open Inwerpsel opened 7 months ago

Inwerpsel commented 7 months ago

If you travel through history fast enough (not even that fast), it will interrupt certain smooth scrolls in the frame, leaving the position somewhere along the way to the element.

As a result, the history timeline is already not using smooth because this issue happened too much.

When scrolling the inspected element into view, it seems to get interrupted by scrolling (in a slightly later history step) an element into view inside another parent. This might be a bug in the browser (tested only Chromium) and is unfortunate at least.

For example, if you first scroll past a step that focuses an element inside the app frame, and then to a next step which scrolls a section of the inspector into view, then the scrolling in the app frame gets stopped along the way.

It only seems to happen for scrollIntoView. The sidebar has similar functionality, except it uses a stored integer offset. This seems to end up on the right position regardless of any later events.

If 2 separate elements like this are scrolled into view at the same time (so in a single history step), there's no problem.

Inwerpsel commented 5 months ago

Smooth scrolling is now only used a in a few places anymore where it's unlikely to get interrupted.

For most purposes, instant scrolling actually turned out to feel smoother than multiple consecutive smooth scrolls.