improve span code & test??

Author: mydea

packages/nextjs/src/common/utils/wrapperUtils.ts

@@ -35,8 +35,8 @@ export function getSpanFromRequest(req: IncomingMessage): Span | undefined {
   return req._sentrySpan;
 }
 
-function setSpanOnRequest(transaction: Span, req: IncomingMessage): void {
-  req._sentrySpan = transaction;
+function setSpanOnRequest(span: Span, req: IncomingMessage): void {
+  req._sentrySpan = span;
 }
 
 /**
@@ -99,25 +99,9 @@ export function withTracedServerSideDataFetcher<F extends (...args: any[]) => Pr
       const baggage = req.headers?.baggage;
 
       return continueTrace({ sentryTrace, baggage }, () => {
-        let requestSpan: Span | undefined = getSpanFromRequest(req);
-        if (!requestSpan) {
-          // TODO(v8): Simplify these checks when startInactiveSpan always returns a span
-          requestSpan = startInactiveSpan({
-            name: options.requestedRouteName,
-            op: 'http.server',
-            attributes: {
-              [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.function.nextjs',
-              [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'route',
-            },
-          });
-          if (requestSpan) {
-            requestSpan.setStatus({ code: SPAN_STATUS_OK });
-            setSpanOnRequest(requestSpan, req);
-            autoEndSpanOnResponseEnd(requestSpan, res);
-          }
-        }
+        const requestSpan = getOrStartRequestSpan(req, res, options.requestedRouteName);
 
-        const withActiveSpanCallback = (): Promise<ReturnType<F>> => {
+        return withActiveSpan(requestSpan, () => {
           return startSpanManual(
             {
               op: 'function.nextjs',
@@ -143,18 +127,34 @@ export function withTracedServerSideDataFetcher<F extends (...args: any[]) => Pr
               }
             },
           );
-        };
-
-        if (requestSpan) {
-          return withActiveSpan(requestSpan, withActiveSpanCallback);
-        } else {
-          return withActiveSpanCallback();
-        }
+        });
       });
     });
   };
 }
 
+function getOrStartRequestSpan(req: IncomingMessage, res: ServerResponse, name: string): Span {
+  const existingSpan = getSpanFromRequest(req);
+  if (existingSpan) {
+    return existingSpan;
+  }
+
+  const requestSpan = startInactiveSpan({
+    name,
+    op: 'http.server',
+    attributes: {
+      [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.function.nextjs',
+      [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'route',
+    },
+  });
+
+  requestSpan.setStatus({ code: SPAN_STATUS_OK });
+  setSpanOnRequest(requestSpan, req);
+  autoEndSpanOnResponseEnd(requestSpan, res);
+
+  return requestSpan;
+}
+
 /**
  * Call a data fetcher and trace it. Only traces the function if there is an active transaction on the scope.
  *

packages/nextjs/test/integration/test/client/tracingClientGetInitialProps.test.ts

@@ -1,9 +1,9 @@
 import { expect, test } from '@playwright/test';
-import { Transaction } from '@sentry/types';
+import { TransactionEvent } from '@sentry/types';
 import { countEnvelopes, getMultipleSentryEnvelopeRequests } from './utils/helpers';
 
 test('should instrument `getInitialProps` for performance tracing', async ({ page }) => {
-  const transaction = await getMultipleSentryEnvelopeRequests<Transaction>(page, 1, {
+  const transaction = await getMultipleSentryEnvelopeRequests<TransactionEvent>(page, 1, {
     url: '/42/withInitialProps',
     envelopeType: 'transaction',
   });
@@ -19,8 +19,7 @@ test('should instrument `getInitialProps` for performance tracing', async ({ pag
   const nextDataTag = await page.waitForSelector('#__NEXT_DATA__', { state: 'attached' });
   const nextDataTagValue = JSON.parse(await nextDataTag.evaluate(tag => (tag as HTMLElement).innerText));
 
-  // @ts-expect-error - We know `contexts` is defined in the Transaction envelope
-  const traceId = transaction[0].contexts.trace.trace_id;
+  const traceId = transaction[0].contexts?.trace?.trace_id;
 
   expect(traceId).toBeDefined();