test-setup.ts

/**
 * Vitest global setup.
 *
 * - Registers @testing-library/jest-dom matchers (toBeInTheDocument, etc.)
 * - Provides a thin axe-core wrapper via `expect(container).toBeAccessible()`
 *   (axe runs synchronously in Node; we expose a vitest-friendly matcher)
 * - Polyfills matchMedia / ResizeObserver which jsdom does not implement
 *   but several Mitosis components touch (BcSplitter, BcAffix, BcBackTop).
 */
import '@testing-library/jest-dom/vitest';
import { afterEach, expect, vi } from 'vitest';
import { cleanup } from '@testing-library/react';
import axeCore from 'axe-core';

afterEach(() => {
  cleanup();
});

// matchMedia polyfill (jsdom omits it). Components check
// `window.matchMedia('(prefers-reduced-motion: reduce)')`.
if (typeof window !== 'undefined' && !window.matchMedia) {
  Object.defineProperty(window, 'matchMedia', {
    writable: true,
    value: (query: string) => ({
      matches: false,
      media: query,
      onchange: null,
      addListener: vi.fn(),
      removeListener: vi.fn(),
      addEventListener: vi.fn(),
      removeEventListener: vi.fn(),
      dispatchEvent: vi.fn(),
    }),
  });
}

// ResizeObserver polyfill — BcSplitter, BcAffix, BcBackTop use it.
if (typeof globalThis.ResizeObserver === 'undefined') {
  class ResizeObserverStub {
    observe() {}
    unobserve() {}
    disconnect() {}
  }
  (globalThis as unknown as { ResizeObserver: typeof ResizeObserverStub }).ResizeObserver =
    ResizeObserverStub;
}

if (typeof HTMLCanvasElement !== 'undefined') {
  Object.defineProperty(HTMLCanvasElement.prototype, 'getContext', {
    writable: true,
    value: vi.fn(() => null),
  });
}

// IntersectionObserver polyfill — BcBackTop, BcAffix lazy-mount paths.
if (typeof globalThis.IntersectionObserver === 'undefined') {
  class IntersectionObserverStub {
    observe() {}
    unobserve() {}
    disconnect() {}
    takeRecords() {
      return [];
    }
  }
  (globalThis as unknown as { IntersectionObserver: typeof IntersectionObserverStub }).IntersectionObserver =
    IntersectionObserverStub;
}

// Custom vitest matcher: `expect(container).toBeAccessible()`
// Runs axe-core against the given container and fails on any violations.
expect.extend({
  async toBeAccessible(received: HTMLElement) {
    const results = await axeCore.run(received);
    if (results.violations.length === 0) {
      return {
        pass: true,
        message: () => 'expected element to have axe violations, but none were found',
      };
    }
    const summary = results.violations
      .map(
        (v) =>
          `  [${v.id}] ${v.help}: ${v.nodes
            .map((n) => n.html)
            .slice(0, 3)
            .join(', ')}`,
      )
      .join('\n');
    return {
      pass: false,
      message: () =>
        `expected element to be accessible, but axe found ${results.violations.length} violation(s):\n${summary}`,
    };
  },
});

interface CustomMatchers {
  toBeAccessible(): Promise<void>;
}

declare module 'vitest' {
  interface Assertion extends CustomMatchers {}
  interface AsymmetricMatchersContaining extends CustomMatchers {}
}