testing-rules

What problem does it solve?

Testing React applications can be fragmented, with inconsistent configurations and a lack of guidance on unit, integration, and end‑to‑end testing. Developers often struggle to set up Vitest, React Testing Library, Playwright, mocking, and coverage targets efficiently.

Core Features & Use Cases

• Unified testing setup: Provides Vitest configuration with jsdom, coverage thresholds, and shared setup files for both Next.js and Vite SPA projects.
• Accessibility‑first queries: Prioritizes RTL queries such as role, label, placeholder, and text to ensure tests are aligned with WCAG standards.
• Realistic user interactions: Enforces userEvent.setup() over fireEvent for authentic event simulation.
• Hook testing support: Demonstrates renderHook usage with custom provider wrappers.
• Robust mocking: Shows vi.mock for module mocking and MSW for realistic network request handling.
• E2E automation: Supplies Playwright configuration and example tests for critical business flows.
• Consistent test patterns: Promotes the AAA structure, test data builders, and custom render utilities with providers.

Quick Start

Ask the assistant to configure Vitest, RTL, and Playwright for a new React project and generate a sample test file following the outlined patterns.