import { render, screen } from '@testing-library/react';
import { getCheckoutVariant, isKnownVariant } from '../registry';

jest.mock('../multi-step', () => ({
  __esModule: true,
  default: () => <div data-testid="variant-multi-step" />
}));

jest.mock('../one-page', () => ({
  __esModule: true,
  default: () => <div data-testid="variant-one-page" />
}));

jest.mock('../basket-and-checkout', () => ({
  __esModule: true,
  default: () => <div data-testid="variant-basket-and-checkout" />
}));

/**
 * The variant registry is the last hop before the checkout flow renders, and
 * the value it receives is untrusted: it comes from settings.js, from the
 * backend theme-settings widget, or (now) from a composition. A lookup that
 * accepts inherited Object members would answer "known" for 'constructor' and
 * then hand `dynamic()` something that is not a loader — the flow would never
 * render and ordering would be impossible (I2). Every corpus entry must still
 * end at a real variant component.
 */
const UNTRUSTED_CORPUS: unknown[] = [
  'toString',
  'constructor',
  'valueOf',
  'hasOwnProperty',
  '__proto__',
  '',
  undefined,
  42,
  'multi-step',
  'one-page'
];

describe('isKnownVariant', () => {
  it('accepts only own keys of the loader map', () => {
    expect(isKnownVariant('multi-step')).toBe(true);
    expect(isKnownVariant('one-page')).toBe(true);
    expect(isKnownVariant('accordion')).toBe(true);
    expect(isKnownVariant('basket-and-checkout')).toBe(true);
  });

  it.each(
    UNTRUSTED_CORPUS.filter(
      (value) => value !== 'multi-step' && value !== 'one-page'
    )
  )('rejects %p', (value) => {
    expect(isKnownVariant(value)).toBe(false);
  });
});

describe('getCheckoutVariant', () => {
  it.each(UNTRUSTED_CORPUS)('renders a real variant for %p', async (value) => {
    const Variant = getCheckoutVariant(value as never);

    render(<Variant />);

    const expected =
      value === 'one-page' ? 'variant-one-page' : 'variant-multi-step';

    expect(await screen.findByTestId(expected)).toBeInTheDocument();
  });

  it('maps every known variant id to its component', async () => {
    const Accordion = getCheckoutVariant('accordion');
    render(<Accordion />);
    // 'accordion' is an alias of the one-page layout.
    expect(await screen.findByTestId('variant-one-page')).toBeInTheDocument();

    const Unified = getCheckoutVariant('basket-and-checkout');
    render(<Unified />);
    expect(
      await screen.findByTestId('variant-basket-and-checkout')
    ).toBeInTheDocument();
  });
});