# Accessibility Testing

Axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader...

- Repository: https://github.com/vibeeval/vibecosystem (541 stars)
- Category: Testing
- License: MIT
- Last updated: 2026-08-08
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add vibeeval/vibecosystem --skill accessibility-testing -g -a claude-code -y`
Codex: `npx skills add vibeeval/vibecosystem --skill accessibility-testing -g -a codex -y`
Cursor: `npx skills add vibeeval/vibecosystem --skill accessibility-testing -g -a cursor -y`
Gemini CLI: `npx skills add vibeeval/vibecosystem --skill accessibility-testing -g -a gemini-cli -y`

## Description

axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader testing, and ARIA pattern validation.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Accessibility Testing

## axe-core Setup

### jest-axe (unit / component tests)
```typescript
import { axe, toHaveNoViolations } from 'jest-axe'
import { render } from '@testing-library/react'
expect.extend(toHaveNoViolations)

test('LoginForm has no a11y violations', async () => {
  const { container } = render(<LoginForm />)
  const results = await axe(container)
  expect(results).toHaveNoViolations()
})
```

### playwright-axe (e2e)
```typescript
import { test, expect } from '@playwright/test'
import AxeBuilder from '@axe-core/playwright'

test('homepage passes axe audit', async ({ page }) => {
  await page.goto('/')
  const results = await new AxeBuilder({ page })
    .withTags(['wcag2a', 'wcag2aa', 'wcag21aa'])
    .analyze()
  expect(results.violations).toEqual([])
})
```

### cypress-axe
```javascript
// cypress/support/e2e.js
import 'cypress-axe'

// in test
cy.visit('/')
cy.injectAxe()
cy.checkA11y(null, {
  runOnly: { type: 'tag', values: ['wcag2aa'] },
})
```

## WCAG 2.2 AA Checklist, Top 20 Violations

The rest: https://github.com/vibeeval/vibecosystem/blob/HEAD/skills/accessibility-testing/SKILL.md