Core: Fix `previewHref` when current path does not end with a slash by ghengeveld · Pull Request #33647 · storybookjs/storybook

ghengeveld · 2026-01-26T12:12:03Z

What I did

Added a test to reproduce the bug, then implemented a fix which removes the part of location.pathname after the last slash, before adding the iframe.html suffix.

Checklist for Contributors

Testing

Open a Storybook and navigate to index.html. Confirm the iframe now loads correctly.

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

stories
unit tests
integration tests
end-to-end tests

Manual testing

Caution

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

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

Checklist for Maintainers

When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli-storybook/src/sandbox-templates.ts
Make sure this PR contains one of the labels below:
Available labels
- bug: Internal changes that fixes incorrect behavior.
- maintenance: User-facing maintenance tasks.
- dependencies: Upgrading (sometimes downgrading) dependencies.
- build: Internal-facing build tooling & test updates. Will not show up in release changelog.
- cleanup: Minor cleanup style change. Will not show up in release changelog.
- documentation: Documentation only changes. Will not show up in release changelog.
- feature request: Introducing a new feature.
- BREAKING CHANGE: Changes that break compatibility in some way with current major version.
- other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook publish.yml --field pr=<PR_NUMBER>

Summary by CodeRabbit

Release Notes

Bug Fixes
- Improved URL construction for the story manager and preview feature, ensuring correct iframe and manager preview paths are properly generated across different path configurations.
Tests
- Enhanced test coverage for edge cases in URL path handling.

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

nx-cloud · 2026-01-26T12:12:52Z

View your CI Pipeline Execution ↗ for commit b90afd7

Command	Status	Duration	Result
`nx run-many -t compile,check,knip,test,pretty-d...`	✅ Succeeded	9m 52s	View ↗

☁️ Nx Cloud last updated this comment at 2026-01-26 12:23:42 UTC

coderabbitai · 2026-01-26T12:15:05Z

📝 Walkthrough

Walkthrough

This change refines URL construction logic in the story manager's URL module. A pathname variable is introduced to improve handling of path segments, affecting how manager base, preview base, and iframe URLs are computed, particularly when handling cases like /index.html paths.

Changes

Cohort / File(s)	Summary
URL module updates `code/core/src/manager-api/modules/url.ts`	Introduces pathname variable from `location.pathname` with fallback to `/`. Recomputes originAddress and managerBase using this pathname. Adjusts previewBase logic to derive iframe path by stripping the last segment from managerBase and appending `iframe.html`.
URL module test updates `code/core/src/manager-api/tests/url.test.js`	Adds test case for `/index.html` path scenario verifying correct manager and preview href generation. Adds cleanup step to delete `global.PREVIEW_URL` after assertions to prevent test leakage.

Possibly related PRs

Core: Fix viewport args handling and reset option #33560 — Modifies the same code/core/src/manager-api/modules/url.ts file with changes to URL and query parameter construction logic.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

✨ Finishing touches

📝 Generate docstrings

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

storybook-app-bot · 2026-01-26T12:21:24Z

Package Benchmarks

^{Commit: b90afd7, ran on 26 January 2026 at 12:21:20 UTC}

The following packages have significant changes to their size or dependencies:

`@storybook/addon-a11y`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	184 KB	🚨 +184 KB 🚨
Dependency size	0 B	2.98 MB	🚨 +2.98 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-docs`

	Before	After	Difference
Dependency count	0	18	🚨 +18 🚨
Self size	0 B	1.64 MB	🚨 +1.64 MB 🚨
Dependency size	0 B	9.25 MB	🚨 +9.25 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-links`

	Before	After	Difference
Dependency count	0	1	🚨 +1 🚨
Self size	0 B	14 KB	🚨 +14 KB 🚨
Dependency size	0 B	5 KB	🚨 +5 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-onboarding`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	331 KB	🚨 +331 KB 🚨
Dependency size	0 B	670 B	🚨 +670 B 🚨
Bundle Size Analyzer	Link	Link

`storybook-addon-pseudo-states`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	21 KB	🚨 +21 KB 🚨
Dependency size	0 B	689 B	🚨 +689 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-themes`

	Before	After	Difference
Dependency count	0	1	🚨 +1 🚨
Self size	0 B	18 KB	🚨 +18 KB 🚨
Dependency size	0 B	28 KB	🚨 +28 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-vitest`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	379 KB	🚨 +379 KB 🚨
Dependency size	0 B	338 KB	🚨 +338 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/builder-vite`

	Before	After	Difference
