Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Define the block flow and inline base directions for dom-focus #9518

Closed
dlrobertson opened this issue Jul 13, 2023 · 1 comment · Fixed by #9527
Closed

Define the block flow and inline base directions for dom-focus #9518

dlrobertson opened this issue Jul 13, 2023 · 1 comment · Fixed by #9527
Labels
topic: focus

Comments

@dlrobertson
Copy link
Member

dlrobertson commented Jul 13, 2023 •
edited

When Element.focus() is used, the element should be scrolled into view such that the element is in a defined position. Currently dom-focus states:

[...] scroll the element into view with scroll behavior "auto", block flow direction position set to an implementation-defined value, and inline base direction position set to an implementation-defined value.

Added focus/focus-centers-element.html in web-platform-tests/wpt#41029 that essentially checks that Element.focus() behaves similar to Element.scrollIntoView({block: "center", inline: "center"}).

Test Blink WebKit Gecko Gecko (after bug 1842679)
Element.focus() center in the block direction ✅ ✅ ❌ ✅
Element.focus() center in the inline direction ✅ ✅ ❌ ✅
Element.focus() center in both directions ✅ ✅ ❌ ✅

Since browsers seem to agree that Element.focus() should center the element, it might make sense to specify this instead of leaving this implementation defined. Several web-platform tests assume that Element.focus() will cause an element to end in a certain scroll position (e.g. css/css-scroll-snap/scroll-target-margin-005.html), but AFAIK this is essentially undefined behavior (at least from the specs point of view).
@dlrobertson
Copy link
Member Author

CC @emilio

dlrobertson added a commit to dlrobertson/html that referenced this issue Jul 17, 2023
@dlrobertson
Remove some implementation defined behavior from focus.
f6fcd3c 
Remove the implementation defined behavior in the definition of the
block and inline arguments passed to scroll a target into view.

Fixes: whatwg#9518
dlrobertson added a commit to dlrobertson/html that referenced this issue Jul 17, 2023
@dlrobertson
Remove some implementation defined behavior from focus.
69c42d0 
Remove the implementation defined behavior in the definition of the
block and inline arguments passed to scroll a target into view.

Fixes: whatwg#9518
@dlrobertson dlrobertson mentioned this issue Jul 17, 2023
Merged
4 tasks
dlrobertson added a commit to dlrobertson/html that referenced this issue Jul 18, 2023
@dlrobertson
Remove some implementation defined behavior from focus.
3d4412c 
Remove the implementation defined behavior in the definition of the
block and inline arguments passed to scroll a target into view.

Fixes: whatwg#9518
domenic pushed a commit that referenced this issue Jul 19, 2023
@dlrobertson
Make focus() always center the element it scrolls into view
3f59ce2 
Previously, the inline position was implementation-defined, whereas the block position was centered. Now, they are both centered. Fixes #9518.

Also updates to use CSSOM View's new "scroll a target into view" algorithm, which replaces the broken link to "scroll an element into view" that we were previously trying to invoke.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
topic: focus
Milestone
No milestone
2 participants
@emilio @dlrobertson