Skip to content

Commit 31cb504

Browse files
committed
test: add a11y tests for more components
1 parent c0fc8d9 commit 31cb504

File tree

3 files changed

+698
-52
lines changed

3 files changed

+698
-52
lines changed

CONTRIBUTING.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -409,10 +409,10 @@ describe('featureName', () => {
409409
410410
### Component accessibility tests
411411

412-
All new components should have a basic accessibility test in `test/nuxt/components.spec.ts`. These tests use [axe-core](https://github.com/dequelabs/axe-core) to catch common accessibility violations.
412+
All Vue components should have accessibility tests in `test/nuxt/a11y.spec.ts`. These tests use [axe-core](https://github.com/dequelabs/axe-core) to catch common accessibility violations and run in a real browser environment via Playwright.
413413

414414
```typescript
415-
import MyComponent from '~/components/MyComponent.vue'
415+
import { MyComponent } from '#components'
416416

417417
describe('MyComponent', () => {
418418
it('should have no accessibility violations', async () => {
@@ -429,6 +429,8 @@ describe('MyComponent', () => {
429429

430430
The `runAxe` helper handles DOM isolation and disables page-level rules that don't apply to isolated component testing.
431431

432+
A coverage test in `test/unit/a11y-component-coverage.spec.ts` ensures all components are either tested or explicitly skipped with justification. When you add a new component, this test will fail until you add accessibility tests for it.
433+
432434
> [!IMPORTANT]
433435
> Just because axe-core doesn't find any obvious issues, it does not mean a component is accessible. Please do additional checks and use best practices.
434436

0 commit comments

Comments
 (0)