Revert "Bump to Storybook v10 (#6685)" by PavelVanecek · Pull Request #6717 · recharts/recharts

PavelVanecek · 2025-12-02T11:08:08Z

Description

Turns out that our storybook addons need complete rewrite so until that happens let's stick to v9.

Related Issue

#6685

Summary by CodeRabbit

Revert
- Rolled back Storybook and Chromatic packages to earlier stable versions for improved reliability.
Chores
- Refined Storybook's default background configuration.
- Updated module system settings for enhanced tooling compatibility.
- Optimized component behavior for better integration support.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

This reverts commit d2cfeec.

coderabbitai · 2025-12-02T11:08:23Z

Walkthrough

This PR downgrades Storybook and related packages from v10 to v9, updates preview configuration for background defaults, simplifies a runtime guard check in StackBlitzButton, and changes TypeScript module compilation from NodeNext to CommonJS.

Changes

Cohort / File(s)	Summary
Dependency Downgrade `package.json`	Downgraded `@chromatic-com/storybook`, storybook core and addons (addon-a11y, addon-docs, addon-links, addon-onboarding, addon-vitest, builder-vite), storybook react-vite adapter, and eslint-plugin-storybook from v10 to v9 versions
Storybook Configuration `storybook/preview.ts`, `storybook/tsconfig.json`	Updated preview.ts backgrounds parameter from empty object to `{ default: 'light' }` and removed initialGlobals background configuration; changed tsconfig module system from NodeNext to CommonJS
Component Logic `storybook/storybook-addon-stackblitz/StackBlitzButton.tsx`	Removed subtype equality check from rootEntry guard condition, now only checking rootEntry.type instead of both type and subtype

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

StackBlitzButton.tsx — Verify the removal of the subtype === 'story' check is intentional for v9 compatibility and won't cause unintended rendering behavior
preview.ts — Confirm the shift from initialGlobals to parameters.backgrounds for default background configuration works as expected in v9

Possibly related PRs

Bump to Storybook v10 #6685 — Directly reverses this PR; it previously upgraded Storybook from v9 to v10 and made the inverse changes to preview.ts, StackBlitzButton, and tsconfig.json

Suggested reviewers

ckifer

Pre-merge checks and finishing touches

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	❓ Inconclusive	The description includes a clear explanation and related issue link, but lacks details on testing, motivation/context, and required checklist items.	Add sections for 'Motivation and Context' explaining why the revert is necessary, 'How Has This Been Tested', and complete the Types of changes and Checklist sections.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main change: reverting the Storybook v10 upgrade. It references the original PR number for context.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch storybook9

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 837d76f and 3601a6a.

⛔ Files ignored due to path filters (1)

package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (4)

