Storybook 8.4 launches with component testing, Svelte 5 support, improved tagging, & more

Storybook has released version 8.4, introducing a range of new features and enhancements for UI component development. The update includes a 1-click component testing and debugging tool that allows users to run tests in Vitest directly from their web browser, offering real-time results and a time-traveling debugger for addressing test failures. This tool supports watch mode and is extensible to accommodate other test runners like Chromatic’s Visual Test addon.

The new release significantly reduces Storybook's install size by 50% and lockfile additions by 75% compared to version 8.0. Additionally, the team has begun prototyping an ESM-only migration for a more compact Storybook 9.

Storybook 8.4 now supports Svelte 5, enhancing TypeScript and JSDoc support for Svelte components and integrating with Svelte CLI’s onboarding. It also includes React Native Storybook 8, offering an overhauled responsive UI optimized for mobile devices.

A new flexible tagging mechanism for filtering stories has been introduced, along with the storybook-addon-tag-badges addon to display tag information in the sidebar. The release also includes hundreds of other improvements and bug fixes, enhancing the overall usability and performance of Storybook.