Scroll Into View doesn't work for Element Click cases where element is bigger than viewport

[InstyleVII]

Sample gist here

Going by the spec's current writing Element Click would fail as all browsers when calling ScrollIntoView on the button would scroll to the bottom of the element (not the middle) and don't scroll horizontally whatsoever.

[andreastt]

What do you mean by ‘fail’? The way I read the spec it isn’t meant to scroll at all in this case, because scroll into view is defined like this (my highlighting):

To scroll into view an element perform the following steps only if the element is not already in view:

In other words, if the in-view centre point of the element can be reached already there is no call to scroll it into view.

That said, I think the desired scrolling behaviour in cases where scrolling is necessary would be to try to reach the middle of the element. Last I checked the center option for ScrollIntoViewOptions given to Element.scrollIntoView() wasn’t widely supported.

We chose bottom as a compromise because it is more common for display: fixed elements such as menus to overlap the top. We currently don’t handle scrolling to elements hidden behind fixed elements at all, and I’m not sure there’s any way we can get around that. Of course, the middle of the element would be better if UAs supported it.

[InstyleVII]

Ah I see I missed the in-view center point definition which actually accounts for viewport using innderWidth/innerHeight. We'll need to re-define that in our code. Agreed that scrolling to the center of the button is more preferable, and will test to see if we support center for scrollIntoView.