playwright
Playwright CT with MSW for API Isolation in Component Tests
Component tests that hit real APIs are integration tests wearing a costume.
Component Testing
Latest
playwright
Playwright Visual Regression Testing with Custom Diff Reporters
Playwright's built-in screenshot comparison is a pixel differ with a configurable threshold. It works well out of the box, but the default failure output — a saved PNG diff in your test results directory — is awkward to review. Developers end up running tests locally, opening three images side
playwright
Testing Svelte Components with Playwright CT
@playwright/experimental-ct-svelte brings the same mount-in-browser approach to Svelte that the React and Vue adapters provide. The component runs in a real browser, in a real DOM, with real Svelte reactivity — not a jsdom approximation. For Svelte specifically, this matters because Svelte's compiled output
playwright
Playwright Component Testing with Next.js and Server Components
Playwright Component Testing (CT) runs your components inside a real browser, mounted in an iframe served by a Vite dev server. That's the key detail that explains why React Server Components cause problems: RSC requires a Node.js runtime to execute, and there is no Node.js inside
playwright
Playwright Component Testing at Scale: Parallelization and Sharding
Playwright Component Testing has a startup cost that unit test frameworks don't: each worker spins up its own Vite dev server. With 2 workers, you have 2 Vite instances. With 8, you have 8. At small scale this is invisible. At 500+ component tests across a large design
Testing
Testing Design Systems with Storybook: Component Libraries at Scale
Design systems are the foundation of consistent UI. A broken button component or incorrect token in your design system affects every product that consumes it.
Testing
Storybook Interaction Testing with @storybook/test
Storybook interaction testing lets you simulate user behavior directly inside your stories — clicks, typing, keyboard navigation — and assert the results.
Testing
Storybook vs Playwright Component Testing: When to Use Each
Both Storybook and Playwright can test UI components in a real browser. Both give you real DOM interaction, real CSS, and real browser behavior.
Testing
Storybook 8 Component Testing: The Complete Guide
Storybook 8 made component testing a first-class citizen. What was previously a documentation tool is now a full component testing platform — complete with built-in test runner, Vitest integration, and portable stories that run outside Storybook itself. This guide covers everything: setting up Storybook 8 for testing, writing stories
react
React Cosmos: Sandbox for Developing and Testing React Components in Isolation
React Cosmos is a sandbox for developing React components in isolation.
Vue
Histoire: Vue-First Component Story Tool Built on Vite
Histoire is a component story tool for Vue 3 (and experimentally Svelte).
react
Ladle: Ultra-Fast Storybook Alternative for React Component Development
Ladle is a fast, lightweight alternative to Storybook for developing and documenting React components.