Coverage is lost at the ticket, not at the tool.

npm i -D @playwright/test @axe-core/playwright
npx playwright install --with-deps chromium

// playwright.config.js
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  use: { baseURL: process.env.BASE_URL ?? 'http://localhost:5173' },
  // Every test runs twice: the desktop layout and the phone one.
  projects: [
    { name: 'desktop', use: { ...devices['Desktop Chrome'] } },
    { name: 'phone', use: { ...devices['Pixel 7'] } }
  ]
});

// tests/a11y/scan.spec.js
import { test, expect } from '@playwright/test';
import AxeBuilder from '@axe-core/playwright';

const TAGS = ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'wcag22aa'];
const scan = (page, within) =>
  new AxeBuilder({ page }).withTags(TAGS).include(within).analyze();

// What the pull request changed: the component, once it is open.
test('newsletter dialog has no axe violations', async ({ page }) => {
  await page.goto('/');
  await page.getByRole('button', { name: 'Subscribe' }).click();
  const { violations } = await scan(page, '[role=dialog]');
  expect(violations.map((v) => v.id)).toEqual([]);
});

// Shared templates: one page each, at rest. Seconds per page.
for (const path of ['/', '/products/example', '/checkout']) {
  test(`axe ${path}`, async ({ page }) => {
    await page.goto(path);
    const { violations } = await scan(page, 'body');
    expect(violations.map((v) => v.id)).toEqual([]);
    // Reflow (WCAG 1.4.10): no sideways scroll at 320px wide.
    await page.setViewportSize({ width: 320, height: 800 });
    const over = () => document.documentElement.scrollWidth > 320;
    expect(await page.evaluate(over)).toBe(false);
  });
}

// tests/newsletter.spec.js
// The feature’s own test, with its accessibility requirements in it.
test('newsletter dialog keeps focus', async ({ page }) => {
  await page.goto('/');
  const opener = page.getByRole('button', { name: 'Subscribe' });
  await opener.focus();
  await page.keyboard.press('Enter');
  const dialog = page.getByRole('dialog', { name: 'Newsletter' });
  await expect(dialog).toBeVisible();
  // Focus moved in
  await expect(dialog.locator(':focus')).toHaveCount(1);
  // and stayed in
  for (let i = 0; i < 10; i++) await page.keyboard.press('Tab');
  await expect(dialog.locator(':focus')).toHaveCount(1);
  // and came back
  await page.keyboard.press('Escape');
  await expect(opener).toBeFocused();
});

# .github/workflows/accessibility.yml
name: Accessibility
on: pull_request
jobs:
  accessibility:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v5
      - uses: actions/setup-node@v5
        with: { node-version: 22, cache: npm }
      - run: npm ci
      - run: npm run lint
      - run: npx playwright install --with-deps chromium
      - run: npx playwright test
        env:
          # playwright.config.js reads this as baseURL.
          BASE_URL: ${{ vars.PREVIEW_URL }}