Skip to content

Conversation

Lms24
Copy link
Member

@Lms24 Lms24 commented Sep 2, 2025

This PR adds support for a new browser SDK init option, propagateTraceparent, as spec'd out in our develop docs

If users opt into propagateTraceparent, browser SDKs will attach a W3C compliant traceparent header to outgoing fetch and XHR requests, in addition to sentry-trace and baggage headers.

A couple of implementation remarks:

  • The unfortunate part of limiting this functionality to browser only is that we have to pass down a flag to the trace data generation and fetch instrumentation functions living in @sentry/core.
  • This also required me to refactor our instrumentFetchRequest function in core because it already took an optional param. Nothing major though in terms of breakage but this is a publicly exported function, so we can't just simply break the signature.
  • I decided to keep things really simple when generating the traceparent header by converting the sentry-trace header to traceparent. This looks weird on first glance but the reason is that generateSentryTraceHeader returns a random uuid if we're in TwP mode. If we were to generate a traceparent header from the same data set, we'd also have to create a random uuid, meaning we'd end up with sentry-trace and traceparent headers on the same request with different (non-existing) parentSpanIds. If we just take the finished header, and morph it into the other header we can avoid this entirely.
  • Added tests for all kinds of tracing configs, tracePropagationTargets, etc

closes #17482

cursor[bot]

This comment was marked as outdated.

cursor[bot]

This comment was marked as outdated.

Copy link
Contributor

github-actions bot commented Sep 2, 2025

size-limit report 📦

Path Size % Change Change
@sentry/browser 24.16 kB - -
@sentry/browser - with treeshaking flags 22.73 kB - -
@sentry/browser (incl. Tracing) 40.13 kB +0.65% +258 B 🔺
@sentry/browser (incl. Tracing, Replay) 78.46 kB +0.3% +230 B 🔺
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags 68.24 kB +0.33% +218 B 🔺
@sentry/browser (incl. Tracing, Replay with Canvas) 83.15 kB +0.29% +240 B 🔺
@sentry/browser (incl. Tracing, Replay, Feedback) 95.36 kB +0.27% +256 B 🔺
@sentry/browser (incl. Feedback) 40.89 kB - -
@sentry/browser (incl. sendFeedback) 28.81 kB - -
@sentry/browser (incl. FeedbackAsync) 33.75 kB - -
@sentry/react 25.88 kB +0.01% +1 B 🔺
@sentry/react (incl. Tracing) 42.1 kB +0.5% +207 B 🔺
@sentry/vue 28.64 kB - -
@sentry/vue (incl. Tracing) 41.93 kB +0.57% +237 B 🔺
@sentry/svelte 24.18 kB - -
CDN Bundle 25.74 kB +0.31% +79 B 🔺
CDN Bundle (incl. Tracing) 39.98 kB +0.59% +233 B 🔺
CDN Bundle (incl. Tracing, Replay) 76.27 kB +0.31% +234 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback) 81.73 kB +0.28% +225 B 🔺
CDN Bundle - uncompressed 75.16 kB +0.27% +199 B 🔺
CDN Bundle (incl. Tracing) - uncompressed 118.26 kB +0.57% +669 B 🔺
CDN Bundle (incl. Tracing, Replay) - uncompressed 233.35 kB +0.29% +668 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed 246.12 kB +0.28% +668 B 🔺
@sentry/nextjs (client) 44.12 kB +0.52% +227 B 🔺
@sentry/sveltekit (client) 40.57 kB +0.6% +241 B 🔺
@sentry/node-core 49.69 kB +0.15% +73 B 🔺
@sentry/node 150.34 kB +0.05% +73 B 🔺
@sentry/node - without tracing 92.26 kB +0.09% +76 B 🔺
@sentry/aws-serverless 105.56 kB +0.09% +85 B 🔺

View base workflow run

Copy link
Contributor

github-actions bot commented Sep 2, 2025

node-overhead report 🧳

Note: This is a synthetic benchmark with a minimal express app and does not necessarily reflect the real-world performance impact in an application.

Scenario Requests/s % of Baseline Prev. Requests/s Change %
GET Baseline 8,898 - 8,687 +2%
GET With Sentry 1,223 14% 1,275 -4%
GET With Sentry (error only) 6,068 68% 5,998 +1%
POST Baseline 1,198 - 1,142 +5%
POST With Sentry 539 45% 496 +9%
POST With Sentry (error only) 1,051 88% 984 +7%
MYSQL Baseline 3,345 - 3,247 +3%
MYSQL With Sentry 427 13% 435 -2%
MYSQL With Sentry (error only) 2,751 82% 2,648 +4%

