Add scrollIntoView action - #1964
Conversation
| given optional arguments <var>onlyIfNecessary</var> (default true), | ||
| <var>behavior</var> (default "<code>instant</code>"), | ||
| <var>block</var> (default "<code>end</code>") | ||
| and <var>inline</var> (default "<code>nearest</code>"): |
There was a problem hiding this comment.
Not sure if nearest would work as default. Usually we use the element's in-view center point for the interaction and scrolling only as little as possible most likely would still keep the majority of the element outside of the viewport. Should we maybe use end here as well similar to what we use for block?
| <dt><a>Logical scroll position "<code>inline</code>"</a> | ||
| <dd>"<code>nearest</code>" | ||
| <li><p>If <var>onlyIfNecessary</var> is true | ||
| and <var>target</var> is <a data-lt="range is in view">in view</a>, return. |
There was a problem hiding this comment.
This renders in view similarly to the above option and is confusing. We most likely want target's <a>range is in view</a> or similar.
Also here we only test the viewport overlapping for the first client rect (shouldn't we take all into account?).
Per AI it might cause issues with overflow: hidden when in view would return true but it's actually clipped by the container. So onlyIfNecessary would wrongly skip the scroll. If that's acceptable it might warrant at least a note. By lets see what @jgraham will think about it.
| <li><p>Let <var>inline</var> be the <code>inline</code> | ||
| property of <var>action object</var>. | ||
|
|
||
| <li><p><a>Scroll into view</a> <var>node</var> with |
There was a problem hiding this comment.
If we have a scrolling behavior of auto or smooth the scrolling will be asynchronous. We should wait until the scrolling is done before continuing dispatching the remaining actions.
|
|
||
| <li><p>Run <a>Function.[[\Call]]</a>(<a>scrollIntoView</a>, <var>options</var>) | ||
| with <var>element</var> as the this value. | ||
| <li><p><a>Scroll <var>target</var> into view</a> |
There was a problem hiding this comment.
Is it ok to put a var inside an anchor?
| <var>action</var>, and <var>actions options</var>:</p> | ||
|
|
||
| <ol class="algorithm"> | ||
| <li><p>Let <var>node</var> be the result of <a>getting the property</a> |
There was a problem hiding this comment.
Some lines up we use getting a property. What shall we use?
This PR adds
scrollIntoViewto the general actions.The action should also be able to scroll text nodes (which can be passed in from WebDriver BiDi) and elements with
display: contentsinto view. To this end, the "scroll into view" steps are updated to create aRangeobject for such nodes and call the "Scroll target into view" steps in the CSSOM View spec (which supportRanges) directly.Note that this is a breaking change for interaction commands that implicitly scroll an element into view: previously, the implicit attempt to scroll an element with
display: contentsinto view would do nothing but now it will be scrolled into view.Fixes #1005.
This change is
Preview | Diff