FakeSummoner test harness for client-side tests — React component/context/hook tests that need socket + pipeline. Covers renderWithWorkspace, renderWithChannel, multi-tab scenarios, state injection vs full pipeline. For server tests see fake-summoner-server skill.
FakeSummoner test harness for server-side tests — socket handlers, channel integration, pipeline, DB, CLI process. Use when writing or debugging server tests that need real socket.io + in-memory DB + fake CLI process. For client tests see fake-summoner-client skill.
Fixture-driven TDD workflow for CLI parsers and session tests. Uses real CLI JSON from DB/capture, FakeClaude segments, and .jsonl fixtures. Use when developing parsers, adding event types, or writing server pipeline tests.
Frontend testing guide for React components, hooks, and stores using testing-library, vitest, and Storybook. Use when writing or refactoring component tests, hook tests, or choosing between test doubles. Covers six core principles (Testing Library first, Fake for external deps, Fake Component for isolation, test…
MSW v2 patterns for API mocking in Vitest tests. Use when setting up API mocks, writing HTTP handlers, simulating network errors, or configuring msw/node for component and integration tests.
CLI stream parser development workflow. Covers the ProtocolEvent → SocketEvent pipeline, Zod schema validation, and adapter pattern. Use when creating or modifying protocol parsers, adding new event types, or debugging parse failures.
Compare cc-office protocol implementation against the real Claude Code VS Code Extension. Use when checking protocol coverage, analyzing alignment gaps, re-comparing after extension updates, or building a coverage matrix.
A reference for understanding what React Compiler 1.0 automatically optimizes and what still needs manual handling. React Compiler is a build tool that can add memoization to reduce repeated work in React applications.
React hooks and Context conventions for this project. Covers custom hook extraction rules, Context splitting (state vs actions), dependency management with biome useExhaustiveDependencies, and ref/callback patterns. Use when writing or reviewing custom hooks, Context providers, or component re-render optimization.
Socket.IO event handling patterns for server and client. Use when implementing socket handlers, adding real-time events, creating client socket hooks, or modifying handler registration.
Component-driven development with Storybook 10. Use when creating or documenting React components, writing stories or interaction tests, designing UI variations, or syncing stories after component changes.
Tailwind CSS v4 styling with @theme, @utility, and @custom-variant directives. Use when styling components, configuring design tokens, adding custom utilities, migrating from v3, or converting hardcoded colors to theme tokens. Enforces token-first design flow: look up existing @theme tokens before reaching for…
Cross-cutting testing conventions (async patterns, vitest API cheatsheet, className assertion) shared across client and server tests. Frontend-specific rules (6 core principles, test double decision flow, Fake Component, test placement) live in frontend-testing; server-specific patterns (DB / socket.io server) live in…
Project-specific Vitest testing reference for the server package (apps/server). Use when writing or modifying server-side vitest tests, fixing failing tests, testing DB / socket.io server-side, choosing mocking strategies, or working with async patterns and fake timers. For frontend tests (apps/web) see…
Zod v4 schema validation patterns and integration with Drizzle ORM and React Hook Form. Use when creating or modifying Zod schemas, adding validation logic, using zodResolver, or migrating from Zod v3 to v4.
Zustand state management patterns including stores, slices, selectors, and middleware. Use when creating or modifying zustand stores, optimizing re-renders, integrating socket events with state, or testing stores.