View base workflow run

@Lms24 Lms24 changed the title feat(browser): Add suppot for propagateTraceparent SDK option feat(browser): Add support for propagateTraceparent SDK option Sep 2, 2025
cursor[bot]

This comment was marked as outdated.

Copy link
Member

@markushi markushi left a comment

Choose a reason for hiding this comment

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

LGTM!

): void {
const originalHeaders = xhr.__sentry_xhr_v3__?.request_headers;

if (originalHeaders?.['sentry-trace']) {
if (originalHeaders?.['sentry-trace'] || !xhr.setRequestHeader) {
// bail if a sentry-trace header is already set
Copy link
Member

Choose a reason for hiding this comment

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

👀 we don't have this logic in sentry-java, but I'll add it too. There's an edge case: if the request has a sentry-trace header, but lacks baggage/traceparent header, we won't add baggage/traceparent here. But I think that's fine, otherwise you could end up in situations where the header values don't match up.

Copy link
Member Author

@Lms24 Lms24 Sep 4, 2025

Choose a reason for hiding this comment

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

if the request has a sentry-trace header, but lacks baggage/traceparent header, we won't add baggage/traceparent here

yes correct and I agree that this is fine. sentry-trace is still the minimum required header for our trace propagation to work according to our DSC dev spec. (Server) SDKs have to handle incoming requests where only sentry-trace is sent. This was primarily required for backwards compatibility but I think this case is another valid (though very edge-casey) reason to do so. So I think this should be safe.

My rationale here is: If users really attach their custom tracing headers (already unlikely but it happened), it's on them to do it properly. We export functions like Sentry.getTraceData() to make this as easy as possible. Everything we do in the SDK would be a "best guess" effort and likely leads to unexpected results.

Copy link
Member

@chargome chargome left a comment

Choose a reason for hiding this comment

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

lgtm!

@@ -20,6 +20,9 @@ export const TRACEPARENT_REGEXP = new RegExp(
/**
* Extract transaction context data from a `sentry-trace` header.
*
* This is terrible naming but the function has nothing to do with the W3C traceparent header.
Copy link
Member

Choose a reason for hiding this comment

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

🥲

@Lms24 Lms24 merged commit 3c048c3 into develop Sep 4, 2025
890 of 913 checks passed
@Lms24 Lms24 deleted the lms/feat-browser-propagateTraceparent branch September 4, 2025 11:22
Lms24 added a commit to getsentry/sentry-docs that referenced this pull request Sep 9, 2025
<!-- Use this checklist to make sure your PR is ready for merge. You may
delete any sections you don't need. -->

## DESCRIBE YOUR PR

To be merged after
getsentry/sentry-javascript#17509 was released

This PR adds documentation for the new, browser-SDK-only,
`propagateTraceparent` option (see [develop
docs](https://develop.sentry.dev/sdk/telemetry/traces/#propagatetraceparent)).
It also adjusts our "Dealing with CORS Issues" page to include
`traceparent` in the `CORS` configuration if users opted into the
option.

## IS YOUR CHANGE URGENT?  

Help us prioritize incoming PRs by letting us know when the change needs
to go live.
- [ ] Urgent deadline (GA date, etc.): <!-- ENTER DATE HERE -->
- [ ] Other deadline: <!-- ENTER DATE HERE -->
- [x] None: Not urgent, can wait up to 1 week+

## SLA

- Teamwork makes the dream work, so please add a reviewer to your PRs.
- Please give the docs team up to 1 week to review your PR unless you've
added an urgent due date to it.
Thanks in advance for your help!

## PRE-MERGE CHECKLIST

*Make sure you've checked the following before merging your changes:*

- [x] Checked Vercel preview for correctness, including links
- [ ] PR was reviewed and approved by any necessary SMEs (subject matter
experts)
- [ ] PR was reviewed and approved by a member of the [Sentry docs
team](https://github.com/orgs/getsentry/teams/docs)

## LEGAL BOILERPLATE

<!-- Sentry employees and contractors can delete or ignore this section.
-->

Look, I get it. The entity doing business as "Sentry" was incorporated
in the State of Delaware in 2015 as Functional Software, Inc. and is
gonna need some rights from me in order to utilize my contributions in
this here PR. So here's the deal: I retain all rights, title and
interest in and to my contributions, and by keeping this boilerplate
intact I confirm that Sentry can use, modify, copy, and redistribute my
contributions, under Sentry's choice of terms.

## EXTRA RESOURCES

- [Sentry Docs contributor guide](https://docs.sentry.io/contributing/)
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.

Add traceparent header support for Browser SDKs
3 participants