sentry-trace and baggage headers are not attached to XHR Requests

[JustDoItSascha]

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?

Self-hosted/on-premise

Which SDK are you using?

@sentry/angular

SDK Version

7.58.1

Framework Version

Angular 12.2.17

Link to Sentry event

No response

SDK Setup

Sentry.init({
  dsn: '...',
  integrations: [
    new Sentry.BrowserTracing({
      // Set `tracePropagationTargets` to control for which URLs distributed tracing should be enabled
      tracePropagationTargets: ['localhost', /^http/],
      routingInstrumentation: Sentry.routingInstrumentation,
    }),
  ],

  // Set tracesSampleRate to 1.0 to capture 100%
  // of transactions for performance monitoring.
  // We recommend adjusting this value in production
  tracesSampleRate: 1.0,
  tracePropagationTargets: ['localhost', /^http/],
});

Steps to Reproduce

I have an Angular 12 application where I added sentry. But the sentry-trace header is not attached to XHR Requests initiated by HttpClient. When I'm doing a fetch() manually, then the header is set.

Expected Result

I see the sentry-trace header in the request.

Actual Result

I don't the the header in the request.

[AbhiPrasad]

Hey @JustDoItSascha, you only need to define tracePropagationTargets in the top level config.

Re: this problem, did it work before? Or has this never worked?

But the sentry-trace header is not attached to XHR Requests initiated by HttpClient

How are you making the requests with HttpClient? I would recommend adding /^\/(?!\/)/ to your tracePropagationTargets, which should match requests going to your local domain.

[JustDoItSascha]

Like always: I inject HttpClient in the constructor and then this.httpClient.get('url') for example. I already tried other targets, but with /^http/ it should also match all requests. And it's working when I do a fetch(), but not HttpClient.get(). It never worked in this Project. Installed sentry freshly in this Project.

[AbhiPrasad]

@Lms24 have you ran into this before?

[JustDoItSascha]

I also disabled all Interceptors to be sure that there are no side effects. I'm not sure how Sentry adds the header to all XHR requests. If it's even possible that there are side effects...