import { describe, expect, it, vi } from 'vitest';

import {
  ErrorBoundary,
  type ErrorBoundaryFallbackProps,
} from './ErrorBoundary';
import { render } from '../../test/render';

function Bomb(): JSX.Element {
  throw new Error('Crankshaft jam');
}

function TestFallback({ error }: ErrorBoundaryFallbackProps): JSX.Element {
  return <div role="alert">{error.message}</div>;
}

describe('ErrorBoundary', () => {
  it('catches render failures and exposes them to fallback UI and telemetry', async () => {
    const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => undefined);
    const onError = vi.fn();

    const result = await render(
      <ErrorBoundary fallback={TestFallback} onError={onError} layer="viewer">
        <Bomb />
      </ErrorBoundary>,
    );

    expect(result.container.querySelector('[role="alert"]')?.textContent).toBe('Crankshaft jam');
    expect(onError).toHaveBeenCalledTimes(1);
    expect(onError.mock.calls[0]?.[0]).toBeInstanceOf(Error);
    expect(onError.mock.calls[0]?.[2]).toMatch(/^viewer-/);

    await result.unmount();
    consoleSpy.mockRestore();
  });
});