fix(tracing-internal): Prefer fetch init headers over fetch input headers (#10176)

When a `fetch` call is made with a `Request` object as the
input/resource param (i.e. the first) and additionally provided headers
in the fetch init options (the second param), browsers ignore the headers 
from the request object but only add the headers from the init options 
when making the request.

Our `fetch` instrumentation had it the other way around, preferring
headers from the request object over the headers in the options, as
reported in #10172 . This patch fixes this behaviour by essentially turning
around the logic we previously had.

Author: Lms24

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-request/init.js

@@ -0,0 +1,10 @@
+import * as Sentry from '@sentry/browser';
+import { Integrations } from '@sentry/tracing';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  integrations: [new Integrations.BrowserTracing({ tracingOrigins: ['http://example.com'] })],
+  tracesSampleRate: 1,
+});

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-request/subject.js

@@ -0,0 +1,7 @@
+const request = new Request('http://example.com/api/test/', {
+  headers: { foo: '11' },
+});
+
+fetch(request, {
+  headers: { bar: '22' },
+});

dev-packages/browser-integration-tests/suites/tracing/request/fetch-with-request/test.ts

@@ -0,0 +1,30 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { shouldSkipTracingTest } from '../../../../utils/helpers';
+
+sentryTest(
+  'instrumentation should pass on headers from fetch options instead of init request, if set',
+  async ({ getLocalTestPath, page }) => {
+    if (shouldSkipTracingTest()) {
+      sentryTest.skip();
+    }
+
+    await page.route('**/api/test/', async route => {
+      const req = route.request();
+      const headers = await req.allHeaders();
+
+      // headers.bar was set in fetch options (and should be sent)
+      expect(headers.bar).toBe('22');
+      // headers.foo was set in init request object (and should be ignored)
+      expect(headers.foo).toBeUndefined();
+
+      return route.fulfill({
+        status: 200,
+        body: 'ok',
+      });
+    });
+
+    await getLocalTestPath({ testDir: __dirname });
+  },
+);

packages/tracing-internal/src/common/fetch.ts

@@ -149,7 +149,8 @@ export function addTracingHeadersToFetchRequest(
   const sentryBaggageHeader = dynamicSamplingContextToSentryBaggageHeader(dynamicSamplingContext);
 
   const headers =
-    typeof Request !== 'undefined' && isInstanceOf(request, Request) ? (request as Request).headers : options.headers;
+    options.headers ||
+    (typeof Request !== 'undefined' && isInstanceOf(request, Request) ? (request as Request).headers : undefined);
 
   if (!headers) {
     return { 'sentry-trace': sentryTraceHeader, baggage: sentryBaggageHeader };