Skip to content

fix(link): use localized href for SPA navigation#367

Merged
james-elicx merged 1 commit intocloudflare:mainfrom
NathanDrake2406:fix/link-locale-navigation-v2
Mar 9, 2026
Merged

fix(link): use localized href for SPA navigation#367
james-elicx merged 1 commit intocloudflare:mainfrom
NathanDrake2406:fix/link-locale-navigation-v2

Conversation

@NathanDrake2406
Copy link
Copy Markdown
Contributor

@NathanDrake2406 NathanDrake2406 commented Mar 9, 2026

Summary

  • next/link's locale prop correctly affected the rendered <a> href and prefetch path, but SPA click navigation and the onNavigate callback used the non-localized resolvedHref
  • Clicking <Link href="/about" locale="fr"> would render <a href="/fr/about"> and prefetch /fr/about, but SPA-navigate to /about
  • Fixed by using localizedHref instead of resolvedHref in the click handler (line 370) and onNavigate callback (line 386)

Test plan

  • Existing link.test.ts locale tests pass (36/36)
  • Typecheck clean
  • Lint clean
  • CI

The locale prop correctly affected the rendered <a> href and prefetch
path, but click navigation and the onNavigate callback used the
non-localized resolvedHref. This meant clicking <Link href="/about"
locale="fr"> would SPA-navigate to /about instead of /fr/about.
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Mar 9, 2026

Open in StackBlitz

npm i https://pkg.pr.new/vinext@367

commit: 7929e22

@james-elicx
Copy link
Copy Markdown
Collaborator

/bigbonk review this pr please

Copy link
Copy Markdown
Contributor

@ask-bonk ask-bonk Bot left a comment

Choose a reason for hiding this comment

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

Clean, correct fix. The bug is clear: localizedHref was already used for the rendered <a href> and the prefetch path, but the click handler and onNavigate callback were using resolvedHref (the non-localized version), causing SPA navigation to go to the wrong path when locale was specified.

The two-line change is well-scoped and consistent with how localizedHref is already used elsewhere in the component.

One minor note (not blocking): the external URL branch on lines 372-378 still calls toSameOriginPath(resolvedHref) rather than toSameOriginPath(localizedHref). This is actually fine for the common case (locale prefixes are applied to relative paths like /about, not absolute URLs), but applyLocaleToHref doesn't handle absolute URLs gracefully — it would produce something like /fr/http://localhost:3000/about. That's a pre-existing issue unrelated to this PR.

@ask-bonk
Copy link
Copy Markdown
Contributor

ask-bonk Bot commented Mar 9, 2026

Review submitted — approved the PR.

Summary: This is a clean two-line fix for a real bug where <Link locale="fr" href="/about"> would correctly render <a href="/fr/about"> and prefetch /fr/about, but SPA click navigation and the onNavigate callback used the non-localized resolvedHref (/about) instead of localizedHref (/fr/about). The fix is consistent with how localizedHref is already used for the rendered href and prefetch path. I noted a pre-existing edge case with absolute URLs + locale handling but it's unrelated to this PR.

github run

@james-elicx james-elicx merged commit f783e4f into cloudflare:main Mar 9, 2026
16 checks passed
@NathanDrake2406 NathanDrake2406 deleted the fix/link-locale-navigation-v2 branch March 18, 2026 09:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants