fix(tracing): ignore the fetch response if its request is not being tracked

Author: datbth

packages/tracing/src/browser/request.ts

@@ -141,8 +141,11 @@ export function fetchCallback(
     return;
   }
 
-  if (handlerData.endTimestamp && handlerData.fetchData.__span) {
-    const span = spans[handlerData.fetchData.__span];
+  if (handlerData.endTimestamp) {
+    const spanId = handlerData.fetchData.__span;
+    if (!spanId) return;
+
+    const span = spans[spanId];
     if (span) {
       if (handlerData.response) {
         // TODO (kmclb) remove this once types PR goes through
@@ -154,7 +157,7 @@ export function fetchCallback(
       span.finish();
 
       // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
-      delete spans[handlerData.fetchData.__span];
+      delete spans[spanId];
     }
     return;
   }

packages/tracing/test/browser/request.test.ts

@@ -174,6 +174,23 @@ describe('callbacks', () => {
       expect(newSpan!.status).toBe(spanStatusfromHttpCode(404));
     });
 
+    it('ignores response with no associated span', () => {
+      // the request might be missed somehow. E.g. if it was sent before tracing gets enabled.
+
+      const postRequestFetchHandlerData = {
+        ...fetchHandlerData,
+        endTimestamp,
+        response: { status: 404 } as Response,
+      };
+
+      // in that case, the response coming back will be ignored
+      fetchCallback(postRequestFetchHandlerData, alwaysCreateSpan, {});
+
+      const newSpan = transaction.spanRecorder?.spans[1];
+
+      expect(newSpan).toBeUndefined();
+    });
+
     it('adds sentry-trace header to fetch requests', () => {
       // TODO
     });