import { cleanup, fireEvent, render, screen } from '@testing-library/react';
import { afterEach, describe, expect, it, vi } from 'vitest';
import Toolbar from '../src/components/Toolbar';

afterEach(cleanup);

describe('stylesheet trust UI gate', () => {
  it.each(['saxon-js-dynamic', 'native-xsltprocessor'] as const)(
    'keeps the %s engine disabled until the exact stylesheet is trusted',
    (selectedEngine) => {
      const applyTransformation = vi.fn();
      const trustStylesheet = vi.fn();
      const props = {
        selectedEngine,
        onEngineChange: vi.fn(),
        onApplyTransformation: applyTransformation,
        onTrustStylesheet: trustStylesheet,
        onMoveOutputToInput: vi.fn(),
        onValidate: vi.fn(),
        onReset: vi.fn(),
        prettifyOutputAfterTransform: true,
        onPrettifyOutputAfterTransformChange: vi.fn(),
        askBeforeOverwritingOutput: true,
        onAskBeforeOverwritingOutputChange: vi.fn(),
        stylesheetTrusted: false,
      };
      const { rerender } = render(<Toolbar {...props} />);

      const applyButton = screen.getByRole('button', {
        name: 'Apply transformation',
      }) as HTMLButtonElement;
      expect(applyButton.disabled).toBe(true);
      fireEvent.click(applyButton);
      expect(applyTransformation).not.toHaveBeenCalled();

      fireEvent.click(
        screen.getByRole('button', { name: 'Review & trust stylesheet' })
      );
      expect(trustStylesheet).toHaveBeenCalledOnce();

      rerender(<Toolbar {...props} stylesheetTrusted />);
      expect(
        (
          screen.getByRole('button', {
            name: 'Apply transformation',
          }) as HTMLButtonElement
        ).disabled
      ).toBe(false);
    }
  );
});