Dependency count	0	11	🚨 +11 🚨
Self size	0 B	123 KB	🚨 +123 KB 🚨
Dependency size	0 B	1.30 MB	🚨 +1.30 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/builder-webpack5`

	Before	After	Difference
Dependency count	0	188	🚨 +188 🚨
Self size	0 B	75 KB	🚨 +75 KB 🚨
Dependency size	0 B	32.04 MB	🚨 +32.04 MB 🚨
Bundle Size Analyzer	Link	Link

`storybook`

	Before	After	Difference
Dependency count	0	49	🚨 +49 🚨
Self size	0 B	20.39 MB	🚨 +20.39 MB 🚨
Dependency size	0 B	16.52 MB	🚨 +16.52 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/angular`

	Before	After	Difference
Dependency count	0	188	🚨 +188 🚨
Self size	0 B	139 KB	🚨 +139 KB 🚨
Dependency size	0 B	30.27 MB	🚨 +30.27 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/ember`

	Before	After	Difference
Dependency count	0	192	🚨 +192 🚨
Self size	0 B	15 KB	🚨 +15 KB 🚨
Dependency size	0 B	28.76 MB	🚨 +28.76 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/html-vite`

	Before	After	Difference
Dependency count	0	14	🚨 +14 🚨
Self size	0 B	22 KB	🚨 +22 KB 🚨
Dependency size	0 B	1.46 MB	🚨 +1.46 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/nextjs`

	Before	After	Difference
Dependency count	0	534	🚨 +534 🚨
Self size	0 B	646 KB	🚨 +646 KB 🚨
Dependency size	0 B	59.53 MB	🚨 +59.53 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/nextjs-vite`

	Before	After	Difference
Dependency count	0	123	🚨 +123 🚨
Self size	0 B	1.12 MB	🚨 +1.12 MB 🚨
Dependency size	0 B	22.11 MB	🚨 +22.11 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preact-vite`

	Before	After	Difference
Dependency count	0	14	🚨 +14 🚨
Self size	0 B	13 KB	🚨 +13 KB 🚨
Dependency size	0 B	1.44 MB	🚨 +1.44 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-native-web-vite`

	Before	After	Difference
Dependency count	0	155	🚨 +155 🚨
Self size	0 B	30 KB	🚨 +30 KB 🚨
Dependency size	0 B	23.41 MB	🚨 +23.41 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-vite`

	Before	After	Difference
Dependency count	0	113	🚨 +113 🚨
Self size	0 B	35 KB	🚨 +35 KB 🚨
Dependency size	0 B	19.91 MB	🚨 +19.91 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-webpack5`

	Before	After	Difference
Dependency count	0	274	🚨 +274 🚨
Self size	0 B	24 KB	🚨 +24 KB 🚨
Dependency size	0 B	44.43 MB	🚨 +44.43 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/server-webpack5`

	Before	After	Difference
Dependency count	0	200	🚨 +200 🚨
Self size	0 B	16 KB	🚨 +16 KB 🚨
Dependency size	0 B	33.30 MB	🚨 +33.30 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/svelte-vite`

	Before	After	Difference
Dependency count	0	19	🚨 +19 🚨
Self size	0 B	55 KB	🚨 +55 KB 🚨
Dependency size	0 B	26.58 MB	🚨 +26.58 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/sveltekit`

	Before	After	Difference
Dependency count	0	20	🚨 +20 🚨
Self size	0 B	56 KB	🚨 +56 KB 🚨
Dependency size	0 B	26.63 MB	🚨 +26.63 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/vue3-vite`

	Before	After	Difference
Dependency count	0	108	🚨 +108 🚨
Self size	0 B	35 KB	🚨 +35 KB 🚨
Dependency size	0 B	43.67 MB	🚨 +43.67 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/web-components-vite`

	Before	After	Difference
Dependency count	0	15	🚨 +15 🚨
Self size	0 B	19 KB	🚨 +19 KB 🚨
Dependency size	0 B	1.50 MB	🚨 +1.50 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/cli`

	Before	After	Difference
Dependency count	0	183	🚨 +183 🚨
Self size	0 B	775 KB	🚨 +775 KB 🚨
Dependency size	0 B	67.55 MB	🚨 +67.55 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/codemod`

	Before	After	Difference
Dependency count	0	176	🚨 +176 🚨
Self size	0 B	30 KB	🚨 +30 KB 🚨
Dependency size	0 B	66.13 MB	🚨 +66.13 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core-webpack`

	Before	After	Difference
Dependency count	0	1	🚨 +1 🚨
Self size	0 B	11 KB	🚨 +11 KB 🚨
Dependency size	0 B	28 KB	🚨 +28 KB 🚨
Bundle Size Analyzer	Link	Link

`create-storybook`

	Before	After	Difference
Dependency count	0	50	🚨 +50 🚨
Self size	0 B	1000 KB	🚨 +1000 KB 🚨
Dependency size	0 B	36.91 MB	🚨 +36.91 MB 🚨
Bundle Size Analyzer	node	node

`@storybook/csf-plugin`

	Before	After	Difference
Dependency count	0	9	🚨 +9 🚨
Self size	0 B	7 KB	🚨 +7 KB 🚨
Dependency size	0 B	1.26 MB	🚨 +1.26 MB 🚨
Bundle Size Analyzer	Link	Link

`eslint-plugin-storybook`

	Before	After	Difference
Dependency count	0	20	🚨 +20 🚨
Self size	0 B	131 KB	🚨 +131 KB 🚨
Dependency size	0 B	2.82 MB	🚨 +2.82 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-dom-shim`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	18 KB	🚨 +18 KB 🚨
Dependency size	0 B	788 B	🚨 +788 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-create-react-app`

	Before	After	Difference
Dependency count	0	68	🚨 +68 🚨
Self size	0 B	32 KB	🚨 +32 KB 🚨
Dependency size	0 B	5.98 MB	🚨 +5.98 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-react-webpack`

	Before	After	Difference
Dependency count	0	170	🚨 +170 🚨
Self size	0 B	18 KB	🚨 +18 KB 🚨
Dependency size	0 B	31.29 MB	🚨 +31.29 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-server-webpack`

	Before	After	Difference
Dependency count	0	10	🚨 +10 🚨
Self size	0 B	7 KB	🚨 +7 KB 🚨
Dependency size	0 B	1.20 MB	🚨 +1.20 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/html`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	29 KB	🚨 +29 KB 🚨
Dependency size	0 B	32 KB	🚨 +32 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preact`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	16 KB	🚨 +16 KB 🚨
Dependency size	0 B	32 KB	🚨 +32 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react`

	Before	After	Difference
Dependency count	0	57	🚨 +57 🚨
Self size	0 B	1.23 MB	🚨 +1.23 MB 🚨
Dependency size	0 B	12.95 MB	🚨 +12.95 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/server`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	8 KB	🚨 +8 KB 🚨
Dependency size	0 B	716 KB	🚨 +716 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/svelte`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	45 KB	🚨 +45 KB 🚨
Dependency size	0 B	230 KB	🚨 +230 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/vue3`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	63 KB	🚨 +63 KB 🚨
Dependency size	0 B	211 KB	🚨 +211 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/web-components`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	61 KB	🚨 +61 KB 🚨
Dependency size	0 B	47 KB	🚨 +47 KB 🚨
Bundle Size Analyzer	Link	Link

Core: Fix `previewHref` when current path does not end with a slash (cherry picked from commit 00f506c)

Fix previewHref when current path does not end with a slash

b90afd7

ghengeveld self-assigned this Jan 26, 2026

ghengeveld requested a review from ndelangen January 26, 2026 12:12

ghengeveld added bug ci:normal labels Jan 26, 2026

ndelangen approved these changes Jan 26, 2026

View reviewed changes

ghengeveld merged commit 00f506c into next Jan 26, 2026
129 of 134 checks passed

ghengeveld deleted the fix-iframe-href branch January 26, 2026 13:15

github-actions Bot mentioned this pull request Jan 26, 2026

Release: Prerelease alpha 10.3.0-alpha.1 #33621

Merged

14 tasks

coderabbitai Bot mentioned this pull request Jan 28, 2026

Manager: Update logic to use base path instead of full pathname #33686

Merged

8 tasks

This was referenced Jan 28, 2026

[Bug]: Built SB renders with wrong path and no addons if visiting /index.html directly #33548

Closed

Manager: Redirect index.html to root to fix initialization issues #33625

Closed

Core: Fix iframe URL issues and Addons display for /index.html #33624

Closed

valentinpalkovic added the patch:yes Bugfix & documentation PR that need to be picked to main branch label Jan 30, 2026

github-actions Bot mentioned this pull request Jan 30, 2026

Release: Patch 10.2.3 #33716

Merged

4 tasks

valentinpalkovic pushed a commit that referenced this pull request Jan 30, 2026

Merge pull request #33647 from storybookjs/fix-iframe-href

4ef05ef

Core: Fix `previewHref` when current path does not end with a slash (cherry picked from commit 00f506c)

github-actions Bot added the patch:done Patch/release PRs already cherry-picked to main/release branch label Jan 30, 2026

coderabbitai Bot mentioned this pull request Feb 21, 2026

Core: Storybook failed to load iframe.html when publishing #33896

Merged

dosubot Bot mentioned this pull request Feb 27, 2026

[Bug]: "Open in isolation mode" is broken with Storybook v10 when using on a URL containing index.html (a deployed version of Storybook) #32978

Closed

coderabbitai Bot mentioned this pull request Mar 11, 2026

Core: Fix iframe reference for composed Storybook on a subpath #34100

Merged

8 tasks

coderabbitai Bot mentioned this pull request Apr 23, 2026

fix: handle existing query params in preview iframe URL #34617

Open

coderabbitai Bot mentioned this pull request May 2, 2026

fix: correctly merge query params when preview-url contains query string #34685

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Core: Fix `previewHref` when current path does not end with a slash#33647

Core: Fix `previewHref` when current path does not end with a slash#33647
ghengeveld merged 1 commit into
nextfrom
fix-iframe-href

ghengeveld commented Jan 26, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

nx-cloud Bot commented Jan 26, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented Jan 26, 2026

Walkthrough

Changes

Possibly related PRs

Estimated code review effort

Uh oh!

storybook-app-bot Bot commented Jan 26, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

Conversation

ghengeveld commented Jan 26, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What I did

Checklist for Contributors

Testing

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

Manual testing

Documentation

Checklist for Maintainers

🦋 Canary release

Summary by CodeRabbit

Release Notes

Uh oh!

nx-cloud Bot commented Jan 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented Jan 26, 2026

Walkthrough

Changes

Possibly related PRs

Estimated code review effort

Uh oh!

storybook-app-bot Bot commented Jan 26, 2026

Package Benchmarks

@storybook/addon-a11y

@storybook/addon-docs

@storybook/addon-links

@storybook/addon-onboarding

storybook-addon-pseudo-states

@storybook/addon-themes

@storybook/addon-vitest

@storybook/builder-vite

@storybook/builder-webpack5

storybook

@storybook/angular

@storybook/ember

@storybook/html-vite

@storybook/nextjs

@storybook/nextjs-vite

@storybook/preact-vite

@storybook/react-native-web-vite

@storybook/react-vite

@storybook/react-webpack5

@storybook/server-webpack5

@storybook/svelte-vite

@storybook/sveltekit

@storybook/vue3-vite

@storybook/web-components-vite

@storybook/cli

@storybook/codemod

@storybook/core-webpack

create-storybook

@storybook/csf-plugin

eslint-plugin-storybook

@storybook/react-dom-shim

@storybook/preset-create-react-app

@storybook/preset-react-webpack

@storybook/preset-server-webpack

@storybook/html

@storybook/preact

@storybook/react

@storybook/server

@storybook/svelte

@storybook/vue3

@storybook/web-components

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ghengeveld commented Jan 26, 2026 •

edited by coderabbitai Bot

Loading

nx-cloud Bot commented Jan 26, 2026 •

edited

Loading

`@storybook/addon-a11y`

`@storybook/addon-docs`

`@storybook/addon-links`

`@storybook/addon-onboarding`

`storybook-addon-pseudo-states`

`@storybook/addon-themes`

`@storybook/addon-vitest`

`@storybook/builder-vite`

`@storybook/builder-webpack5`

`storybook`

`@storybook/angular`

`@storybook/ember`

`@storybook/html-vite`

`@storybook/nextjs`

`@storybook/nextjs-vite`

`@storybook/preact-vite`

`@storybook/react-native-web-vite`

`@storybook/react-vite`

`@storybook/react-webpack5`

`@storybook/server-webpack5`

`@storybook/svelte-vite`

`@storybook/sveltekit`

`@storybook/vue3-vite`

`@storybook/web-components-vite`

`@storybook/cli`

`@storybook/codemod`

`@storybook/core-webpack`

`create-storybook`

`@storybook/csf-plugin`

`eslint-plugin-storybook`

`@storybook/react-dom-shim`

`@storybook/preset-create-react-app`

`@storybook/preset-react-webpack`

`@storybook/preset-server-webpack`

`@storybook/html`

`@storybook/preact`

`@storybook/react`

`@storybook/server`

`@storybook/svelte`

`@storybook/vue3`

`@storybook/web-components`