feat(a11y): add axe-core accessibility E2E spec with focus-visible test
This commit is contained in:
parent
4905e351e2
commit
1bab8a87ac
39
web/e2e/accessibility.spec.ts
Normal file
39
web/e2e/accessibility.spec.ts
Normal file
@ -0,0 +1,39 @@
|
||||
import { test, expect } from '@playwright/test';
|
||||
import AxeBuilder from '@axe-core/playwright';
|
||||
|
||||
const routes = ['/', '/dashboard', '/workspaces', '/search', '/reviews'];
|
||||
|
||||
for (const route of routes) {
|
||||
test(`accessibility: ${route} has no critical violations`, async ({ page }) => {
|
||||
await page.goto(route);
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
const results = await new AxeBuilder({ page })
|
||||
.withTags(['wcag2a', 'wcag2aa', 'best-practice'])
|
||||
.analyze();
|
||||
|
||||
const critical = results.violations.filter(
|
||||
(v) => v.impact === 'critical' || v.impact === 'serious'
|
||||
);
|
||||
|
||||
if (critical.length > 0) {
|
||||
const summary = critical
|
||||
.map((v) => `[${v.impact}] ${v.id}: ${v.description} (${v.nodes.length} nodes)`)
|
||||
.join('\n');
|
||||
console.log(`Accessibility violations on ${route}:\n${summary}`);
|
||||
}
|
||||
|
||||
expect(critical).toHaveLength(0);
|
||||
});
|
||||
}
|
||||
|
||||
test('accessibility: focus-visible ring appears on tab navigation', async ({ page }) => {
|
||||
await page.goto('/dashboard');
|
||||
await page.waitForLoadState('networkidle');
|
||||
await page.keyboard.press('Tab');
|
||||
await page.keyboard.press('Tab');
|
||||
|
||||
const focused = page.locator(':focus-visible');
|
||||
const count = await focused.count();
|
||||
expect(count).toBeGreaterThan(0);
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user