Skip to content

Implement :focus-visible - #799

Open
nicoburns wants to merge 1 commit into
mainfrom
devin/1787702364-focus-visible
Open

Implement :focus-visible#799
nicoburns wants to merge 1 commit into
mainfrom
devin/1787702364-focus-visible

Conversation

@nicoburns

@nicoburns nicoburns commented Aug 25, 2026

Copy link
Copy Markdown
Member

Summary

Wires up :focus-visible matching to the FOCUSRING element-state bit, and makes that bit reflect how focus was acquired instead of being set unconditionally on every focus.

  • New FocusSource { Keyboard, Pointer, Script } and BaseDocument::set_focus_to_with_source(id, source); set_focus_to(id) keeps its signature and now means Script.
  • Ring heuristics: Keyboard/Script focus → focus ring; Pointer focus → ring only for keyboard-input elements (text inputs). Refocusing an already-focused node with a different source updates the ring bit (snapshotted, so it restyles correctly).
  • Node::focus(shell_provider, focus_visible) sets FOCUS always and FOCUSRING conditionally; match_non_ts_pseudo_class now matches FocusVisible against FOCUSRING (previously hardcoded false).
  • Callers: Tab traversal (focus_next_node/focus_prev_node) → Keyboard; pointer/click handlers (text input, checkbox, radio, summary, subdoc, custom widget) → Pointer; autofocus and dioxus-native-dom script focus → Script.
  • UA stylesheet: input:focus, textarea:focus { outline: ... } replaced with a generic :focus-visible { outline: 2px solid #4D90FE; }, matching browser UA behavior — keyboard-focused buttons/links etc. now get a focus ring, mouse-clicked ones don't.

Link to Devin session: https://dioxus.staging.devinenterprise.com/sessions/65287500bfb04b2589b9fc6a08bc2d14
Open in Devin Desktop: https://dioxus.staging.devinenterprise.com/desktop/session/65287500bfb04b2589b9fc6a08bc2d14?variant=devin-insiders
Requested by: @nicoburns

WPT results

No changes in test results compared to main.

Generated by the WPT workflow.

@staging-devin-ai-integration

Copy link
Copy Markdown
Contributor

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR that start with 'DevinAI' or '@devin'.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

1 participant