Enforces WCAG 2.1 AA compliance through automated axe-core scanning and keyboard navigation testing.
The Frontend Accessibility Guardrail is a specialized quality gate (Gate 2) within the Ring development workflow. It ensures that all TypeScript-based frontend components meet strict accessibility standards before proceeding to unit testing. By orchestrating automated axe-core scans, verifying semantic HTML, and testing complex interactions like focus traps and keyboard navigation, this skill prevents accessibility debt and ensures inclusive user experiences. It features an automated fix-and-retry loop, dispatching corrections to engineering agents if violations are detected.
Key Features
01Focus management testing for modals, dialogs, and overlays
02Automated axe-core scanning for zero WCAG 2.1 AA violations
03Semantic HTML and ARIA attribute verification
04Automated remediation loop with up to three fix iterations
05Keyboard navigation validation for all interactive elements
06135 GitHub stars
Use Cases
01Validating color contrast and screen reader compatibility in React apps
02Auditing complex design system components for focus traps
03Ensuring new UI components meet legal accessibility requirements
