skills.rest
rcellas
rcellasCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

vitest-a11y

Write Vitest accessibility tests covering WCAG 2.2 and ARIA APG patterns.

Updated Mar 13, 2026
Search Tags:#vitest#testing#accessibility#a11y#wcag#browser testing#aria
One-click install
npx skills add https://github.com/rcellas/vitest-a11y --skill vitest-a11y
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vitest-a11y
Source: https://github.com/rcellas/vitest-a11y/tree/main/skills/vitest-a11y
Command: npx skills add https://github.com/rcellas/vitest-a11y --skill vitest-a11y

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill empowers developers to write precise, non-flaky, and meaningful accessibility tests for their web applications using Vitest, ensuring WCAG compliance and adherence to W3C ARIA Authoring Practices.

Core Features & Use Cases

  • Comprehensive Accessibility Testing: Covers W3C ARIA patterns, WCAG 2.2 AA/AAA compliance, and real browser testing.
  • Mode Selection: Guides the use of Vitest's Browser Mode for interactive tests and jsdom mode for structural checks and axe scans.
  • Automated Fixes: Includes a mandatory autofix behavior for detected accessibility violations.
  • Use Case: Ensure your new modal component is fully accessible by testing its focus management, keyboard navigation, ARIA attributes, and screen reader announcements using Vitest Browser Mode.

Quick Start

Use the vitest-a11y skill to write accessibility tests for the provided React component.

Frequently Asked Questions about vitest-a11y

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

FAQPage Schema
How do I write non-flaky accessibility tests with Vitest?▼

Write non-flaky accessibility tests with Vitest by using a framework that enforces Gherkin syntax and covers W3C ARIA patterns and WCAG 2.2 AA/AAA compliance. It supports automated axe-core scans and real browser interactions to ensure precise validation.

Does Vitest Browser Mode work for interactive accessibility testing?▼

Vitest Browser Mode works for interactive accessibility testing by using Playwright to validate real browser interactions. This allows you to test focus management, keyboard navigation, and screen reader announcements for components like modals.

What is the best way to automate fixes for WCAG violations in Vitest?▼

The best way to automate fixes for WCAG violations in Vitest is to use a testing framework with a mandatory autofix behavior. This enforces automatic corrections for detected accessibility issues during your test runs.

Can I use axe-core with Vitest for automated accessibility scans?▼

You can use axe-core with Vitest for automated accessibility scans in jsdom mode. This combination allows you to perform structural checks and validate WCAG compliance efficiently without launching a full browser environment.

When should I use jsdom versus Browser Mode for accessibility testing?▼

Use jsdom mode for fast structural checks and automated axe-core accessibility scans. Use Vitest Browser Mode when you need to test real interactive behaviors like focus management, keyboard navigation, and screen reader announcements.

Why enforce Gherkin format for Vitest accessibility tests?▼

Enforcing Gherkin format for Vitest accessibility tests structures your scenarios clearly and consistently. This approach ensures precise testing of W3C ARIA Authoring Practices Guide patterns and WCAG compliance without flaky execution.

Related Skills

Explore More Software Engineering Skills→
mikemylmikemyl
1

react-testing

Test React components, hooks, and context providers with Vitest browser mode.

Community
Intermediate
hopeoverturehopeoverture
6

a11y-checker-ci

Automate WCAG accessibility checks in CI/CD pipelines and generate PR reports.

Community
Advanced
OpenCovenOpenCoven
20

wcag-a11y-audit

Audit web and desktop UIs for WCAG 2.2 AA compliance with axe-core, Playwright, and jest-axe.

Official
Advanced
kensleDevkensleDev

web-testing

Run web application tests with Playwright, Vitest, and k6.

Community
Advanced