Next.js: basePath is concatenated onto absolute router.push hrefs, corrupting navigation transaction names
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 75/100
- Issue type
- Bug
- Clarity
- Clearly specified
- Activity status
- Active
- Tech stack
- javascript, next.js, typescript
- Domain
- backend-api-design, observability-sre
Research direction
The issue is in the Next.js client routing instrumentation files: build/cjs/client/routing/appRouterRoutingInstrumentation.js and likely a similar file for the router-patch path. Look for the normalizedHref assignment. The fix is to guard the concatenation so it only applies to root-relative paths (those starting with '/'), mirroring Next.js's addPathPrefix logic. Test by setting up a Next.js App Router app with a basePath, using Sentry, and verifying navigation transaction names after a router.push with an absolute URL.
Written by the indexing model from the issue text.
Description
Summary
@sentry/nextjs prepends basePath to the router.push / router.replace argument with an unguarded string concatenation. When the argument is an absolute URL, the two are glued together and the navigation span is named something like:
/hhttps://example.com/login
instead of /login. The navigation itself works correctly — only the span name is corrupted — so this shows up as junk entries in the transaction list and in dashboards, not as a user-facing failure.
Versions
@sentry/nextjs10.22.0; also present in11.0.0(latest at time of writing)next15.5.18, App Router,basePath: '/h'- Affects both navigation instrumentation modes (see below)
Root cause
build/cjs/client/routing/appRouterRoutingInstrumentation.js, in the transition-start-hook path:
const basePath = process.env._sentryBasePath ?? globalWithInjectedBasePath._sentryBasePath;
const normalizedHref = basePath && !href.startsWith(basePath) ? `${basePath}${href}` : href;
const unparameterizedPathname = new URL(normalizedHref, WINDOW.location.href).pathname;
With basePath = '/h' and href = 'https://example.com/login', href.startsWith('/h') is false, so the result is '/h' + 'https://example.com/login', and new URL(...).pathname faithfully returns /hhttps://example.com/login.
The same expression appears in the router-patch path, so both modes are affected.
Note the second-order effect: an href that already carries the base path — https://example.com/h/payments — is still concatenated, because as a string it starts with https, not /h.
Why Next.js itself is unaffected
Next's own addPathPrefix guards on the leading slash:
function addPathPrefix(path, prefix) {
if (!path.startsWith('/') || !prefix) {
return path;
}
...
}
So Next leaves absolute URLs alone, treats a same-origin absolute URL as an internal navigation, and routes correctly. Only the Sentry span name diverges from reality.
Reproduction
- Next.js App Router app with
basePath: '/h'and@sentry/nextjsclient instrumentation. - Call
router.push('https://<same-origin>/login')— or, more realistically, have a server component throwredirect('https://<same-origin>/login'). Next'sRedirectBoundarycatches it and callsrouter.push(url)internally, so this needs no unusual application code. - Observe the resulting
navigationtransaction name.
Expected: /login
Actual: /hhttps://<same-origin>/login
Absolute redirect targets are not exotic in a basePath app: Next's server redirect() runs the location through addPathPrefix, so an absolute URL is the documented way to send a user to a path outside the base path. Those same absolute URLs then reach the client router whenever the redirect is hit during a soft navigation.
We see seven distinct corrupted names in production across two apps over 90 days.
Suggested fix
Mirror Next's guard — only prefix root-relative paths:
-const normalizedHref = basePath && !href.startsWith(basePath) ? `${basePath}${href}` : href;
+const normalizedHref =
+ basePath && href.startsWith('/') && !href.startsWith(basePath) ? `${basePath}${href}` : href;
Both occurrences need it. The router-patch branch additionally guards typeof href === 'string' already, which the hook branch does not.
Investigated and written with Claude Code.
- Dominant language
- TypeScript
- Stars
- 8.7k
- Forks
- 1.9k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 576
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from getsentry/sentry-javascript
-
Flaky Test React Router Framework Spans Tests
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
getsentry/sentry-javascript#24348 · 1 comment ·
-
javascript
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
getsentry/sentry-javascript#24200 · 2 comments ·
-
javascript Task
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
getsentry/sentry-javascript#24134 · 1 comment ·
-
Cloudflare Workers javascript Tests
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
getsentry/sentry-javascript#24051 · 1 comment ·
-
Bug Bun javascript
Difficulty 2/5 1-3 hours Newbie friendliness 92/100
getsentry/sentry-javascript#24045 · 1 comment ·
All issues in getsentry/sentry-javascript
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
vercel-labs/just-bash#464 ·
-
looksLikeSlug() is ASCII-only, so non-Latin entity slugs (e.g. Korean) skip exact match and collapse Open
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
-
Difficulty 1/5 Under an hour Newbie friendliness 90/100
TanStack/tanstack.com#1293 ·