7dbe2dbc28
The hierarchical 3-column drill-down was hard to scan and forced a stateful walk per tag. Replaced with a flat, columns-as-tactics matrix that mirrors attack.mitre.org/# — every cell is a one-click select target, with inline sub-technique expand via a `+N` chevron. - New endpoint GET /api/v1/mitre/matrix returns the full grid (tactics → techniques → sub-techniques nested) in a single ~55 KB response, so the SPA renders the whole matrix without firing 15 parallel queries. Two pytest tests added (nested structure + auth required). - MitreTagPicker.tsx rewritten as a horizontal-scrolling matrix: - Click a tactic header → select the tactic (cyan filled). - Click a technique cell → select the technique (orange filled). - Click the `+N` chevron → expand sub-techniques inline within the column. - Click a sub-technique → select (purple filled). - Single Filter field matches on external_id or name across all kinds. - Selection chips at the top, clickable to remove. - `aria-pressed` on every clickable cell for screen readers and Playwright. - e2e test updated to walk the new flow (click cell → assert aria-pressed, expand chevron, click sub, verify chip + JSON preview, filter to T1078). - Spec §F2 + §F12 + todo.md M4 entry updated to make the matrix layout the canonical UI for MITRE tagging (so future spec-reviewer passes accept it). - testing-m4.md walkthrough rewritten for the flat picker. DoD post-refactor: make test-api → 53 passed (was 51), make e2e → 34 passed. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Metamorph e2e
End-to-end tests powered by Playwright. Each milestone in tasks/todo.md should add at least one spec file (tests/m<N>-*.spec.ts).
One-time setup
cd e2e
npm install
npm run install-browsers # downloads chromium (uses sudo for system deps)
Running against a live stack
# 1. Bring the stack up from the repo root:
cd .. && make up
# 2. Run the tests:
cd e2e && npm test
# 3. Open the HTML report:
npm run report # opens playwright-report/index.html in your browser
Or from the repo root:
make e2e # runs against the already-up stack
make e2e-report # opens the HTML report
make e2e-up # one-shot: make up + wait healthy + run tests
Auto-spawn mode
Set PW_AUTOSTART=1 to let Playwright spawn make up itself before the run:
PW_AUTOSTART=1 npm test
Configuration
| Env var | Default | Purpose |
|---|---|---|
BASE_URL |
http://localhost:8080 |
The front nginx URL (which proxies /api/*) |
PW_AUTOSTART |
0 |
If 1, spawn make up before the tests |
CI |
unset | When set, retries=2 and parallel workers=2 |
Reports
- HTML :
e2e/playwright-report/index.html - JUnit :
e2e/playwright-report/junit.xml(CI ingestion) - Trace : kept on first retry, opened with
npx playwright show-trace …
Layout
e2e/
├── tests/
│ └── m0-smoke.spec.ts # bootstrap milestone (current)
│ └── m<N>-*.spec.ts # one spec per milestone, added as features land
├── playwright.config.ts
├── tsconfig.json
└── package.json