mimic/frontend/tests/SimulationList.test.tsx

import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { screen, waitFor, fireEvent } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import MockAdapter from 'axios-mock-adapter';
import { apiClient } from '@/api/client';
import { SimulationList } from '@/components/SimulationList';
import { renderWithProviders } from './utils';
import type { Simulation } from '@/api/types';

const SIMULATIONS: Simulation[] = [
  {
    id: 1,
    engagement_id: 42,
    name: 'Lateral movement test',
    techniques: [{ id: 'T1021', name: 'Remote Services', tactics: ['lateral-movement'] }],
    tactics: [],
    description: null,
    commands: null,
    prerequisites: null,
    executed_at: '2026-06-01T10:00:00',
    execution_result: null,
    log_source: null,
    logs: null,
    soc_comment: null,
    incident_number: null,
    status: 'in_progress',
    created_at: '2026-05-26T08:00:00',
    updated_at: null,
    created_by: { id: 1, username: 'alice' },
  },
];

let mockCanEdit = true;

vi.mock('@/hooks/useAuth', () => ({
  useAuth: () => ({
    user: { id: 1, username: 'alice', role: mockCanEdit ? 'admin' : 'soc', created_at: '2026-01-01' },
    status: 'authenticated',
    login: vi.fn(),
    logout: vi.fn(),
    isAdmin: mockCanEdit,
    isRedteam: false,
    isSoc: !mockCanEdit,
    canEditEngagements: mockCanEdit,
  }),
}));

describe('SimulationList — admin/redteam', () => {
  let mock: MockAdapter;

  beforeEach(() => {
    mockCanEdit = true;
    mock = new MockAdapter(apiClient);
  });

  afterEach(() => {
    mock.restore();
  });

  it('shows loading state initially', () => {
    mock.onGet('/engagements/42/simulations').reply(() => new Promise(() => {}));
    renderWithProviders(<SimulationList engagementId={42} />);
    expect(screen.getByTestId('loading-state')).toBeInTheDocument();
  });

  it('shows error state when request fails', async () => {
    mock.onGet('/engagements/42/simulations').reply(500, { error: 'Server error' });
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByTestId('error-state')).toBeInTheDocument();
    });
  });

  it('shows empty state when no simulations', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, []);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByTestId('empty-state')).toBeInTheDocument();
    });
  });

  it('shows "Nouvelle simulation" button for admin/redteam in empty state', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, []);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByTestId('new-simulation-btn')).toBeInTheDocument();
    });
  });

  it('renders the simulation list with correct data', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    expect(screen.getByText('T1021')).toBeInTheDocument();
    expect(screen.getByTestId('simulation-status-badge')).toHaveAttribute('data-status', 'in_progress');
  });

  it('shows "Nouvelle simulation" button in header when simulations exist', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    expect(screen.getByTestId('new-simulation-btn')).toBeInTheDocument();
  });

  it('shows dropdown toggle button when simulations exist', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    expect(screen.getByTestId('new-simulation-dropdown-toggle')).toBeInTheDocument();
  });

  it('opens dropdown and shows "From template…" option', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    const user = userEvent.setup();
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    await user.click(screen.getByTestId('new-simulation-dropdown-toggle'));
    expect(screen.getByTestId('from-template-btn')).toBeInTheDocument();
    expect(screen.getByText('Blank')).toBeInTheDocument();
  });

  it('opens TemplatePickerModal when "From template…" is clicked', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    mock.onGet('/templates').reply(200, []);
    const user = userEvent.setup();
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    await user.click(screen.getByTestId('new-simulation-dropdown-toggle'));
    await user.click(screen.getByTestId('from-template-btn'));
    await waitFor(() => {
      expect(screen.getByRole('dialog')).toBeInTheDocument();
    });
  });

  it('closes dropdown on click outside', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    const user = userEvent.setup();
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    await user.click(screen.getByTestId('new-simulation-dropdown-toggle'));
    expect(screen.getByTestId('from-template-btn')).toBeInTheDocument();
    // Click outside the dropdown
    await user.click(document.body);
    expect(screen.queryByTestId('from-template-btn')).toBeNull();
  });

  it('closes dropdown on Escape key', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    const user = userEvent.setup();
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    await user.click(screen.getByTestId('new-simulation-dropdown-toggle'));
    expect(screen.getByTestId('from-template-btn')).toBeInTheDocument();
    await user.keyboard('{Escape}');
    expect(screen.queryByTestId('from-template-btn')).toBeNull();
  });

  it('shows dropdown in empty state (not a plain link)', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, []);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByTestId('empty-state')).toBeInTheDocument();
    });
    // Must have the split-button dropdown, not a plain link
    expect(screen.getByTestId('new-simulation-btn')).toBeInTheDocument();
    expect(screen.getByTestId('new-simulation-dropdown-toggle')).toBeInTheDocument();
  });

  it('clicking a row uses SPA navigation and does not trigger window.location change', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    const originalHref = window.location.href;

    renderWithProviders(<SimulationList engagementId={42} />, {
      routerProps: { initialEntries: ['/engagements/42'] },
    });

    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });

    const row = screen.getByText('Lateral movement test').closest('tr') as HTMLElement;
    fireEvent.click(row);

    // window.location.href must be unchanged (no full-page reload)
    expect(window.location.href).toBe(originalHref);
  });
});

describe('SimulationList — SOC role (no edit button)', () => {
  let mock: MockAdapter;

  beforeEach(() => {
    mockCanEdit = false;
    mock = new MockAdapter(apiClient);
  });

  afterEach(() => {
    mock.restore();
  });

  it('does not show "Nouvelle simulation" button for SOC in empty state', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, []);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByTestId('empty-state')).toBeInTheDocument();
    });
    expect(screen.queryByTestId('new-simulation-btn')).toBeNull();
  });

  it('does not show "Nouvelle simulation" button for SOC when simulations exist', async () => {
    mock.onGet('/engagements/42/simulations').reply(200, SIMULATIONS);
    renderWithProviders(<SimulationList engagementId={42} />);
    await waitFor(() => {
      expect(screen.getByText('Lateral movement test')).toBeInTheDocument();
    });
    expect(screen.queryByTestId('new-simulation-btn')).toBeNull();
  });
});