@sentry/tracing BrowserTracing loses sentry-trace reference after navigation

[zanona]

• [x] Review the documentation: https://docs.sentry.io/
• [x] Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
• [x] Use the latest release: https://github.com/getsentry/sentry-javascript/releases
• [ ] Provide a link to the affected event from your Sentry account

Package + Version

• [ ] @sentry/browser
• [ ] @sentry/node
• [ ] raven-js
• [ ] raven-node (raven for node)
• [x] other: @sentry/tracing

Version:

6.2.2

Description

Whenever having a html page rendered with <meta name='sentry-trace' content='traceparent'/> and using the BrowserTracing integration. The first 'load' event is the only one to keep the reference to the traceparent added to the document meta tag but all the other navigation events will lose traceparent reference and create a new traceId for every transaction, disconnecting user activity.

import { Integrations } from "@sentry/tracing";

Sentry.init({
    dsn: process.env.SENTRY_DSN,
    environment,
    integrations: [
        new Integrations.BrowserTracing({
            beforeNavigate: (ctx) => ({
                                /**
                                * first event has ctx.traceId,
                                * upon navigation it loses reference
                                * and assigns a new traceId per event
                                * */
                ...ctx,
                name: findRoute(location.pathname),
            }),
        }),
    ],
});

Possible solution

I need to manually get the traceparent data from the head and inject into the context, so it's kept across events.

import { Integrations, extractTraceparentData } from "@sentry/tracing";
const traceparent = document.head.querySelector('meta[name="sentry-trace"]')?.content || "";

Sentry.init({
    dsn: process.env.SENTRY_DSN,
    environment,
    integrations: [
        new Integrations.BrowserTracing({
            beforeNavigate: (ctx) => ({
                ...ctx,
                                // This will make sure traceId persists across events
                ...extractTraceparentData(traceparent),
                name: findRoute(location.pathname),
            }),
        }),
    ],
});

[AbhiPrasad]

This is expected behaviour, each new navigation should have it's own trace. A trace is meant to cross services (for ex. frontend -> web server -> database), and not across user activities. We recognize that this has limitations though, and are working toward establishing a pattern to better address your use case.

[github-actions[bot]]

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!

---

"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