frontend-testing

# frontend-testing Define and scaffold frontend testing for production readiness. Our other frontend skills (`frontend-perfection`, `frontend-a11y`, `frontend-performance`) audit a *built* site; they run ZERO tests. This skill closes that gap: it tells you *what* to test, *which* layer owns each concern, and *hands you the config* to wire into CI. It is a process/knowledge + scaffolding skill, not a runtime audit. ## The 13 Testing rules → pyramid layer Mapped 1:1 from the Front-End-Checklist "Testing" category. Each rule names the layer it belongs to and the reference file that scaffolds it. | # | Rule (verbatim priority) | Layer | Scaffold | |---|---|---|---| | 1 | Write unit tests [High] | Unit | your unit runner (Vitest/Jest) | | 2 | Write integration tests for key workflows [High] | Integration | your runner + MSW | | 3 | Implement end-to-end testing [High] | E2E | `references/playwright.config.ts`, `references/e2e-smoke.spec.ts` | | 4 | Use visual regression testing [Medium] | Visual | `references/visual-regression.md` | | 5 | Include accessibility testing [High] | A11y | `references/a11y-test.md` | | 6 | Test across all major browsers [High] | Cross-browser | `references/playwright.config.ts` (projects) | | 7 | Test on real mobile devices and viewports [High] | Real-device | `references/playwright.config.ts` (Mobile projects) | | 8 | Enforce performance budgets in CI [Medium] | Perf-budget | `references/ci-perf-budget.yml` | | 9 | Use mutation testing to measure ho...