accessibility-verification

Verify UI component accessibility with axe-core, keyboard navigation, screen readers, and Lighthouse.

4|1|Updated Oct 29, 2025

Search Tags:#testing #ui #inclusive design #accessibility #a11y #wcag

Ready to run

npx skills add https://github.com/bacchus-labs/wrangler --skill accessibility-verification

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: accessibility-verification
Source: https://github.com/bacchus-labs/wrangler/tree/main/.wrangler/memory/knowledge-base/reference-prompts/skills/ui-related-skills/accessibility-verification
Command: npx skills add https://github.com/bacchus-labs/wrangler --skill accessibility-verification

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires axe-playwright, jest-axe, lighthouse, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill ensures that all user interfaces are usable by everyone, regardless of ability, by enforcing accessibility standards and providing a systematic verification process.

Core Features & Use Cases

Automated Testing: Integrates with tools like axe-core to catch violations.
Manual Checks: Guides through essential keyboard navigation and screen reader testing.
Compliance Audits: Leverages Lighthouse for comprehensive accessibility scoring.
Use Case: Before deploying a new feature with a user form, this skill is invoked to guarantee it's navigable by keyboard, readable by screen readers, and passes automated checks, preventing legal issues and improving user experience.

Quick Start

Run the accessibility verification process for the newly implemented checkout page.

Frequently Asked Questions about accessibility-verification

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I automate accessibility testing for UI components?▼

Automate accessibility testing by integrating axe-core with frameworks like Playwright and Jest to scan UI components for WCAG violations. This approach systematically catches automated issues alongside manual keyboard navigation and screen reader checks.

What is the best way to verify WCAG compliance before deploying a new feature?▼

The best way to verify WCAG compliance is running Lighthouse audits and axe-core automated tests alongside manual checks. This ensures new features are navigable by keyboard, readable by screen readers, and meet legal accessibility requirements.

Does axe-core work with Playwright and Jest for frontend testing?▼

Yes, axe-core works with Playwright and Jest through dedicated testing libraries. These integrations allow you to automate accessibility checks directly within your existing frontend testing workflows to catch UI violations.

How do I test keyboard navigation and screen reader compatibility?▼

Test keyboard navigation and screen reader compatibility through guided manual checks. While automated tools like axe-core catch many violations, manual verification ensures interactive elements are fully navigable and readable by assistive technologies.

Why do I need Lighthouse audits for inclusive design if I already use axe-core?▼

You need Lighthouse audits for inclusive design because they provide comprehensive accessibility scoring beyond axe-core violations. Lighthouse evaluates overall compliance, complementing automated checks and manual screen reader testing for full WCAG adherence.

Can I check user forms for accessibility issues automatically?▼

Yes, you can automatically check user forms for accessibility issues using axe-core. Integrating these automated tests with Jest or Playwright ensures forms are keyboard navigable and compliant before deployment.