account.spec.ts narrow-viewport coverage + a11y fix (#113), login.spec.ts hover/focus/disabled/loading coverage (#114) - #115
Merged
Xore merged 1 commit intoAug 15, 2026
Conversation
…button-name a11y gap (#113) login.spec.ts: hover/focus/disabled/loading state coverage (#114) #113: account.spec.ts previously skipped every project but desktop-1440 outright, because below ~820px the sidebar nav collapses behind a hamburger toggle these tests never drove -- nav text was present in the DOM but hidden off-canvas, timing out at 30s per test and blowing CI's 15-minute regression budget once this file entered the project matrix. Added openSidebarNav()/closeSidebarNavIfOpen() and wired them into every describe block that navigates via the sidebar; the "Personal info" screenshot tests stay desktop-1440-only since they already manage their own explicit viewport contexts (a real redundancy concern, not the hamburger gap). Un-skipping the suite surfaced two further narrow-only UI collapse patterns (both now handled): the masthead's user-menu options move into its own kebab below `lg`, and each credential row's own action (e.g. "Set up Authenticator application") moves into a per-row kebab the same way. Also fixed the real bug #113 was filed for: a critical WCAG button-name violation at mobile-390/iphone-393 on an icon-only "more actions" kebab button (`pf-v5-c-menu-toggle.pf-m-plain`) with no aria-label, no text, and no aria-labelledby -- present at the masthead level and, found while fixing the above, per-credential-row too. Compiled upstream PatternFly/ React markup, so patched post-render via a new xore-account.js (theme.properties' `scripts=`, mirroring the login theme's own xore-auth.js) that labels every instance of the pattern via a MutationObserver, not just the one axe happened to visit. #114 (#91's own acceptance criteria: "hover, focus, disabled, loading" state coverage, never explicitly covered): added primary/secondary button hover+focus computed-style assertions (toHaveCSS, not a bare evaluate() read, to avoid racing login.css's own background-color transition), a real network-delayed submit to catch the button disabled mid-flight, and a busy-state check on the WebAuthn registration ceremony (aria-busy/.kc-busy applied synchronously by xore-auth.js's own click listener, checked via a single page.evaluate() click+read so it can't race the ceremony itself resolving).
Xore
deleted the
fix/113-114-account-narrow-viewport-and-state-coverage
branch
August 15, 2026 00:56
This was referenced Aug 15, 2026
Xore
added a commit
that referenced
this pull request
Aug 15, 2026
…116) * account.spec.ts: mask the live "Created" timestamp in the signing-in screenshot The Theme CI workflow started failing on main after PR #115 merged: the new mobile-390/iphone-393 account-signing-in.png baselines (generated locally) bake in the password credential's real "Created <timestamp>" line, which reflects whenever that realm/user was actually provisioned -- different every CI run against the disposable Keycloak fixture, and different again from whatever moment the baseline itself was captured. CI failed with an ~8000-pixel diff, entirely the timestamp string's own length/wrap shifting the layout after it. Mask [data-testrole="created-at"] instead of asserting on it -- its exact value was never what this screenshot exists to verify. Regenerated all six masked baselines against a fresh disposable Keycloak. * account.spec.ts: use CI-rendered baselines for signing-in at mobile-390/iphone-393 The mask fix alone wasn't enough -- CI still failed with an ~8000-pixel diff, but this time every glyph on the page showed as different in the diff overlay, not just the (now-masked) timestamp region: my local sandbox's font rendering doesn't produce pixel-identical text to GitHub Actions' own Ubuntu runner, even for the same font files. A baseline captured locally can never match CI's render for a text-heavy page like this one. Pulled the actual CI-rendered screenshots straight from the failed run's playwright-report artifact (run 31856507193) and committed those as the baseline instead of re-capturing locally. tablet-820/uhq-1920/uhd-3840's signing-in baselines and every Applications baseline weren't flagged by either CI run, so they're left alone -- this environment mismatch apparently doesn't cross the 2% diff threshold for those, just this particular text-dense page at these two narrower widths.
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
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.
Summary — #113
account.spec.tspreviously skipped every project butdesktop-1440outright: below ~820px the sidebar nav collapses behind a hamburger toggle these tests never drove, so nav text was present in the DOM but hidden off-canvas -- a 30s timeout per test that blew CI's 15-minute regression-job budget once this file entered the project matrix.openSidebarNav()/closeSidebarNavIfOpen()and wired them into every describe block that navigates via the sidebar. "Personal info"'s own screenshot tests staydesktop-1440-only -- they already manage their own explicit viewport contexts (a real redundancy concern, not the hamburger gap), the WCAG check does not (it needs to run at every width, since that's where the real bug lives).lg, and each credential row's own action (e.g. "Set up Authenticator application") moves into a per-row kebab the same way.pf-v5-c-menu-toggle.pf-m-plain) with no aria-label, no text, no aria-labelledby. This is compiled upstream PatternFly/React markup, so it's patched post-render via a newxore-account.js(theme.properties'scripts=, mirroring the login theme's ownxore-auth.js) that labels every instance of the pattern via aMutationObserver-- found live that the same unlabeled-kebab pattern also exists per-credential-row, not just at the masthead, so it targets the class rather than one specificdata-testid.Summary — #114
#91's own acceptance criteria calls for "hover, focus, disabled, loading" state coverage; none of the four had explicit, intentional coverage before this.toHaveCSS(not a bareevaluate()read, which raced login.css's ownbackground-colortransition and flaked).page.routeholding thelogin-actions/authenticatePOST) to catch the button disabled mid-flight -- Playwright's own locator actions wait for in-flight navigation to settle before running at all, so both the click and the disabled-read happen inside onepage.evaluate()to avoid deadlocking against the held request.aria-busy/.kc-busy(xore-auth.js's own click listener) apply synchronously the instant the ceremony starts, read the same single-evaluate()way so it can't race the ceremony itself resolving.Test plan
account.spec.tsrun across all 6 projects: only the 2 pre-existing font-rendering screenshot diffs remain (present before any of these changes, unrelated to them) -- everything else passes, including every newly-unskipped test.login.spec.tsrun across all 6 projects: only pre-existing font-rendering/timestamp screenshot noise remains -- every#114test and the modified WebAuthn test pass cleanly on every project.