fix(nextjs): Add tracing extensions in all serverside wrappers (#9537)

Author: Luca Forstner

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

@@ -1,4 +1,4 @@
-import { captureException, flush, getCurrentHub, startTransaction } from '@sentry/core';
+import { addTracingExtensions, captureException, flush, getCurrentHub, startTransaction } from '@sentry/core';
 import type { Span } from '@sentry/types';
 import { addExceptionMechanism, logger, objectify, tracingContextFromHeaders } from '@sentry/utils';
 
@@ -12,6 +12,8 @@ export function withEdgeWrapping<H extends EdgeRouteHandler>(
   options: { spanDescription: string; spanOp: string; mechanismFunctionName: string },
 ): (...params: Parameters<H>) => Promise<ReturnType<H>> {
   return async function (this: unknown, ...args) {
+    addTracingExtensions();
+
     const req = args[0];
     const currentScope = getCurrentHub().getScope();
     const prevSpan = currentScope.getSpan();

packages/nextjs/src/common/wrapApiHandlerWithSentry.ts

@@ -1,4 +1,10 @@
-import { captureException, getCurrentHub, runWithAsyncContext, startTransaction } from '@sentry/core';
+import {
+  addTracingExtensions,
+  captureException,
+  getCurrentHub,
+  runWithAsyncContext,
+  startTransaction,
+} from '@sentry/core';
 import type { Transaction } from '@sentry/types';
 import {
   addExceptionMechanism,
@@ -74,6 +80,8 @@ export function withSentry(apiHandler: NextApiHandler, parameterizedRoute?: stri
       }
       req.__withSentry_applied__ = true;
 
+      addTracingExtensions();
+
       // eslint-disable-next-line complexity, @typescript-eslint/no-explicit-any
       const boundHandler = runWithAsyncContext(
         // eslint-disable-next-line complexity

packages/nextjs/src/common/wrapApiHandlerWithSentryVercelCrons.ts

@@ -1,4 +1,4 @@
-import { captureCheckIn, runWithAsyncContext } from '@sentry/core';
+import { addTracingExtensions, captureCheckIn, runWithAsyncContext } from '@sentry/core';
 import type { NextApiRequest } from 'next';
 
 import type { VercelCronsConfig } from './types';
@@ -24,6 +24,7 @@ export function wrapApiHandlerWithSentryVercelCrons<F extends (...args: any[]) =
           return originalFunction.apply(thisArg, args);
         }
 
+        addTracingExtensions();
         const [req] = args as [NextApiRequest | EdgeRequest];
 
         let maybePromiseResult;

packages/nextjs/src/common/wrapAppGetInitialPropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import { dynamicSamplingContextToSentryBaggageHeader } from '@sentry/utils';
 import type App from 'next/app';
 
@@ -26,6 +26,8 @@ export function wrapAppGetInitialPropsWithSentry(origAppGetInitialProps: AppGetI
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const [context] = args;
       const { req, res } = context.ctx;
 

packages/nextjs/src/common/wrapDocumentGetInitialPropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import type Document from 'next/document';
 
 import { isBuild } from './utils/isBuild';
@@ -23,6 +23,8 @@ export function wrapDocumentGetInitialPropsWithSentry(
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const [context] = args;
       const { req, res } = context;
 

packages/nextjs/src/common/wrapErrorGetInitialPropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import { dynamicSamplingContextToSentryBaggageHeader } from '@sentry/utils';
 import type { NextPageContext } from 'next';
 import type { ErrorProps } from 'next/error';
@@ -29,6 +29,8 @@ export function wrapErrorGetInitialPropsWithSentry(
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const [context] = args;
       const { req, res } = context;
 

packages/nextjs/src/common/wrapGetInitialPropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import { dynamicSamplingContextToSentryBaggageHeader } from '@sentry/utils';
 import type { NextPage } from 'next';
 
@@ -25,6 +25,8 @@ export function wrapGetInitialPropsWithSentry(origGetInitialProps: GetInitialPro
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const [context] = args;
       const { req, res } = context;
 

packages/nextjs/src/common/wrapGetServerSidePropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import { dynamicSamplingContextToSentryBaggageHeader } from '@sentry/utils';
 import type { GetServerSideProps } from 'next';
 
@@ -26,6 +26,8 @@ export function wrapGetServerSidePropsWithSentry(
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const [context] = args;
       const { req, res } = context;
 

packages/nextjs/src/common/wrapGetStaticPropsWithSentry.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/core';
+import { addTracingExtensions, getCurrentHub } from '@sentry/core';
 import type { GetStaticProps } from 'next';
 
 import { isBuild } from './utils/isBuild';
@@ -23,6 +23,8 @@ export function wrapGetStaticPropsWithSentry(
         return wrappingTarget.apply(thisArg, args);
       }
 
+      addTracingExtensions();
+
       const errorWrappedGetStaticProps = withErrorInstrumentation(wrappingTarget);
       const options = getCurrentHub().getClient()?.getOptions();
 

packages/nextjs/src/common/wrapPageComponentWithSentry.ts

@@ -1,4 +1,4 @@
-import { captureException, configureScope, runWithAsyncContext } from '@sentry/core';
+import { addTracingExtensions, captureException, configureScope, runWithAsyncContext } from '@sentry/core';
 import { addExceptionMechanism, extractTraceparentData } from '@sentry/utils';
 
 interface FunctionComponent {
@@ -21,6 +21,7 @@ function isReactClassComponent(target: unknown): target is ClassComponent {
  * Wraps a page component with Sentry error instrumentation.
  */
 export function wrapPageComponentWithSentry(pageComponent: FunctionComponent | ClassComponent): unknown {
+  addTracingExtensions();
   if (isReactClassComponent(pageComponent)) {
     return class SentryWrappedPageComponent extends pageComponent {
       public render(...args: unknown[]): unknown {

packages/nextjs/src/common/wrapRouteHandlerWithSentry.ts

@@ -1,4 +1,4 @@
-import { captureException, flush, getCurrentHub, runWithAsyncContext, trace } from '@sentry/core';
+import { addTracingExtensions, captureException, flush, getCurrentHub, runWithAsyncContext, trace } from '@sentry/core';
 import { addExceptionMechanism, tracingContextFromHeaders } from '@sentry/utils';
 
 import { isRedirectNavigationError } from './nextNavigationErrorUtils';
@@ -13,8 +13,8 @@ export function wrapRouteHandlerWithSentry<F extends (...args: any[]) => any>(
   routeHandler: F,
   context: RouteHandlerContext,
 ): (...args: Parameters<F>) => ReturnType<F> extends Promise<unknown> ? ReturnType<F> : Promise<ReturnType<F>> {
+  addTracingExtensions();
   const { method, parameterizedRoute, baggageHeader, sentryTraceHeader } = context;
-
   return new Proxy(routeHandler, {
     apply: (originalFunction, thisArg, args) => {
       return runWithAsyncContext(async () => {

packages/nextjs/src/common/wrapServerComponentWithSentry.ts

@@ -1,4 +1,11 @@
-import { captureException, flush, getCurrentHub, runWithAsyncContext, startTransaction } from '@sentry/core';
+import {
+  addTracingExtensions,
+  captureException,
+  flush,
+  getCurrentHub,
+  runWithAsyncContext,
+  startTransaction,
+} from '@sentry/core';
 import { addExceptionMechanism, tracingContextFromHeaders } from '@sentry/utils';
 
 import { isNotFoundNavigationError, isRedirectNavigationError } from '../common/nextNavigationErrorUtils';
@@ -12,6 +19,7 @@ export function wrapServerComponentWithSentry<F extends (...args: any[]) => any>
   appDirComponent: F,
   context: ServerComponentContext,
 ): F {
+  addTracingExtensions();
   const { componentRoute, componentType } = context;
 
   // Even though users may define server components as async functions, for the client bundles