Accessibility Testing

import { render } from '@testing-library/react';
import { axe, toHaveNoViolations } from 'jest-axe';

expect.extend(toHaveNoViolations);

// Wrap component in required providers (router, query client, etc.)
import { TestProviders } from '@/test-utils/providers';

describe('Hub Page Accessibility', () => {
  it('CredentialingHubPage has no a11y violations', async () => {
    const { default: CredentialingHubPage } = await import(
      '@/cores/hr/pages/CredentialingHubPage'
    );

    const { container } = render(
      <TestProviders>
        <CredentialingHubPage />
      </TestProviders>
    );

    const results = await axe(container);
    expect(results).toHaveNoViolations();
  });
});

import AxeBuilder from '@axe-core/playwright';
import { expect, test } from '@chromatic-com/playwright';

const hubRoutes = [
  { route: '/hr/ats?tab=dashboard', name: 'ATS Hub' },
  { route: '/hr/credentialing?tab=dashboard', name: 'Credentialing Hub' },
  { route: '/hr/analytics?tab=dashboard', name: 'Workforce Analytics Hub' },
  { route: '/hr/oversight?tab=relationships', name: 'Oversight Hub' },
];

for (const { route, name } of hubRoutes) {
  test(`${name} (${route}) has no a11y violations`, async ({ page }) => {
    await page.goto(route);
    await page.waitForLoadState('networkidle');

    const results = await new AxeBuilder({ page }).analyze();

    expect(results.violations).toEqual([]);
  });
}