Storybook 9 is here! ▶️ Interaction tests ♿ Accessibility tests 👁️ Visual tests 🛡️ Coverage reports 🚥 Test widget 🪶 48% Leaner ✍️ Story generation 🏷️ Tag-based organization 🌐 Story globals 🏗️ Major updates for Svelte, Next.js, React Native, and more! Let’s dive in!

▶️ Interaction tests We’ve partnered with @vitest_dev to test your components with simulated behavior in a real browser (shoutout to @playwrightweb), during local development and in CI. And you can debug those tests with a dedicated panel in Storybook.

♿ Accessibility tests The popular a11y addon has been redesigned to be even more helpful when surfacing violations found by axe-core. Click on a highlighted violation to see details right on top of your components. And run a11y tests for your whole project with a click.

👁️ Visual tests Of course, visual testing is built-in too. With a click, run visual tests with @chromaticcom on all of your stories and see the diffs in Storybook.

🛡️ Coverage reports Calculate test coverage whenever you run your component tests, and open an interactive report from Storybook.

🚥 Test widget This all happens through the test widget in the sidebar. Toggle test types on and off and run tests for your whole project or a subset of stories with a click. Watch mode, too! Results stream in to the sidebar, so you always know where you stand.

🪶 48% Leaner Half the size of Storybook 8, with a much, much smaller and flatter dependency tree. That means less conflicts in your node_modules and a faster install. Thanks to our friends at for their guidance!

✍️ Story generation Generate additional stories or even a whole new stories file for a component in your project, without leaving Storybook. Do the same for interaction tests with

🏷️ Tag-based organization Use built-in and custom tags to filter down the sidebar to exactly what you need to get your work done. Amp it up even more with

🌐 Story globals Your components render in a context, like the color scheme, viewport size, locale, or background color. Story globals let you control that context, so you can develop, test, and document them reliably.

Vite-powered Next.js We recreated the Storybook framework for @nextjs in Vite, bringing an instant-on experience and support for everything in Storybook Test.

Svelte 5 support You can now write your @sveltejs stories using Svelte CSF, including support for runes and snippets.

React Native everywhere React Native and React Native Web can now run side-by-side in your project, so you can use the best tool for the job, whether that’s a mobile device, a simulator, or the full Storybook experience in a browser.

Try it in a new project: `npm create storybook@latest` If you have an existing Storybook project, use our automated migration wizard to help you along the way: `npx storybook@latest upgrade`

Learn more about Storybook 9: Including a sneak peek at what we’ll be doing next.

Thank you! We couldn’t have produced Storybook 9 without contributions from our incredible community. Your bug reports, PRs, feedback on new features, and early access testing were invaluable.

At @AmericanStorie3, we seamlessly integrate your brand into our shows, making it part of the story. Imagine your product in action on national TV—no interruptions, just your brand story. 📈 Discover how today! #TVAds #BrandExposure #AmericanStories