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

vi.mock('../../../../shared/state', () => ({
  sendMessage: vi.fn(),
  getState: () => ({ newType: 'login', generatorDefaults: null, error: null, loading: false, vaultSettings: null, entries: [] }),
  setState: vi.fn(),
  navigate: vi.fn(),
  escapeHtml: (s: string) => s,
  popOutToTab: vi.fn(),
  isInTab: () => false,
  openVaultTab: vi.fn(),
  registerHost: vi.fn(),
}));

vi.mock('../../generator-panel', () => ({
  openGeneratorPanel: vi.fn(),
  closeGeneratorPanel: vi.fn(),
  isGeneratorPanelOpen: () => false,
}));

import { TYPED_FORMS } from './_typed-forms';

describe('required-pill migration', () => {
  beforeEach(() => { document.body.innerHTML = '<div id="app"></div>'; });

  it.each(TYPED_FORMS)('%s form has no legacy <span class="req"> markup', (_name, render) => {
    render(document.getElementById('app')!, 'add', null);
    expect(document.body.innerHTML).not.toContain('class="req"');
  });

  it.each(TYPED_FORMS)('%s form contains the .req-pill markup on at least one label', (_name, render) => {
    render(document.getElementById('app')!, 'add', null);
    expect(document.body.innerHTML).toContain('class="req-pill">required</span>');
  });
});
