Feat/issue 293 a11y audit#381
Open
Lansa-18 wants to merge 3 commits into
Open
Conversation
Contributor
Author
|
@kilodesodiq-arch Kindly review. All CI checks passes. |
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
1 participant
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.
Closes #293
feat(a11y): WCAG 2.2 AA Audit, Axe Test Suite, and Frontend CI (#293)
Summary
Delivers the accessibility audit and CI-enforced axe test suite requested in the issue. Adds a written WCAG 2.2 AA audit, an axe-core jest suite covering 5 page states, a new frontend CI workflow, and the minimal a11y fixes needed to make the suite pass.
What This Adds
1. Written WCAG 2.2 AA Audit —
docs/accessibility/audit-2026.mdPer-page pass/fail tables for
/,/campaigns,/claim-receipt, and cross-cutting concerns (root layout/Navbar), plus a 9-item copy-paste-ready ticket backlog covering: skip link, per-locale<html lang>, browser-based contrast/focus pass, non-functional "Learn More" button, real/claims/[id]route, and more. Per the issue, findings become tickets — only the minimal fixes below are made here.2. Axe-core Jest Suite —
app/frontend/test/accessibility.spec.tsxRenders 5 page states and asserts zero axe violations:
Data hooks and
next/navigationare mocked with deterministic fixtures. Thecolor-contrastrule is disabled because jsdom has no layout engine (contrast is tracked as a manual browser pass in the audit). File is.tsxrather than the issue's.tsbecause it renders JSX.3. Frontend CI Workflow —
.github/workflows/frontend-ci.ymlNo CI workflow existed previously. Runs
lint → type-check → teston frontend paths, satisfying the "axe test runs in CI" acceptance criterion. The lint step is temporarilycontinue-on-errorbecausemaincarries 14 pre-existing lint errors unrelated to this branch (making it blocking is backlog ticket #9).4. Minimal A11y Fixes (so the suite passes)
Home/AidPackageListh1→h3heading skips (h3→h2, cardh4→h3); Tailwind classes unchanged, no visual shiftClaim-receiptrole="status"on the loading block,role="alert"on the error block,aria-hiddenon the spinner/alert icons and the←glyphCampaigns<main>landmark on the Access Denied branch; form feedback now typed success/error and rendered withrole="status"/role="alert"5. Prerequisite Fix (separate commit)
root package.jsoncontained invalid JSON (trailing comma inscripts) that broke every workspacepnpmcommand.Testing
Negative control: temporarily reverting one heading fix makes the suite fail with axe's
heading-orderrule, proving the axe scan is actually enforcing (fix restored afterward).Post-merge check: after merging the latest
main(new locales + CSP reporting), the full suite and type-check were re-run green.Screenshots
No visual changes — heading elements changed tag but kept their exact Tailwind classes, and the added ARIA roles/landmarks are invisible. Spot-checked
/en,/en/campaigns(NEXT_PUBLIC_USER_ROLE=ngo), and/en/claim-receipt?claimId=xrender identically.Checklist