tdd-workflowlisted

# TDD Workflow — Testing Strategy ## Overview Enforces red-green-refactor TDD cycle with comprehensive testing strategy: - Vitest + jsdom for component/unit tests - React Testing Library for user-centric testing - MSW v2 for API mocking - Playwright for E2E critical paths - Testing Trophy approach (pyramid inverted) - 80%+ coverage requirement --- ## Testing Trophy ``` /\ /E2E\ 5-10% — Playwright critical paths /------\ / Integr. \ Largest layer — RTL + MSW / ation \ "Write tests. Not too many. Mostly integration." /--------------\ / Unit tests \ Hooks, utils, store logic, pure functions /------------------\ / Static (TypeScript) \ Foundation — errors caught at compile time /________________________\ ``` ### Layer Breakdown **Static Analysis (Foundation)** - TypeScript strict mode catches type errors at compile time - ESLint/Biome catch code smells and incorrect patterns - No runtime cost **Unit Tests (10-15%)** - Test pure functions: `formatDate()`, `calculateTotal()`, `parseQueryString()` - Test hook logic: `useAuth()`, `useFormData()` without rendering - Test store logic: Zustand selectors, state updates - Run fast, isolated, deterministic **Integration Tests (Largest Layer — 60-75%)** - Test features end-to-end with user interactions - Use React Testing Library to test behavior, not implementation - Mock external APIs with MSW - Test user workflows: login, create item, update, delete **E