Upgrading @storybook/addon-links 7 to 8
Breaking7.6.24 → 8.6.19Breaking55Security15Platform7Deprecated3New135Changed267Fixed382Other57
BreakingUpgrade verdict
52 breaking changes and 7 platform requirement changes and 15 security fixes.
In plain terms
- Removes the warnings API from the a11y addon.
- The entrypoint used to load the Vitest plugin has a new name, so imports may need updating.
- Support for .stories.mdx files is further removed, so those files will no longer be handled.
- The globals setting in preview.js is now called initialGlobals, so existing configs using globals need updating.
Must act Top 5 of 77 that need code or config changes
@storybook/addon-links publishes an official migration guide for version 8. It covers more than the release notes do.
Migration Guide ↗Drops @storybook/csf.
Installs 2 packages in all (was 4).
What you must change
Breaking52
Removes the warnings API from the a11y addon.
Renames the Vitest plugin entrypoint.
Removes more .stories.mdx handling.
.stories.mdxRenames preview.js globals to initialGlobals.
preview.jsglobalsinitialGlobalsDrops the unneeded
UPDATE_STORY_ARGS event that was for SSv6.UPDATE_STORY_ARGSRemoves the 'left' property from TooltipLinkList and Link components.
TooltipLinkListLinkRenames the
--webpack-stats-json CLI flag to --stats-json since it works in Vite.--webpack-stats-json--stats-jsonCLI removes the argTypesRegex automigration.
argTypesRegexCLI removes the logging to file feature from autoblockers.
Svelte removes deprecated SvelteComponentTyped in favor of SvelteComponent.
SvelteComponentTypedSvelteComponentRemoves defaultProps from the Link component in the UI.
LinkdefaultPropsAdds
subcomponents support to ArgTypes and Controls, and removes the ArgsTable block.subcomponentsArgTypesControlsArgsTableRemoves the passArgsFirst parameter flag.
passArgsFirstRemoves the deprecated config preset.
Removes deprecated APIs from the manager and preview APIs.
Removes the unused hideNoControlsWarning type from Addon Controls.
hideNoControlsWarningRemoves the deprecated Story type from Angular.
StoryRemoves deprecated properties from manager-api.
manager-apiRemoves the deprecated standalone webpackConfig option.
webpackConfigRemoves the storyStoreV7 feature flag.
storyStoreV7Removes deprecated createChannel APIs.
createChannelRemoves the babel and SWC compiler from the Webpack5 builder.
Webpack5Removes LinkTo from the direct import of @storybook/addon-links.
LinkToRemoves deprecated parameters from Addon docs.
Removes the StorybookViteConfig type in favor of StorybookConfig.
StorybookViteConfigStorybookConfigRemoves the collapseAll and expandAll methods.
collapseAllexpandAllRemoves storyIndexers in favor of experimental_indexers.
storyIndexersexperimental_indexersRemoves the unused staticDir type.
staticDirRemoves deprecated props from the Description doc block.
DescriptionPrimarySourceStoryRemoves the deprecated navigateToSettingsPage manager API method.
navigateToSettingsPageRemoves the deprecated setGlobalConfig portable stories API for React.
setGlobalConfigRemoves deprecated addons module types from TypeScript.
Removes the DecoratorFn, Story, ComponentStory, ComponentStoryObj, ComponentStoryFn and ComponentMeta types.
DecoratorFnStoryComponentStoryComponentStoryObjComponentStoryFnComponentMetaRemoves the Framework type in favor of Renderer types.
FrameworkRendererRemoves deprecated WithTooltip props.
WithTooltipCLI removes the --use-npm flag.
--use-npmCore removes the unused warnOnLegacyHierarchySeparator type.
warnOnLegacyHierarchySeparatorCore removes vite plugins and drops Vite 3 support.
Removes stories.json support from the API.
stories.jsonRemoves the react peer dependency from Addon Docs.
reactVue: Removes deprecated vue packages from next.
Vue: Removes unused preset-vue-webpack.
preset-vue-webpackRemoves unused and deprecated packages.
Removes the
sb extract CLI command.sb extractRemoves the
storiesOf API.storiesOfStops setting process.env.NODE_ENV and process.env.DEV.
process.env.NODE_ENVprocess.env.DEVAdjusts beforeAll to be non-nullable in NormalizedProjectAnnotations.
beforeAllNormalizedProjectAnnotationsRequires a modifier key to trigger the
F, A, D, S, T and / shortcuts.FADST/Errors on explicit actions while rendering or playing.
Changes StoryFnReactReturnType to JSX.Element.
StoryFnReactReturnTypeJSX.ElementReplaces
Form.Button with the new Button component.Form.ButtonButtonReplaces @storybook/jest with @storybook/test for interaction testing.
@storybook/jest@storybook/testSecurity15
Prevents menu items from emitting arbitrary channel events.
Restricts preview postMessage to known manager origins.
postMessageSeparates manager and preview roles on the dev server channel.
Blocks iframe embedding of the dev server from non-localhost origins.
Rejects component search queries outside the project.
Validates component export name when creating a story.
Adds host validation warning and origin validation for MCP.
MCPContains save story path to the project root.
Validates save story name and arg keys as identifiers.
Disables browser file writes and command execution in Addon Vitest.
Adds request validation.
Hardens the websocket connection.
Replaces the ip function with a small helper function to address security concerns.
ipBumps webpack-dev-middleware to patch a high severity security issue.
webpack-dev-middlewareCore updates the ip dependency to fix CVE-2023-42282.
ipPlatform7
Adds @storybook/test as an optional peer dependency for ReactVite.
@storybook/testMakes prettier an optional peer dependency.
prettierRelaxes the peer dependency constraint of shim packages.
React: Supports v19 betas in peer dependencies.
CLI updates the minimum Node.js version requirement.
Updates the Node.js version requirement to >= 18.0.0.
Sets the engines field to Node.js >= 18 for packages.
Deprecations to plan for
Deprecated3
Addon Themes deprecates useThemeParameters.
useThemeParametersEmits deprecated TESTING_MODULE_RUN_ALL_REQUEST for backward compatibility.
TESTING_MODULE_RUN_ALL_REQUESTRefactors preview and deprecates the story store.
story storeAPI changes
Generated by DepDelta from published .d.ts files. Not mixed with prose notes.
- removed:
function LinkTo(): null - changed:
const linkTo: (idOrTitle: string | ((...args: any[]) => string), nameInput?: string | ((...args: any[]) => string) | undefined) => (...args: any[]) => void → const linkTo: (idOrTitle: string | ((...args: any[]) => string), nameInput?: string | ((...args: any[]) => string)) => (...args: any[]) => void - changed:
const withLinks: lib_preview_api_dist_addons.MakeDecoratorResult → const withLinks: (...args: any) => any - added:
const default: () => core_dist_types.ProjectAnnotations<core_dist_types.Renderer>
- added:
const decorators: ((...args: any) => any)[]