fkwpandClaude Opus 5
a58a5f615f
* Add AGENTS.md documenting the repo's conventions Codifies what is currently tribal knowledge or only discoverable by reading CI config: the view model / view contract, the rule that nothing reads the page, Clean Code ordering, the three test layers, and reuse-before-you-build. The root AGENTS.md is the always-loaded minimum and routes to docs/agents/, so an agent loads only the detail its task needs. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> * Allow either hand at the commit, and measure continuous redraws Committing from the agent rules out running it where there is no git identity, a sandbox included. Either is now fine: commit on the user's word where the setup allows it, or write the message and hand it over. Redrawing continuously is the other addition. A level meter reported a fresh value every animation frame, so its whole menu reconciled sixty times a second, silence included, and nobody noticed until review. A PR that adds anything of the kind now says what it costs, or better, counts the redraws — commits rather than render calls, since React runs a component it then discards. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
2.5 KiB
Testing
Three layers; a user-facing feature needs all three. Unit proves the logic, Storybook proves the rendering, e2e proves the feature. Codecov gates 80% on the lines a PR touches.
Unit
- View model tests use
withTestScheduler+testScope()fromsrc/utils/test.tsand read as ASCII timelines. CopyLayoutSwitchViewModel.test.ts. - Component tests use Testing Library, queried by role and accessible name.
- Reuse the factories in
src/utils/test.ts—mockRemoteParticipant,mockMatrixRoom,mockLivekitRoom,MockRTCSession. Hand-rolled mocks drift. - Snapshots live in
__snapshots__/; update withpnpm test <Name> -u. - How often something redraws is testable: drive the frames and count commits, not render calls. An effect with no dependency array runs once per commit.
component/**/*.test.tsruns in the same jsdom project assrc.
Storybook
A deliverable, not documentation: pnpm test:storybook runs every story as a real
browser test in the same CI job as the unit suite. A UI change without a story is
incomplete. Only three stories exist so far, so copy CallFooter.stories.tsx.
- Drive the component from a snapshot via
useStaticViewModel, never internals. - One named story per state that matters — loading, error, empty, denied, mobile.
- Assert in a
playfunction withuserEvent/expectfromstorybook/test. - Mobile is
globals: { viewport: { value: "mobile2" } }, not a second component. - Expose interesting props through
argTypes.
.storybook/preview.tsx supplies TooltipProvider, src/index.css and English
translations. The browser is Playwright's, so a fresh clone needs
pnpm playwright install once.
End-to-end
playwright/*.spec.ts— standalone, on Chromium and Firefox.playwright/widget/— widget mode, where cross-context bugs surface.playwright/component/— the component in a host page, via the harness on port 3001 that Playwright starts as a second web server. Catches container-relative layout, styles escaping the root, two instances on a page, host-bridge reports.playwright/mobile/— Pixel 7,mobileproject only.
Test what a user observes: the peer sees the change, it survives a reconnect, it is
right after a reload. Reuse playwright/spa-helpers.ts,
playwright/widget/test-helpers.ts, playwright/fixtures/.
pnpm test # unit + storybook
pnpm backend # Synapse + LiveKit, required for e2e
pnpm test:playwright # or :open
pnpm dev:component # component harness, port 3001