Recipes
End-to-end flawless-react workflows you can lift directly — first suite, Next.js adoption, colocated specs, mocks with real shapes, compound parts, route e2e, crust load pipes, CI wiring, findings triage and safe regeneration.
Task-shaped walkthroughs. Each one takes a single job — get a first suite running, stop
mocks returning {}, make a load run mean something — and follows it from the
smallest working command to the version you would put in CI, with the failure modes named
along the way.
The reference pages describe what the tool does. These describe what you do.
Your first suite
Point it at one .tsx file and get a runnable Playwright + Vitest project — picking tasks, reading the first findings, and the three flags worth knowing before any others.
Adopt it in a Next.js app
—nextjs end to end: router detection, the auto-detected app resolver, API routes becoming swagger plus MSW handlers, and the flawless:* scripts that survive your edits.
Colocated specs you can hand-harden
Specs beside your sources, each stamped with a content hash — so —force can tell “still exactly what we generated” from “someone worked on this”, and only rewrites the first.
Mocks with real shapes
Where the realistic fixture comes from: a server action’s own literal return, a declared Promise<T>, or an OpenAPI example — each emitted with a provenance comment, and an honest TODO where inference refused to guess.
Compound parts that need a Root
Why <Dialog.Content> throws on its own, and how a part whose file exports its family gets mounted the way call sites do — with portal-aware assertions.
Route e2e against a seeded database
Real ids instead of guessed ones, a global-setup login, and the trap that makes a whole suite green against a login page it never meant to measure.
Load pipes with crust
The load task emits crust pipelines for your routes and the GET APIs your components fetch — with a setup module that fails loudly rather than measuring the 404 handler.
Wire it into CI
The —ci JSON contract, the stdout/stderr split an unattended caller depends on, —changed narrowing, and why exit 0 does not by itself mean the suites passed.
Triage the findings
perf-static, a11y and react-rules: what each looks for, where the findings land, and how to decide between fixing one and suppressing it without the two linters disagreeing.
Regenerate without losing work
generated, refreshed, kept — what a plain re-run rewrites, what —force adds, the three tiers of file ownership, and the one migration no flag will do for you.
If you are driving this with an agent
Every recipe here is also encoded as a Claude Code skill that ships with the tool, so an agent working in your repo loads the same rules on demand instead of rediscovering them. See Agent skills.