Accessibility Auditor Wcag 2 2

Find accessibility barriers and WCAG 2.2 AA failures in web and mobile UI code — with file:line, the exact criterion, and a fix

Install
cmdop skills install agensi-accessibility-auditor-wcag-2-2

Accessibility Auditor WCAG 2.2 is a skill that performs static analysis of UI source code to identify barriers that fail WCAG 2.2 AA. It supports web frameworks — React, Vue, Angular, Svelte, and plain HTML — as well as mobile frameworks including React Native, Flutter, native iOS with SwiftUI, and native Android with Compose.

The audit covers names and labels (icon-only buttons, unlabeled inputs, missing alt text), keyboard and focus behavior (keyboard traps, removed focus indicators, bad tab order), color contrast computed against the 4.5:1 threshold when colors are statically resolvable, document structure (heading order, landmarks, semantic HTML), form patterns (placeholder-as-label, errors not associated with fields), WCAG 2.2-specific criteria (24×24 target size, focus not obscured, dragging alternatives, paste-blocking on OTP fields), and mobile-specific concerns (accessibilityLabel, contentDescription, touch targets, VoiceOver and TalkBack announcements, reduced motion).

The skill detects the applicable legal regime automatically — EU Accessibility Act / EN 301 549, ADA, Section 508, or AODA — and cites it in each finding. Output is an ACCESSIBILITY_AUDIT.md file where findings are graded Critical, High, Medium, or Low by user impact. Each entry includes file and line number, the exact WCAG criterion, who is blocked and from what, and a framework-idiomatic code fix. Checks requiring runtime assistive-technology testing are placed in a separate Verify manually section rather than reported as false passes. The skill does not run axe or Lighthouse, does not produce a binding VPAT or ACR, and cannot evaluate dynamic runtime behavior.

Use cases

  • Audit a React or Vue codebase for WCAG 2.2 AA failures before a production release
  • Identify which accessibility issues block screen-reader users from completing a checkout or form flow
  • Generate an ACCESSIBILITY_AUDIT.md to prioritize remediation work by user impact severity
  • Check a Flutter or SwiftUI app for missing accessibilityLabel and touch-target size failures
  • Prepare evidence toward a VPAT/ACR by getting a structured list of findings with WCAG criterion references
  • Catch EU Accessibility Act compliance gaps in code review rather than after deployment

When to use it

  • The codebase targets web or mobile frameworks the skill supports (React, Vue, Angular, Svelte, HTML, React Native, Flutter, SwiftUI, Compose)
  • Legal compliance with EAA, ADA, Section 508, or AODA is a requirement
  • A11y findings are needed at file:line granularity with specific WCAG criterion references
  • The team wants accessibility issues graded by actual user impact rather than abstract rule numbers
  • A11y review needs to happen in the agent workflow before code reaches QA or production

When not to use it

  • A binding VPAT or ACR document is required — this skill does not produce one
  • Runtime behavior with assistive technology must be verified — static analysis cannot cover these
  • The project uses UI frameworks outside the supported list
  • Automated axe or Lighthouse integration is needed as part of the audit output
  • A full formal conformance evaluation for regulatory submission is required