import { Meta } from '@storybook/addon-docs/blocks'; # Testing strategy Tests follow the same grain as the architecture: **push the logic down to where it's pure, test it there directly, and keep the layers above thin.** No single tool covers everything, so each layer gets the cheapest test that catches its class of bug. This page owns _what to test, by layer_; how each test is **phrased and scoped** — one behaviour, in the domain's language — is [BDD](?path=/docs/foundations-bdd--docs). ## What gets tested where | Layer | Test kind | Tool | Rule | | -------------------------- | ------------------------ | ---------------- | ---------------------------------------------------------------------------------------------------------------------- | | `domain/` | pure-function unit spec | Vitest | **Required.** Call the function directly — **no `TestBed`**. Reducers, combinators, `visibleSteps`, parsers, policies. | | `domain/value-objects/` | parser spec | Vitest | Happy path + normalisation + **each** rejection. Assert on the `Result`, never the message. | | `infrastructure/` `parse*` | trust-boundary spec | Vitest | Accept a valid DTO; **reject `null` / `{}` / malformed**. Name it `describe('… (trust boundary)')`. | | `application/` | store / command spec | Vitest | Reducer purity, optimistic begin→confirm/rollback, command `Result`. | | `ui/` | Storybook story | Storybook + a11y | Kept thin. Axe runs on every story; add a `play` only for wiring axe can't see. | | flows | e2e smoke | Playwright | One happy path + one error state per critical journey. | | backend | rule + endpoint + golden | xUnit | Mirror of the FE domain rules, plus `WebApplicationFactory` integration. | ## Tooling Vitest runs through Angular's built-in `@angular/build:unit-test` builder — **there is no `vitest.config.ts`**; config is implicit via `tsconfig.spec.json`. ```bash npm test # ng test → Vitest, all *.spec.ts co-located next to their unit ``` Specs import `{ describe, it, expect }` from `vitest` and are co-located with the unit they cover. ## The house style Pure and direct. A value-object parser spec (`registratie/domain/value-objects/postcode.spec.ts`): ```ts import { describe, it, expect } from 'vitest'; import { parsePostcode } from './postcode'; describe('parsePostcode', () => { it('normalises to "1234 AB"', () => { const r = parsePostcode(' 1234ab '); expect(r.ok).toBe(true); if (r.ok) expect(r.value).toBe('1234 AB'); }); it('rejects malformed input', () => { expect(parsePostcode('0234AB').ok).toBe(false); // asserts the tag, not the copy }); }); ``` A trust-boundary adapter (`registratie/infrastructure/brp.adapter.spec.ts`) additionally proves the untrusted shape is rejected: ```ts expect(parseBrpAddress(null).ok).toBe(false); expect(parseBrpAddress({}).ok).toBe(false); // missing required field ``` Elm-style machines test the pure `reduce` — no Angular (`registratie/domain/registratie-wizard.machine.spec.ts`). ## Fixtures: build test data through the production door A fixture is not a shortcut around the domain — it's the domain's own construction path, run once for the test. [ADR-0006](../../../docs/reference/architecture/0006-test-data-builders.md) covers this in full (with a backend example too); the frontend idiom is one combinator, `given` (`libs/shared/src/testing/machine.ts`): ```ts export const given = (reduce: (s: S, m: M) => S, initial: S) => (...msgs: M[]): S => msgs.reduce(reduce, initial); export const givenIntake = given(reduce, initial); // per-context wrapper, pure TS ``` A machine spec replays real `Msg`s instead of hand-writing a `State` literal — so a fixture can only ever be a state the real reducer actually produces: ```ts const atStep3 = givenIntake(Start(), SetUren('1200'), Next(), SetDiplomaHerkomst('NL'), Next()); ``` The same rule extends to value objects (`unwrapOk(parseX(raw))` instead of a cast) and to `RemoteData` (`loading()` / `success(v)` / `failure(e)` in `libs/shared/src/testing/{value-object,remote-data}.ts` instead of a redefined-per-file literal). **Never** a `.withX().withY()` builder over an open constructor — that just re-opens whatever illegal state the domain closed. ## UI = Storybook, not heavy component tests `@storybook/addon-a11y` runs the `wcag2a/2aa/21a/21aa` rule sets on **every** story; `@storybook/test-runner` + `axe-playwright` turn that into a CI gate: ```bash npm run test-storybook # axe over every story against a running Storybook npm run test-storybook:ci # builds storybook-static, serves :6006, runs the gate ``` Disabling a11y on a story needs an inline justification + a WP cross-reference (see [Accessibility](?path=/docs/foundations-accessibility--docs)). ## Don't assert on copy Localized strings change per locale and per edit. Tests assert on the `Result` discriminant, the value object, or the message **id** — never the rendered Dutch/English text. Full detail in [Internationalization](?path=/docs/foundations-internationalization--docs). ## The GREEN gate ```bash npm run lint && npm run check:tokens && npm test && npm run build && npm run build-storybook cd backend && dotnet test ``` Everything above must pass before a work package is done.