chore(storybook): upgrade Storybook 7 to 8#60903
Merged
Merged
Conversation
Bump both Storybook installs (the webpack5 main app and the Vite-based Quill design system) and the shared pnpm catalog from 7.6 to 8.6. The two must move together because @storybook/react, @storybook/types and @storybook/addon-actions are shared catalog entries — mixing majors across the monorepo breaks resolution. - Remove the stale `storybook` webpack alias in common/storybook/ webpack.config.js. It pointed at frontend/.storybook (a directory that no longer exists) and was imported nowhere. Harmless under v7, but v8's framework imports from the `storybook/internal/*` subpath exports, and the prefix alias shadowed them — breaking the build with "Can't resolve 'storybook/internal/csf'". - Drop @storybook/addons, @storybook/api, @storybook/components and @storybook/core-events: removed/internalized in v8 and not imported anywhere in app code. - Bump @storybook/test-runner to ^0.19.1 and storybook-addon-pseudo-states to ^3 (Storybook 8 compatible lines); storybook-dark-mode to ^4 for Quill. - Remove the typescript.reactDocgen override — react-docgen is the v8 default, so the override is now redundant. Both Storybook builds verified green under v8 locally. Generated-By: PostHog Code Task-Id: c9431fe1-f7b8-4738-8096-6f2668e96907
Contributor
|
Reviews (1): Last reviewed commit: "chore(storybook): upgrade Storybook 7 to..." | Re-trigger Greptile |
Contributor
|
Size Change: -6.65 kB (-0.01%) Total Size: 81 MB 📦 View Changed
ℹ️ View Unchanged
|
Contributor
Query snapshots: Backend query snapshots updatedChanges: 1 snapshots (0 modified, 1 added, 0 deleted) What this means:
Next steps:
|
Contributor
There was a problem hiding this comment.
Pull request overview
Upgrades the repo’s Storybook setup from v7.6 to v8.6 (monorepo-wide via pnpm catalog), unblocking maintenance and keeping visual-regression tooling on a supported major.
Changes:
- Bumped pnpm catalog
@storybook/*versions to^8.6.14to keep both Storybook installs on the same major. - Updated both Storybook package.json files to Storybook 8 + newer test-runner and addons; removed v7-era
@storybook/*packages that are no longer needed. - Removed a stale webpack alias (
storybook) that would shadowstorybook/internal/*subpath exports in v8; removed a redundant TS docgen override in Storybook config.
Reviewed changes
Copilot reviewed 6 out of 7 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| pnpm-workspace.yaml | Updates shared pnpm catalog Storybook versions to v8, keeping the monorepo consistent. |
| packages/quill/apps/storybook/package.json | Upgrades Quill’s Vite Storybook dependencies to v8 and updates related addons/test-runner. |
| common/storybook/webpack.config.js | Removes a conflicting/stale storybook resolve alias that breaks v8 internal imports. |
| common/storybook/package.json | Upgrades the webpack5 Storybook app dependencies to v8 and removes no-longer-needed v7 packages. |
| common/storybook/.storybook/main.ts | Removes a now-redundant TS reactDocgen override under Storybook 8 defaults. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Contributor
|
✅ Visual changes approved by @gantoine — baseline updated in 7 changed, 2 removed. |
Two issues surfaced by the Storybook 8 type definitions: - mswDecorator returned DecoratorFunction<any>. In v8 the first type param is the renderer, so this resolved to DecoratorFunction<any-renderer> and no longer matched the DecoratorFunction<ReactRenderer, Args> expected by story `decorators` arrays. Typed it as DecoratorFunction<ReactRenderer, any>. - 12 product packages declared @storybook/react (and @storybook/addon-actions) as "*" rather than "catalog:". The wildcard kept resolving to the stale Storybook 7 entry in the lockfile while catalog packages moved to 8, so two Storybook type versions coexisted and StoryContext shapes diverged (v8 adds step/canvas/mount/reporting). Pinned them to catalog: so the whole monorepo resolves to a single Storybook 8. `tsc --noEmit` on @posthog/frontend is clean after these changes. Generated-By: PostHog Code Task-Id: c9431fe1-f7b8-4738-8096-6f2668e96907
Storybook 8 removed the CSF-in-MDX (.stories.mdx) format. addon-docs now excludes /(stories|story)\.mdx$/ from MDX compilation, so our docs-only .stories.mdx files fell through to the story loader and failed to parse (raw <Meta> JSX). This only surfaced in `storybook dev` / a full build — `build --test` (what CI visual regression runs) disables docs, so it was silently masked. - Rename the 11 docs-only *.stories.mdx files to *.mdx (the v8 convention for unattached docs). Their sidebar titles come from <Meta title>, so they're unaffected. - "How to create stories.stories.mdx" → "How to create stories guide.mdx": even as plain .mdx it ended in "stories.mdx" and stayed caught by the addon-docs exclude, so it needed a name not ending in stories/story. - Split the stories glob into *.mdx and *.stories.@(js|jsx|ts|tsx) per the v8 convention. Full `storybook build` (docs enabled) is green. Generated-By: PostHog Code Task-Id: c9431fe1-f7b8-4738-8096-6f2668e96907
7 updated, 2 removed Run: 17510dcd-bc38-4ba6-8568-de54c3ac5be0 Co-authored-by: gantoine <3247106+gantoine@users.noreply.github.com>
webjunkie
approved these changes
Jun 2, 2026
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub. |
Contributor
|
🎭 Playwright report · View test results →
These issues are not necessarily caused by your changes. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
Storybook was pinned to 7.6 across the monorepo. v7 is end-of-life, so the design-system and visual-regression tooling was stuck on an unmaintained major. This upgrades both Storybook installs to the latest 8.x line (8.6.18 at resolve time).
Changes
Bumps both Storybook installs and the shared pnpm catalog from 7.6 → 8.6:
pnpm-workspace.yaml— catalog entries (@storybook/react,@storybook/types,@storybook/addon-actions) →^8.6.14. These are shared byfrontend, everyproducts/*, and the Quill Storybook, so the bump can't be scoped to a single app — mixing majors across the catalog breaks resolution. Both Storybooks therefore move together.common/storybook/package.json(webpack5 main app) — all@storybook/*→^8.6.14;@storybook/test-runner→^0.19.1;storybook-addon-pseudo-states→^3. Dropped@storybook/addons,@storybook/api,@storybook/components,@storybook/core-events— removed/internalized in v8 and not imported anywhere in app code.packages/quill/apps/storybook/package.json(Vite app) —@storybook/*→^8.6.14;storybook-dark-mode→^4;storybook-addon-pseudo-states→^3;test-runner→^0.19.1.common/storybook/webpack.config.js— removed the stalestorybookresolve alias. It pointed atfrontend/.storybook(a directory that no longer exists — config now lives incommon/storybook/.storybook) and was imported nowhere. Harmless under v7, but v8's framework imports from thestorybook/internal/*subpath exports, and the prefix alias shadowed them, breaking the build withCan't resolve 'storybook/internal/csf'. This was the one real migration blocker.common/storybook/.storybook/main.ts— removed thetypescript.reactDocgen: 'react-docgen'override. It's the v8 default, so the override (already flagged in a// Shouldn't be needed in Storybook 8comment) is now redundant.Stories themselves needed no changes — the codebase was already 100% CSF3 with no
storiesOf/CSF2 usage.How did you test this code?
I'm an agent. I did not perform manual UI testing. Automated checks run locally:
pnpm install --frozen-lockfile— passes against the regenerated lockfile.pnpm --filter=@posthog/storybook build --test— builds green under v8 (Manager + Preview built,dist/emitted). Required raising the Node heap locally; CI runners have the headroom.storybook build— builds green under v8 (Preview built,storybook-static/emitted).The visual-regression suite (
test-storybook) was not run locally — that runs inci-storybook.ymland is the main thing to watch on this PR, since the test-runner also jumped a major (0.16 → 0.19).Automatic notifications
Docs update
No docs changes needed.
🤖 Agent context
Authored by PostHog Code (Claude). Started as an investigation of what a v8 upgrade entails, then drafted the change.
Key decisions and findings along the way:
@storybook/*packages were verified unused by grepping all imports — only@storybook/csf(kept) is actually imported.storybook/internal/csfbuild failure was traced to the stale webpack alias rather than guessed at; confirmed the alias target doesn't exist and nothing imports it before removing.@posthog/quill-*and@posthog/hogvmdist/, and a heap OOM) were confirmed to be local environment/build-order artifacts, not v8 regressions — they resolve once workspace deps are built and the heap is raised, which CI handles.Agent-authored; requires human review. Please give the
ci-storybookvisual-regression run a careful look before merging.Created with PostHog Code