The Cockatrice web client — a React/TypeScript SPA that connects to a Servatrice server over a WebSocket.
For the full set of diagrams (detailed layer map + command/response/event sequence) and the npm run diagram scripts that regenerate them, see architecture/. For prose — WebSocket layering, Redux store shape, test conventions — see .github/instructions/root.instructions.md.
React 19 + TypeScript, built with Vite 8. State via Redux Toolkit + RxJS, UI via MUI v9, tests via Vitest. Protobuf bindings come pre-built from the sockatrice npm package as sockatrice/generated.
- Node.js and npm
npm install
npm startnpm install initializes the vendor/cockatrice git submodule (sparse-checked-out to libcockatrice_protocol/ for Sockatrice's proto generation) via the prepare hook. servatrice.sql no longer lives in the submodule — the e2e stack extracts it from the pinned ghcr.io/cockatrice/servatrice image at compose time. npm start runs Turborepo (turbo run dev), which builds the @cockatrice/* packages in dependency order, then boots the Vite dev server and opens a browser tab at http://localhost:5173 automatically (configured via server.open in vite.config.ts). The first start runs prebuild.js via webatrice's predev hook to merge i18n catalogs, so give it a moment.
npm start— build packages in dependency order + start the Vite dev server via Turborepo (turbo run dev; runsprebuild.jsfirst viapredev)npm run build— production build intobuild/(also runs the prebuild hooks)npm run preview— serve the builtbuild/output locally to smoke-test a production build
npm test— one-shot Vitest run (unit specs)npm run test:watch— Vitest in watch modenpm run test:integration— integration specs viavitest.integration.config.tsnpm run test:coverage/npm run test:integration:coverage— the above with v8 coverage
End-to-end tests live in the Sockatrice repo, which vendors servatrice and runs the Playwright suite against a Webatrice dev server on :5173.
npm run lint/npm run lint:fix— ESLint oversrc/npm run golden—lint+test+test:integration; the fast CI-equivalent gate to run before declaring work done
npm run translate— re-run the i18n merge only (prebuild.js -i18nOnly)
Produced by prebuild.js on every npm start / npm run build. Don't edit them by hand:
| File | Tracked? | Notes |
|---|---|---|
src/server-props.json |
Gitignored | Build metadata including the current git SHA. Written by prebuild.js; only appears after a first local run. |
src/images/countries/*.svg |
Gitignored | Country flag SVGs copied from vendor/cockatrice/cockatrice/resources/countries/ (sparse-checkout from the Cockatrice submodule). Materialized by prebuild.js. |
src/i18n-default.json |
Committed | Merged i18n catalog. Regenerate with npm run translate and commit whenever it changes. |
- .github/instructions/root.instructions.md — architecture deep dive, conventions, and domain-knowledge invariants for working in this directory (the canonical AI-tool instruction surface for this package)
- Vite docs · React docs · Vitest docs