Repository navigation
HTML integration for document.advanceFocus() and beforefocus #13104
Description
What problem are you trying to solve?
Keyboard users need predictable navigation through composite controls, including controls containing third-party web components or embedded documents. Applications sometimes need to choose an entry point or move to the next control using the browser's existing sequential focus order, without reconstructing that order in JavaScript or changing the DOM to insert navigation sentinels.
A related use case is preventing an unwanted focus move, such as an embedded component taking focus away from the control the user is operating, rather than moving focus back after it has already changed. The requirements include composing with shadow DOM and frames while preserving users' ability to navigate and leave the application.
What solutions exist today?
element.focus() works when the application already knows the destination. Libraries use DOM traversal, tabindex changes, roving tabindex and sentinel elements to implement broader navigation patterns. Focus/blur listeners can react to a move, but do not provide a cancellable hook before it happens.
Related discussions include #4784 and #7924. Higher-level proposals such as focusgroup address related use cases; the question here is whether complementary lower-level navigation and interception primitives are appropriate.
How would you solve it?
I would like feedback on possible HTML integration of this Open UI incubation, rather than immediate specification adoption or shipping:
document.advanceFocus(options)uses the browser's sequential focus navigation, with direction, starting-point, containment and wrapping options. It returns a promise describing completion, including asynchronous cross-frame navigation, without returning a destination element from another document.- A cancellable
beforefocusevent lets an opted-in document intercept an impending focus move.
The current prototypes are disabled by default and require per-document opt-in. The explainer describes the proposed eligibility, user-activation and cancellation rules.
I would particularly appreciate feedback on integration with HTML's focus algorithms and event ordering; cancellation and reentrancy; asynchronous completion across frames; and safeguards around keyboard escape, embedded content and browser UI. The API shape and these design choices remain open for discussion.
Anything else?
Explainer: https://open-ui.org/components/beforefocus.explainer/
Prior Open UI discussion: openui/open-ui#1261.
Public WIP prototypes:
- Firefox: https://phabricator.services.mozilla.com/D335668
- Chromium: https://chromium-review.googlesource.com/c/chromium/src/+/8612302
Both include matching tentative Web Platform Tests, supplemented by native tests. These are contributor-maintained prototypes, not independent browser-vendor endorsements or shipping commitments.
Implementation tracking:
- Firefox bug 2084212: https://bugzilla.mozilla.org/show_bug.cgi?id=2084212
- Chromium issue 575489395: https://issues.chromium.org/issues/575489395
Activity