2026-05-26 11:13:14 +02:00
|
|
|
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
2026-05-26 11:22:48 +02:00
|
|
|
import { screen, waitFor, fireEvent } from '@testing-library/react';
|
2026-05-26 11:13:14 +02:00
|
|
|
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',
|
feat(frontend): sprint 3 — multi-technique MITRE selection + matrix modal
- types: replace mitre_technique_id/name scalars with techniques:MitreTechnique[]
on Simulation; add MitreTactic/MitreMatrixTechnique/MitreMatrixSubtechnique;
SimulationPatchInput now uses technique_ids:string[]
- api/mitre.ts: add getMitreMatrix() → GET /api/mitre/matrix
- hooks/useMitre: add useMitreMatrix(enabled) with staleTime:Infinity
- MitreTechniquePicker: clean rewrite — onSelect(technique) one-shot, resets
input after selection, no incoming value props
- MitreTechniqueTag: chip component with id+name and × remove button
- MitreMatrixModal: tactic columns (220px fixed), expand/collapse subtechniques,
search filter (auto-expands parent on sub match), selection state, focus trap
(Tab wrap, Escape, search autofocus), backdrop click cancel, Apply N techniques
- MitreTechniquesField: orchestrates tags+picker+matrix with auto-save PATCH on
every add/remove/Apply, dedup guard, disabled read-only mode for SOC
- SimulationFormPage: swap MitreTechniquePicker for MitreTechniquesField; remove
technique state from RT form (techniques have independent auto-save cycle)
- SimulationList: MITRE column → T1059 +2 counter format, — when empty
- Tests: 84 passing (13 test files); new suites for Tag, Field, Modal;
MitreTechniquePicker + SimulationFormPage + SimulationList adapted to new API
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-27 04:04:23 +02:00
|
|
|
techniques: [{ id: 'T1021', name: 'Remote Services', tactics: ['lateral-movement'] }],
|
feat(frontend): sprint 4 — dark mode + matrix overhaul + tactic selection + done read-only + UI polish
US-17: fix duplicate "Create engagement" button, icon conventions (Save/RotateCcw/Grid2x2), UsersAdminPage form baseline alignment
US-18: done status fully read-only + Reopen button (done → review_required) for all roles
US-19: invalidate engagement queries on simulation PATCH/transition for auto-status propagation
US-20: MitreMatrixModal rewritten — CSS grid 12-column layout, no horizontal scroll, attack.mitre.org compact look
US-21: tactic header clickable in matrix, tactic chips (MitreTacticTag) in field, single atomic PATCH with technique_ids + tactic_ids
US-22: MitreTechniquesField chips-only area + inline search input + matrix icon button; chips show ID-only (name in title=)
US-23: useTheme hook — 3-state light/dark/system, CSS variables, Tailwind darkMode class, localStorage persistence
92/92 tests passing, typecheck and lint clean.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-27 20:06:01 +02:00
|
|
|
tactics: [],
|
2026-05-26 11:13:14 +02:00
|
|
|
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();
|
|
|
|
|
});
|
2026-05-26 11:22:48 +02:00
|
|
|
|
|
|
|
|
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);
|
|
|
|
|
});
|
2026-05-26 11:13:14 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
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();
|
|
|
|
|
});
|
|
|
|
|
});
|