Core Web Vitals aren't reported when enabling Tanstack Router integration

Is there an existing issue for this?

I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
I have reviewed the documentation https://docs.sentry.io/
I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/react

SDK Version

10.29.0

Framework Version

React 19.2.0

Link to Sentry event

No response

Reproduction Example/SDK Setup

Demo example: https://github.com/pmdartus/tanstack-sentry-integration-bug-repro/blob/52559b07ab47437e38eb9351eb2500ce2aa916c1/src/main.jsx#L45-L54

Sentry.init({
  dsn: "https://3fc2dae8dcedfae62a6df7e42540440b@o4510449154457600.ingest.de.sentry.io/4510449155965008",
  debug: true,
  sendDefaultPii: true,
  tracesSampleRate: 1.0,
  integrations: [
    Sentry.browserTracingIntegration(),
    Sentry.tanstackRouterBrowserTracingIntegration(router)
  ],
});

Steps to Reproduce

Download the repo and install the dependencies
Start the app by running: npm run dev

Expected Result

All the Core Web Vitals reported on Sentry in the trace, including LCP and CLS.

Actual Result

Only TTFB (and FCP in certain cases are reported) are reported.

Additional Context

Note: Web vitals are correctly reported when disabling the tanstack integration.

After turning on debug mode, it appears that on initial page load the tanstack integration always stop the pageload root span to create a new navigation span. Based on my understanding of how custom routing should be implemented the tanstack router integration should preserving the ongoing pageload span to enable the browser tracing integration to attach the webvitals metrics.

Priority

_{React with 👍 to help prioritize this issue. Please use comments to provide useful context, avoiding +1 or me too, to help us triage it.}

JS-1264

@pmdartus

Hi @pmdartus please try removing browserTracingIntegration and only registering tanstackRouterBrowserTracingIntegration . Let us know if this is still an issue afterwards.

Most likely, the two instrumentations just cancel each other out, because both start a pageload span.

@Lms24

Thanks for looking into this @Lms24.

It is still reproducible with tanstackRouterBrowserTracingIntegration only. I updated the sample repo as well. Digging deeper it appears that the following expression evaluates to false on the initial page load.

sentry-javascript/packages/react/src/tanstackrouter.ts

Lines 67 to 70 in c786fc5

    
           // onBeforeNavigate is called during pageloads. We can avoid creating navigation spans by comparing the states of the to and from arguments. 
        
           if (onBeforeNavigateArgs.toLocation.state === onBeforeNavigateArgs.fromLocation?.state) { 
        
             return; 
        
           }

Since the fromLocation is undefined, I think the condition should rather be:

if (!onBeforeNavigateArgs.fromLocation || onBeforeNavigateArgs.toLocation.state === onBeforeNavigateArgs.fromLocation.state) {

What do you think?

@pmdartus

Thanks @pmdartus for the investigation, you are correct. I confirmed the issue, looks like fromLocation can be undefined which would cause a partial of the metrics to be reported.

I'm creating a PR now to fix it. I just can't see to trigger it in a live test.

fix(tanstack-router): Check for `fromLocation` existence before repor…

A PR closing this issue has just been released 🚀

This issue was referenced by PR #18463, which was included in the 10.31.0 release.

Navigation Menu

Repository navigation

Core Web Vitals aren't reported when enabling Tanstack Router integration #18425

Is there an existing issue for this?

How do you use Sentry?

Which SDK are you using?

SDK Version

Framework Version

Link to Sentry event

Reproduction Example/SDK Setup

Steps to Reproduce

Expected Result

Actual Result

Additional Context

Priority

11 remaining items

A PR closing this issue has just been released 🚀

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

	// onBeforeNavigate is called during pageloads. We can avoid creating navigation spans by comparing the states of the to and from arguments.
	if (onBeforeNavigateArgs.toLocation.state === onBeforeNavigateArgs.fromLocation?.state) {
	return;
	}

Core Web Vitals aren't reported when enabling Tanstack Router integration #18425

Description

Is there an existing issue for this?

How do you use Sentry?

Which SDK are you using?

SDK Version

Framework Version

Link to Sentry event

Reproduction Example/SDK Setup

Steps to Reproduce

Expected Result

Actual Result

Additional Context

Priority

Activity

linear commented on Dec 9, 2025

Lms24 commented on Dec 9, 2025

11 remaining items

pmdartus commented on Dec 9, 2025

logaretm commented on Dec 10, 2025

github-actions commented on Dec 16, 2025

A PR closing this issue has just been released 🚀

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions