From 162fc988735e10e887bd47436fc268615122ac7c Mon Sep 17 00:00:00 2001
From: Abhijeet Prasad <aprasad@sentry.io>
Date: Fri, 26 Jan 2024 13:09:26 -0500
Subject: [PATCH] fix(tracing): Only create request span if there is active
 span

---
 .../tracing-internal/src/browser/request.ts   | 28 +++++++++++--------
 packages/tracing-internal/src/common/fetch.ts | 28 +++++++++++--------
 2 files changed, 32 insertions(+), 24 deletions(-)

diff --git a/packages/tracing-internal/src/browser/request.ts b/packages/tracing-internal/src/browser/request.ts
index d2600f02629e..331a5f7baae3 100644
--- a/packages/tracing-internal/src/browser/request.ts
+++ b/packages/tracing-internal/src/browser/request.ts
@@ -1,6 +1,7 @@
 /* eslint-disable max-lines */
 import {
   SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN,
+  getActiveSpan,
   getClient,
   getCurrentScope,
   getDynamicSamplingContextFromClient,
@@ -277,18 +278,21 @@ export function xhrCallback(
 
   const scope = getCurrentScope();
 
-  const span = shouldCreateSpanResult
-    ? startInactiveSpan({
-        attributes: {
-          type: 'xhr',
-          'http.method': sentryXhrData.method,
-          url: sentryXhrData.url,
-          [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.browser',
-        },
-        name: `${sentryXhrData.method} ${sentryXhrData.url}`,
-        op: 'http.client',
-      })
-    : undefined;
+  // only create a child span if there is an active span. This is because
+  // `startInactiveSpan` can still create a transaction under the hood
+  const span =
+    shouldCreateSpanResult && getActiveSpan()
+      ? startInactiveSpan({
+          attributes: {
+            type: 'xhr',
+            'http.method': sentryXhrData.method,
+            url: sentryXhrData.url,
+            [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.browser',
+          },
+          name: `${sentryXhrData.method} ${sentryXhrData.url}`,
+          op: 'http.client',
+        })
+      : undefined;
 
   if (span) {
     xhr.__sentry_xhr_span_id__ = span.spanContext().spanId;
diff --git a/packages/tracing-internal/src/common/fetch.ts b/packages/tracing-internal/src/common/fetch.ts
index 8f9da76488ad..004b44ddbe47 100644
--- a/packages/tracing-internal/src/common/fetch.ts
+++ b/packages/tracing-internal/src/common/fetch.ts
@@ -1,5 +1,6 @@
 import {
   SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN,
+  getActiveSpan,
   getClient,
   getCurrentScope,
   getDynamicSamplingContextFromClient,
@@ -80,18 +81,21 @@ export function instrumentFetchRequest(
 
   const { method, url } = handlerData.fetchData;
 
-  const span = shouldCreateSpanResult
-    ? startInactiveSpan({
-        attributes: {
-          url,
-          type: 'fetch',
-          'http.method': method,
-          [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: spanOrigin,
-        },
-        name: `${method} ${url}`,
-        op: 'http.client',
-      })
-    : undefined;
+  // only create a child span if there is an active span. This is because
+  // `startInactiveSpan` can still create a transaction under the hood
+  const span =
+    shouldCreateSpanResult && getActiveSpan()
+      ? startInactiveSpan({
+          attributes: {
+            url,
+            type: 'fetch',
+            'http.method': method,
+            [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: spanOrigin,
+          },
+          name: `${method} ${url}`,
+          op: 'http.client',
+        })
+      : undefined;
 
   if (span) {
     handlerData.fetchData.__span = span.spanContext().spanId;