Skip to content

HTML integration for document.advanceFocus() and beforefocus #13104

Open

Description

@mshoho

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 beforefocus event 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:

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:

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    addition/proposalNew features or enhancementsneeds implementer interestMoving the issue forward requires implementers to express interest

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions