fix(nuxt): redirect with hash in routeRules #33222

huang-julien · 2025-09-13T11:42:54Z

🔗 Linked issue

fix #33217 (comment)
resolves #32802

📚 Description

Should we put it under a flag to avoid unexpected behavior for our users ?

bolt-new-by-stackblitz · 2025-09-13T11:42:57Z

Run & review this pull request in StackBlitz Codeflow.

pkg-pr-new · 2025-09-13T11:46:42Z

Open in StackBlitz

@nuxt/kit

npm i https://pkg.pr.new/@nuxt/kit@33222

nuxt

npm i https://pkg.pr.new/nuxt@33222

@nuxt/rspack-builder

npm i https://pkg.pr.new/@nuxt/rspack-builder@33222

@nuxt/schema

npm i https://pkg.pr.new/@nuxt/schema@33222

@nuxt/vite-builder

npm i https://pkg.pr.new/@nuxt/vite-builder@33222

@nuxt/webpack-builder

npm i https://pkg.pr.new/@nuxt/webpack-builder@33222

commit: d53fd26

coderabbitai · 2025-09-13T11:53:07Z

Walkthrough

Redirect handling in packages/nuxt/src/app/middleware/manifest-route-rule.ts was changed to compute a redirect path that uses rules.redirect or rules.redirect plus the current route hash when the target lacks a hash. The computed path is used for navigation and is returned when a redirect is taken; the function returns false only when an in-app navigation occurs. Tests and fixtures were added: a Nitro route rule redirect for /route-rules/redirect → /, a page with a NuxtLink to /route-rules/redirect#hello, a redirect page component, and a Vitest test validating client-side navigation with a hash.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Pre-merge checks and finishing touches

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description Check	❓ Inconclusive	The description links to the relevant issue but consists only of a question about feature flags and does not summarise the implemented changes or explain how they resolve the hash-preservation bug.	Please expand the description to detail the hash-preserving redirect implementation, its impact on anchor links and any considerations for feature flags so reviewers have full context.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title succinctly and accurately describes the main change, namely preserving hash fragments in routeRules redirects, and follows the conventional commit style, making it clear to reviewers what the PR addresses.
Linked Issues Check	✅ Passed	The updated middleware now computes redirects by appending the original route’s hash when the target lacks one, and the added tests verify client-side navigation retains anchors, directly fulfilling the primary requirement of preserving hash fragments from issue #32802.
Out of Scope Changes Check	✅ Passed	All modifications—including middleware logic, tests and fixture updates—relate solely to hash-preserving redirects in routeRules, with no unrelated code or feature alterations introduced.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ 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 fix/manifestrouterulesredirect

📜 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 a73f51e and d53fd26.

📒 Files selected for processing (1)

packages/nuxt/src/app/middleware/manifest-route-rule.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Follow standard TypeScript conventions and best practices

Files:

packages/nuxt/src/app/middleware/manifest-route-rule.ts

🔇 Additional comments (2)

packages/nuxt/src/app/middleware/manifest-route-rule.ts (2)

9-9: Note: Redirect's hash takes precedence over navigation's hash.

When both rules.redirect contains a hash and the user navigates with a hash (e.g., /source#anchor → redirect to /target#default), the redirect's hash (#default) takes precedence. This is the correct choice since redirects are explicitly configured, but ensure this behavior aligns with expectations.

Consider documenting this precedence rule if it's not already clear to users.

9-14: Add tests for manifest-route-rule hash preservation
packages/nuxt/src/app/middleware/manifest-route-rule.ts lacks test coverage for its hash logic. Add tests verifying:

rules.redirect without # appends to.hash (including the leading #)

rules.redirect with an existing #... remains unchanged

External redirects use window.location.href and internal redirects return the computed path
Confirm to.hash includes the # prefix as expected by Vue Router.

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.}

coderabbitai

Actionable comments posted: 0

🧹 Nitpick comments (2)

packages/nuxt/src/app/middleware/manifest-route-rule.ts (2)
8-16: Consider feature flag protection for this behavioural change.

As mentioned in the PR objectives, this change modifies existing redirect behaviour and could potentially cause unexpected results for users who rely on the current behaviour. Consider gating this behind a feature flag to allow gradual rollout.

You could introduce a feature flag check:
  if (rules.redirect) {
+   const preserveHash = process.env.NUXT_PRESERVE_REDIRECT_HASH !== 'false'
    const hash = window.location.hash
    const redirectHasHash = rules.redirect.includes('#')
+   const hashToAppend = preserveHash && !redirectHasHash ? hash : ''
    if (hasProtocol(rules.redirect, { acceptRelative: true })) {
-     window.location.href = rules.redirect + (redirectHasHash ? '' : hash)
+     window.location.href = rules.redirect + hashToAppend
      return false
    }
-   return rules.redirect + (redirectHasHash ? '' : hash)
+   return rules.redirect + hashToAppend
  }
15-15: Normalise and percent-encode hash before concatenation

packages/nuxt/src/app/middleware/manifest-route-rule.ts:15 — current: return rules.redirect + (redirectHasHash ? '' : hash)

Ensure the fragment has no leading '#' and is percent‑encoded before appending: const frag = hash.startsWith('#') ? hash.slice(1) : hash; return rules.redirect + (redirectHasHash ? '' : '#' + encodeURIComponent(frag));

Rationale: avoids double "##", malformed '%' sequences and inconsistent browser percent‑encoding for non‑ASCII; use URL.hash or history.pushState() for deterministic history/hashchange behaviour.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 412786a and 563d059.

📒 Files selected for processing (1)

packages/nuxt/src/app/middleware/manifest-route-rule.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Follow standard TypeScript conventions and best practices

Files:

packages/nuxt/src/app/middleware/manifest-route-rule.ts

⏰ 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: code
GitHub Check: build

🔇 Additional comments (2)

packages/nuxt/src/app/middleware/manifest-route-rule.ts (2)

9-10: LGTM! Clean variable declarations for hash preservation logic.

The local variables clearly capture the current hash and check if the redirect target already contains a hash fragment.

12-12: Verify hash handling across redirect scenarios

Current implementation appends window.location.hash when rules.redirect does not include '#' (external targets use window.location.href; internal targets return the redirect string). Location: packages/nuxt/src/app/middleware/manifest-route-rule.ts (lines 8–15).

Verify behaviour for redirects that already include a fragment, contain query strings (no fragment), are protocol-relative/non-HTTP, or are hash-only (e.g. '#/path').

Add unit tests covering: external URL with/without fragment, internal route with/without fragment, and hash-only redirects.

codspeed-hq · 2025-09-13T11:58:22Z

CodSpeed Performance Report

Merging #33222 will not alter performance

_{Comparing fix/manifestrouterulesredirect (d53fd26) with main (3ef2f3b)}

Summary

✅ 10 untouched

packages/nuxt/src/app/middleware/manifest-route-rule.ts

…uxt/nuxt into fix/manifestrouterulesredirect

danielroe · 2025-09-18T19:18:45Z

can you reproduce this issue minimally? was just looking at this but things seem to work

huang-julien · 2025-10-05T21:25:33Z

can you reproduce this issue minimally? was just looking at this but things seem to work

Doesn''t work on my side on the main branch. I'll write a E2E test

Edit: Oh i just understood what you said. Yes, i'm write a test for this

huang-julien · 2025-10-05T21:53:30Z

It's a bit strange. page.waitForURL doesn't work. Feels like an issue with playwright

coderabbitai

Actionable comments posted: 1

🧹 Nitpick comments (1)

test/basic.test.ts (1)
101-106: Consider using Playwright's page.waitForURL() instead of vi.waitFor().

Playwright provides a built-in page.waitForURL() method specifically designed for waiting for URL changes, which offers better error messages and more reliable behaviour than polling with vi.waitFor(). Other tests in this file successfully use page.waitForURL() (e.g., line 1222).

Apply this diff to use the more appropriate Playwright method:
-  await vi.waitFor(() => page.url() === url('/#hello'), { timeout: 5_000 })
+  await page.waitForURL(url('/#hello'), { timeout: 5_000 })
If you're encountering issues with page.waitForURL() as mentioned in the PR comments, please document the specific problem so it can be investigated further, as this method works correctly in other tests within the same file.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3115754 and 4b786a6.

📒 Files selected for processing (4)

test/basic.test.ts (2 hunks)
test/fixtures/basic/app/pages/index.vue (1 hunks)
test/fixtures/basic/app/pages/route-rules/redirect.vue (1 hunks)
test/fixtures/basic/nuxt.config.ts (1 hunks)

✅ Files skipped from review due to trivial changes (1)

test/fixtures/basic/app/pages/route-rules/redirect.vue

🧰 Additional context used

📓 Path-based instructions (3)

**/*.vue

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Use <script setup lang="ts"> and the composition API when creating Vue components

Files:

test/fixtures/basic/app/pages/index.vue

**/*.{ts,tsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Follow standard TypeScript conventions and best practices

Files:

test/fixtures/basic/nuxt.config.ts
test/basic.test.ts

**/*.{test,spec}.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

Write unit tests for core functionality using vitest

Files:

test/basic.test.ts

🧠 Learnings (1)

📚 Learning: 2025-07-18T16:46:07.446Z

Learnt from: CR
PR: nuxt/nuxt#0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-07-18T16:46:07.446Z
Learning: Applies to **/*.{test,spec}.{ts,tsx,js,jsx} : Write unit tests for core functionality using `vitest`

Applied to files:

test/basic.test.ts

🧬 Code graph analysis (1)

test/basic.test.ts (1)

test/utils.ts (1)

renderPage (12-51)

⏰ 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). (20)

GitHub Check: test-fixtures (windows-latest, built, rspack, default, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (windows-latest, built, webpack, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (windows-latest, built, vite, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (windows-latest, dev, vite, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (windows-latest, dev, vite, default, manifest-off, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, rspack, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, vite, default, manifest-off, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, dev, vite, default, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, webpack, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, vite, async, manifest-on, js, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, vite, async, manifest-off, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, dev, vite, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, vite, async, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, built, vite, default, manifest-on, json, lts/-1)
GitHub Check: test-fixtures (ubuntu-latest, dev, vite, async, manifest-on, js, lts/-1)
GitHub Check: release-pkg-pr-new
GitHub Check: typecheck (windows-latest, bundler)
GitHub Check: test-benchmark
GitHub Check: typecheck (ubuntu-latest, bundler)
GitHub Check: code

test/basic.test.ts

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

…sredirect

danielroe · 2025-10-06T10:29:33Z

packages/nuxt/src/app/middleware/manifest-route-rule.ts

  if (rules.redirect) {
-    if (hasProtocol(rules.redirect, { acceptRelative: true })) {
-      window.location.href = rules.redirect
+    const path = rules.redirect.includes('#') ? rules.redirect : (rules.redirect + to.hash)


should we also support redirecting with a query string?

yeah... that's a good question...
Anchors whether present or not won't deeply affect the application while query string can trigger unwanted side-effects

fix(nuxt): redirect with hash in routeRules

563d059

huang-julien requested a review from danielroe as a code owner September 13, 2025 11:42

github-actions bot added 4.x bug labels Sep 13, 2025

coderabbitai bot reviewed Sep 13, 2025

View reviewed changes

Merge branch 'main' into fix/manifestrouterulesredirect

31cd3b0

Mini-ghost reviewed Sep 15, 2025

View reviewed changes

packages/nuxt/src/app/middleware/manifest-route-rule.ts Outdated Show resolved Hide resolved

huang-julien added 2 commits September 16, 2025 23:11

fix: use to.hash

dbb5e1f

Merge branch 'fix/manifestrouterulesredirect' of https://github.com/n…

3115754

…uxt/nuxt into fix/manifestrouterulesredirect

huang-julien marked this pull request as draft October 5, 2025 21:23

Merge branch 'main' into fix/manifestrouterulesredirect

98eb21a

test: add e2e test

af39f6e

huang-julien marked this pull request as ready for review October 5, 2025 21:52

chore: remove only

4b786a6

coderabbitai bot reviewed Oct 5, 2025

View reviewed changes

test/basic.test.ts Outdated Show resolved Hide resolved

huang-julien and others added 3 commits October 6, 2025 08:32

Update test/basic.test.ts

a73f51e

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

Merge remote-tracking branch 'origin/main' into fix/manifestrouterule…

180860f

…sredirect

refactor: slight simplification

d53fd26

danielroe approved these changes Oct 6, 2025

View reviewed changes

danielroe reviewed Oct 6, 2025

View reviewed changes

danielroe merged commit 5589a44 into main Oct 7, 2025
84 of 86 checks passed

danielroe deleted the fix/manifestrouterulesredirect branch October 7, 2025 13:20

github-actions bot mentioned this pull request Oct 7, 2025

v4.1.4 #33408

Closed

github-actions bot mentioned this pull request Oct 7, 2025

v4.2.0 #33425

Merged

github-actions bot mentioned this pull request Oct 23, 2025

v5.0.0 #33548

Closed

danielroe pushed a commit that referenced this pull request Oct 25, 2025

fix(nuxt): preserve hash with redirecting based on routeRules (#33222)

8bfed6b

github-actions bot mentioned this pull request Oct 25, 2025

v3.20.0 #33566

Merged

coderabbitai bot mentioned this pull request Dec 31, 2025

[Vue Router warn]: No match found for location with path on navigateTo + defineNuxtRouteMiddleware #33997

Closed

Uh oh!

fix(nuxt): redirect with hash in routeRules #33222

fix(nuxt): redirect with hash in routeRules #33222

Uh oh!

Conversation

huang-julien commented Sep 13, 2025 • edited by danielroe Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🔗 Linked issue

📚 Description

Uh oh!

bolt-new-by-stackblitz bot commented Sep 13, 2025

Uh oh!

pkg-pr-new bot commented Sep 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Sep 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Estimated code review effort

Pre-merge checks and finishing touches

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

codspeed-hq bot commented Sep 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

CodSpeed Performance Report

Merging #33222 will not alter performance

Summary

Uh oh!

Uh oh!

danielroe commented Sep 18, 2025

Uh oh!

huang-julien commented Oct 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

huang-julien commented Oct 5, 2025

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

danielroe Oct 6, 2025

Choose a reason for hiding this comment

Uh oh!

huang-julien Oct 6, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

huang-julien commented Sep 13, 2025 •

edited by danielroe

Loading

pkg-pr-new bot commented Sep 13, 2025 •

edited

Loading

coderabbitai bot commented Sep 13, 2025 •

edited

Loading

codspeed-hq bot commented Sep 13, 2025 •

edited

Loading

huang-julien commented Oct 5, 2025 •

edited

Loading