package.json (4 hunks)
storybook/preview.ts (1 hunks)
storybook/storybook-addon-stackblitz/StackBlitzButton.tsx (1 hunks)
storybook/tsconfig.json (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (DEVELOPING.md)

Run type checking on the codebase using npm run check-types

**/*.{ts,tsx}: Never use any type (implicit or explicit) in TypeScript code
Prefer unknown over any and refine the type in TypeScript
Type function parameters and return values explicitly in TypeScript, do not rely on implicit any or inference; exceptions are React components and trivial functions
Do not use as type assertions in TypeScript; the only exception is as const

Files:

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx
storybook/preview.ts

**/*.{js,ts,tsx}

📄 CodeRabbit inference engine (CONTRIBUTING.md)

Ensure code lints by running npm run lint and follows Airbnb's Style Guide

Files:

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx
storybook/preview.ts

🧠 Learnings (6)

📓 Common learnings

Learnt from: CR
Repo: recharts/recharts PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-25T01:22:59.729Z
Learning: Applies to storybook/stories/**/*.stories.tsx : Update Storybook stories when APIs have been changed to ensure they work as expected

Learnt from: CR
Repo: recharts/recharts PR: 0
File: DEVELOPING.md:0-0
Timestamp: 2025-11-25T01:22:48.289Z
Learning: Applies to storybook/**/*.stories.{ts,tsx} : Use Storybook stories in the `storybook` directory for high-fidelity component examples that will be published and used for visual regression testing

📚 Learning: 2025-11-25T01:22:59.729Z

Learnt from: CR
Repo: recharts/recharts PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-25T01:22:59.729Z
Learning: Applies to storybook/stories/**/*.stories.tsx : Update Storybook stories when APIs have been changed to ensure they work as expected

Applied to files:

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx
storybook/preview.ts
package.json
storybook/tsconfig.json

📚 Learning: 2025-11-25T01:22:59.729Z

Learnt from: CR
Repo: recharts/recharts PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-25T01:22:59.729Z
Learning: Applies to storybook/stories/**/*.stories.tsx : Use Storybook for smoke tests and add play functions with assertions for actual tests

Applied to files:

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx
package.json

📚 Learning: 2025-11-25T01:22:48.289Z

Learnt from: CR
Repo: recharts/recharts PR: 0
File: DEVELOPING.md:0-0
Timestamp: 2025-11-25T01:22:48.289Z
Learning: Applies to storybook/**/*.stories.{ts,tsx} : Use Storybook stories in the `storybook` directory for high-fidelity component examples that will be published and used for visual regression testing

Applied to files:

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx
package.json
storybook/tsconfig.json

📚 Learning: 2025-11-28T12:59:40.618Z

Learnt from: PavelVanecek
Repo: recharts/recharts PR: 6685
File: storybook/preview.ts:21-21
Timestamp: 2025-11-28T12:59:40.618Z
Learning: Storybook's backgrounds addon provides two built-in default options: "light" and "dark". These options are available without needing to explicitly define them in parameters.backgrounds.options, so initialGlobals.backgrounds.value can reference 'light' or 'dark' directly.

Applied to files:

storybook/preview.ts

📚 Learning: 2025-11-25T01:23:08.250Z

Learnt from: CR
Repo: recharts/recharts PR: 0
File: test/README.md:0-0
Timestamp: 2025-11-25T01:23:08.250Z
Learning: Applies to test/**/*.{test,spec}.{ts,tsx} : Use `vi.useFakeTimers()` in all tests due to Redux autoBatchEnhancer dependency on timers and `requestAnimationFrame`

Applied to files:

package.json

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

GitHub Check: Build, Test, Pack
GitHub Check: Analyze (javascript-typescript)

🔇 Additional comments (4)

storybook/preview.ts (1)

21-23: LGTM! Correct backgrounds configuration for Storybook v9.

The change correctly updates the backgrounds configuration to use parameters.backgrounds.default instead of the v10 API. The 'light' value references Storybook's built-in background option, maintaining the same default background behavior.

storybook/storybook-addon-stackblitz/StackBlitzButton.tsx (1)

15-15: No changes needed; the guard is appropriate for Storybook v9.

The current guard at line 15 correctly checks rootEntry.type !== 'story' which is the proper type discriminator in Storybook v9. There is no evidence of a subtype property check being removed—the code contains no subtype references related to Storybook's internal types. The type narrowing followed by the StoryEntry cast on line 19 is correct and type-safe.

package.json (1)

105-105: The Storybook v9 downgrade is complete and properly reverted.

This is a comprehensive revert from v10 back to v9.0.17, which includes all 98+ story files and configuration. Stories use v9-compatible syntax (verified against ZAxis.stories.tsx), and the Storybook configuration properly targets the v9 framework and addons. The v10 bump introduced breaking changes warranting the full revert, which has been successfully completed.
storybook/tsconfig.json (1)
7-7: Verify that type checking passes after the module configuration change.

The change from "NodeNext" to "commonjs" aligns with reverting to Storybook v9. Ensure type checking passes by running:
npm run check-types
This command will verify type checking across the entire codebase, including the storybook configuration.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

codecov · 2025-12-02T11:18:35Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 94.03%. Comparing base (837d76f) to head (3601a6a).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #6717   +/-   ##
=======================================
  Coverage   94.03%   94.03%           
=======================================
  Files         500      500           
  Lines       42662    42662           
  Branches     4901     4901           
=======================================
  Hits        40116    40116           
  Misses       2541     2541           
  Partials        5        5

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

codecov · 2025-12-02T11:20:53Z

Bundle Report

Bundle size has no change ✅

Revert "Bump to Storybook v10 (#6685)"

3601a6a

This reverts commit d2cfeec.

PavelVanecek merged commit 3599a10 into main Dec 2, 2025
37 of 39 checks passed

PavelVanecek deleted the storybook9 branch December 2, 2025 12:39

coderabbitai Bot mentioned this pull request May 29, 2026

Bump storybook to v10 #7383

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Revert "Bump to Storybook v10 (#6685)"#6717

Revert "Bump to Storybook v10 (#6685)"#6717
PavelVanecek merged 1 commit into
mainfrom
storybook9

PavelVanecek commented Dec 2, 2025 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Dec 2, 2025 •

edited

Loading

Uh oh!

codecov Bot commented Dec 2, 2025 •

edited

Loading

Uh oh!

codecov Bot commented Dec 2, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Uh oh!

Conversation

PavelVanecek commented Dec 2, 2025 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Related Issue

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Dec 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Pre-merge checks and finishing touches

Uh oh!

codecov Bot commented Dec 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

codecov Bot commented Dec 2, 2025

Bundle Report

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

PavelVanecek commented Dec 2, 2025 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Dec 2, 2025 •

edited

Loading

codecov Bot commented Dec 2, 2025 •

edited

Loading