[test] Automate 2.4.7 Focus Visible - #48945
Draft
michelengelen wants to merge 13 commits into
Draft
Conversation
Deploy previewBundle size
Check out the code infra dashboard for more information about this PR. |
Lets a fixture assert every axe rule it exercises rather than only the CSS-dependent visual ones, which is what the per-component WCAG reports need.
Adds a table-driven Playwright suite covering 1.4.10 Reflow, 1.4.4 Resize Text and 1.4.12 Text Spacing across the assessed components. axe has no rule for any of them, so they were rated Manual on evidence from source review.
Adds `pnpm a11y:scorecard`, which parses the count table out of every `<Component>/accessibility.md`, regenerates the index table, and emits the JSON that the public conformance page is built from. `--check` fails when either output is stale so a new report cannot land without its rollup.
Compares each control focused and unfocused in a real browser. axe has no rule for this criterion, and the existing unit tests for it are skipped under jsdom, so it rested on source review alone. Drops the evidence flag on the six components that carried one. The rating stays Hybrid rather than Automated: the test proves an indicator exists, not that it has enough contrast, which is 1.4.11 and still manual.
michelengelen
force-pushed
the
a11y/stack/focus-visible
branch
from
August 11, 2026 12:25
da38130 to
fda28fb
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Automates 2.4.7 Focus Visible across the seven components that rate it, by comparing each control focused and unfocused in a real browser.
axe has no rule for this criterion, and the unit tests that exist for it are
skipIf(isJsdom())— so they never actually run. It was rated on source review alone.Why a pixel comparison rather than a computed-style diff: MUI's focus indicator is usually the ripple, a child element that appears in the DOM. Diffing styles on the control itself would miss it entirely and report a false failure. The capture is padded by 8px so an outline painted outside the control's box still counts.
I mutation-tested the assertion rather than trusting a green run: stripping outlines, box-shadows and the ripple makes 4 of the 7 fail. The remaining three have additional real indicators the sabotage did not remove — TextField's notched-outline border colour, for instance.
The rating stays 🔁 Hybrid, not ⚙️ Automated. The test proves an indicator exists, not that it has enough contrast — that is 1.4.11, which is still manual. What changes is the evidence flag: six components drop their 🚩, taking verified coverage from 184/230 to 190/230.
Follow-up is 1.4.11 itself. A spike confirmed it can be measured without new dependencies by screenshotting an element, letting the browser decode it into a canvas, and sampling pixels — that reproduced the Switch thumb-vs-track ratio at 2.26:1, inside the 1.8–2.6:1 range measured by hand in the report.
Important
How to review this PR
Layer 13 of 14 in a stacked series (#48915 → #48926). Its branch is built on
a11y/stack/scorecard(#48925). GitHub cannot chain PR bases across a fork, so every PR in the series targetsmasterinstead.Review only the last commit —
fda28fb. Everything above it belongs to the layers below, and disappears as those merge.Part of the WCAG conformance effort (#14187).