Storybook Testing — Storybook 10

Overview

Storybook 10 unifies component testing into a single workflow: interaction tests via play() functions, visual regression via Chromatic TurboSnap, and accessibility audits via the a11y addon — all running through Vitest. Stories are executable test specifications, not just documentation.

What's new in Storybook 10 (vs 9):

• ESM-only enforced — the single breaking change; Node 20.16+ / 22.19+ / 24+ required; 29% smaller install
• Module automocking (sb.mock) — build-time module mocking, scoped per-project in preview.ts
• CSF factories (React, preview) — defineMain → definePreview → preview.meta() → meta.story() chain
• Essential addons in core — viewport, controls, interactions, actions no longer separate deps
• Import path changes — @storybook/test → storybook/test (old paths still work as aliases)
• React Server Component story support — test RSC in isolation
• Vitest 4 support — experimental-addon-test renamed to addon-vitest