Skip to content

Storybook: Remove Emotion as JSX import source - #80647

Merged
manzoorwanijk merged 2 commits into
trunkfrom
fix/storybook-e2e-emotion-alias
Jul 24, 2026
Merged

Storybook: Remove Emotion as JSX import source#80647
manzoorwanijk merged 2 commits into
trunkfrom
fix/storybook-e2e-emotion-alias

Conversation

@aduth

@aduth aduth commented Jul 23, 2026

Copy link
Copy Markdown
Member

What?

Updates Storybook configuration to remove the jsxImportSource override to @emotion/react.

Follow-up to #80426 and specifically #80426 (comment).

Why?

  1. Fixes the issue described in Storybook: fix Emotion jsxImportSource #80426 (comment) where assigning jsxImportSource causes the import source to be injected into packages that don't necessarily define the dependency themselves, which will break under isolated npm install being explored in Explore using npm install-strategy=linked #75814.
  2. It's not necessary: As I understand, the @emotion/react JSX import source is primarily necessary to support css prop assignment to components, but the last instance of this was removed in Components: migrate View away from Emotion #79443.

How?

Removes the explicit jsxImportSource override in the Storybook configuration so that it falls back to the default (react).

@emotion/react still needs to be a dependency in storybook/package.json because it is a peer dependency of @emotion/styled, which is still used in the @wordpress/storybook tool package.

Testing Instructions

Repeating Testing Instructions from #79443.

It's also worth testing that the live Storybook (via both npm run storybook:dev and npm run storybook:build build output) is unaffected, since this configuration is common to all Storybook builds:

  1. Run npm run storybook:build && cd storybook/build && php -S localhost:8000
  2. Go to http://localhost:8000
  3. Observe that stories load as expected with no errors in browser console

Use of AI Tools

Used Cursor IDE + Auto (likely Composer) model to explore the initial proposal at #80426 (comment) and understand the viability of removing the override. Manually reviewed.

@github-actions

github-actions Bot commented Jul 23, 2026

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: aduth <aduth@git.wordpress.org>
Co-authored-by: manzoorwanijk <manzoorwanijk@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@aduth aduth added [Type] Build Tooling Issues or PRs related to build tooling Storybook Storybook and its stories for components labels Jul 23, 2026
@github-actions

Copy link
Copy Markdown

Size Change: 0 B

Total Size: 7.75 MB

compressed-size-action

@manzoorwanijk manzoorwanijk left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Better. Thanks

@manzoorwanijk
manzoorwanijk enabled auto-merge (squash) July 24, 2026 03:56
@manzoorwanijk
manzoorwanijk merged commit 65d1386 into trunk Jul 24, 2026
43 of 47 checks passed
@manzoorwanijk
manzoorwanijk deleted the fix/storybook-e2e-emotion-alias branch July 24, 2026 04:39
@github-actions github-actions Bot added this to the Gutenberg 23.7 milestone Jul 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Storybook Storybook and its stories for components [Type] Build Tooling Issues or PRs related to build tooling

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants