Skip to content

fix: narrow CSF factory decorator context types#34687

Open
cyphercodes wants to merge 2 commits into
storybookjs:nextfrom
cyphercodes:fix/csf-next-decorator-context-parameters
Open

fix: narrow CSF factory decorator context types#34687
cyphercodes wants to merge 2 commits into
storybookjs:nextfrom
cyphercodes:fix/csf-next-decorator-context-parameters

Conversation

@cyphercodes
Copy link
Copy Markdown
Contributor

@cyphercodes cyphercodes commented May 2, 2026

Closes #33801

What I did

  • Reuses CSF4 typed addon/core parameter and global types for decorator story context.
  • Adds type-level regression coverage for decorator context parameters and typed globals in CSF factories.
  • Keeps the internal portable-story marker assignment compatible with the narrower public parameter type.

AI assistance was used to prepare this contribution.

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

  • stories
  • unit tests
  • integration tests
  • end-to-end tests

Manual testing

No manual browser testing was needed; this is a TypeScript type inference fix. I ran:

  • yarn exec oxfmt --check code/core/src/csf/story.ts code/core/src/csf/csf-factories.test.ts code/core/src/preview-api/modules/store/csf/portable-stories.ts
  • targeted TypeScript check for code/core/src/csf/csf-factories.test.ts
  • yarn vitest run --config code/core/vitest.config.ts code/core/src/csf/csf-factories.test.ts
  • NODE_OPTIONS=--max-old-space-size=4096 yarn exec jiti ./scripts/check/check-package.ts --cwd code/core

Documentation

  • Add or update documentation reflecting your changes
  • If you are deprecating/removing a feature, make sure to update
    MIGRATION.MD

Summary by CodeRabbit

  • Tests

    • Added a test validating TypeScript inference for addon parameters and typed globals inside story decorators.
  • Refactor

    • Improved TypeScript typings for parameters and globals across the story/preview surface to provide more accurate IDE autocompletion and type checking.
  • Chores

    • Updated and cleaned several repository submodule references.

Review Change Stack

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 2, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 50643f09-0a65-478d-8f3e-7f58b8b2f886

📥 Commits

Reviewing files that changed from the base of the PR and between addf13d and 11ee327.

📒 Files selected for processing (14)
  • .external/addon-svelte-csf
  • .external/addon-webpack5-compiler-babel
  • .external/addon-webpack5-compiler-swc
  • .rollout-repos/addon-coverage
  • .rollout-repos/addon-designs
  • .rollout-repos/addon-kit
  • .rollout-repos/addon-styling-webpack
  • .rollout-repos/addon-visual-tests
  • .rollout-repos/addon-webpack5-compiler-babel
  • .rollout-repos/addon-webpack5-compiler-swc
  • .rollout-repos/icons
  • .rollout-repos/telejson
  • .rollout-repos/test-runner
  • .rollout-repos/vite-plugin-storybook-nextjs
💤 Files with no reviewable changes (14)
  • .rollout-repos/test-runner
  • .external/addon-svelte-csf
  • .rollout-repos/addon-designs
  • .external/addon-webpack5-compiler-swc
  • .rollout-repos/addon-visual-tests
  • .rollout-repos/addon-coverage
  • .rollout-repos/addon-webpack5-compiler-swc
  • .rollout-repos/addon-webpack5-compiler-babel
  • .rollout-repos/telejson
  • .rollout-repos/vite-plugin-storybook-nextjs
  • .external/addon-webpack5-compiler-babel
  • .rollout-repos/icons
  • .rollout-repos/addon-styling-webpack
  • .rollout-repos/addon-kit

📝 Walkthrough

Walkthrough

Added conditional helper types TypedParameters and TypedGlobals and applied them across CSF story typings; added a test validating parameter/global inference inside a decorator; adjusted a portable-stories type assignment; removed the .rollout-repos/icons submodule reference.

Changes

TypeScript Type Definition Refinement

Layer / File(s) Summary
Type Helpers and application
code/core/src/csf/story.ts
New TypedParameters<TRenderer> and TypedGlobals<TRenderer> and replaced inline conditional intersections with these helpers across story/context/annotation types.
Test Validation
code/core/src/csf/csf-factories.test.ts
New vitest case asserting TypeScript inference for addon parameters and typed globals inside a story decorator, including @ts-expect-error checks.
Type Assertion
code/core/src/preview-api/modules/store/csf/portable-stories.ts
Cast context.parameters to Parameters before setting __isPortableStory to align with updated typings.
Repo metadata
.rollout-repos/icons
Removed recorded git submodule commit reference for the icons rollout repo entry.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs


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.

@cyphercodes
Copy link
Copy Markdown
Contributor Author

Updated this PR to fix the failing Danger JS checkout step.

What changed:

  • Removed stale submodule gitlinks that were present on the PR branch but no longer exist on the next base branch. GitHub Actions checkout was failing before Danger could run with fatal: No url found for submodule path '.external/addon-svelte-csf' in .gitmodules.

Verification:

  • git submodule status
  • git diff --check

No source files were changed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

Status: Empathy Queue (prioritized)

Development

Successfully merging this pull request may close these issues.

[Bug]: Type of parameters in context argument of decorators in CSF Next preview.tsx are too broad

3 participants