fix(nextjs): Use Proxies to wrap to preserve static methods (#7002)

Author: Luca Forstner

packages/nextjs/src/client/wrapAppGetInitialPropsWithSentry.ts

@@ -7,9 +7,11 @@ type AppGetInitialProps = typeof App['getInitialProps'];
  * so we are consistent with the serverside implementation.
  */
 export function wrapAppGetInitialPropsWithSentry(origAppGetInitialProps: AppGetInitialProps): AppGetInitialProps {
-  return async function (this: unknown, ...args: Parameters<AppGetInitialProps>): ReturnType<AppGetInitialProps> {
-    return await origAppGetInitialProps.apply(this, args);
-  };
+  return new Proxy(origAppGetInitialProps, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<AppGetInitialProps>) => {
+      return await wrappingTarget.apply(thisArg, args);
+    },
+  });
 }
 
 /**

packages/nextjs/src/client/wrapDocumentGetInitialPropsWithSentry.ts

@@ -9,12 +9,11 @@ type DocumentGetInitialProps = typeof Document.getInitialProps;
 export function wrapDocumentGetInitialPropsWithSentry(
   origDocumentGetInitialProps: DocumentGetInitialProps,
 ): DocumentGetInitialProps {
-  return async function (
-    this: unknown,
-    ...args: Parameters<DocumentGetInitialProps>
-  ): ReturnType<DocumentGetInitialProps> {
-    return await origDocumentGetInitialProps.apply(this, args);
-  };
+  return new Proxy(origDocumentGetInitialProps, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<DocumentGetInitialProps>) => {
+      return await wrappingTarget.apply(thisArg, args);
+    },
+  });
 }
 
 /**

packages/nextjs/src/client/wrapErrorGetInitialPropsWithSentry.ts

@@ -10,9 +10,11 @@ type ErrorGetInitialProps = (context: NextPageContext) => Promise<ErrorProps>;
 export function wrapErrorGetInitialPropsWithSentry(
   origErrorGetInitialProps: ErrorGetInitialProps,
 ): ErrorGetInitialProps {
-  return async function (this: unknown, ...args: Parameters<ErrorGetInitialProps>): ReturnType<ErrorGetInitialProps> {
-    return await origErrorGetInitialProps.apply(this, args);
-  };
+  return new Proxy(origErrorGetInitialProps, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<ErrorGetInitialProps>) => {
+      return await wrappingTarget.apply(thisArg, args);
+    },
+  });
 }
 
 /**

packages/nextjs/src/client/wrapGetInitialPropsWithSentry.ts

@@ -7,9 +7,11 @@ type GetInitialProps = Required<NextPage>['getInitialProps'];
  * so we are consistent with the serverside implementation.
  */
 export function wrapGetInitialPropsWithSentry(origGetInitialProps: GetInitialProps): GetInitialProps {
-  return async function (this: unknown, ...args: Parameters<GetInitialProps>): Promise<ReturnType<GetInitialProps>> {
-    return origGetInitialProps.apply(this, args);
-  };
+  return new Proxy(origGetInitialProps, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<GetInitialProps>) => {
+      return await wrappingTarget.apply(thisArg, args);
+    },
+  });
 }
 
 /**

packages/nextjs/src/edge/wrapApiHandlerWithSentry.ts

@@ -10,22 +10,24 @@ export function wrapApiHandlerWithSentry<H extends EdgeRouteHandler>(
   handler: H,
   parameterizedRoute: string,
 ): (...params: Parameters<H>) => Promise<ReturnType<H>> {
-  return async function (this: unknown, ...args: Parameters<H>): Promise<ReturnType<H>> {
-    const req = args[0];
+  return new Proxy(handler, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<H>) => {
+      const req = args[0];
 
-    const activeSpan = !!getCurrentHub().getScope()?.getSpan();
+      const activeSpan = !!getCurrentHub().getScope()?.getSpan();
 
-    const wrappedHandler = withEdgeWrapping(handler, {
-      spanDescription:
-        activeSpan || !(req instanceof Request)
-          ? `handler (${parameterizedRoute})`
-          : `${req.method} ${parameterizedRoute}`,
-      spanOp: activeSpan ? 'function' : 'http.server',
-      mechanismFunctionName: 'wrapApiHandlerWithSentry',
-    });
+      const wrappedHandler = withEdgeWrapping(wrappingTarget, {
+        spanDescription:
+          activeSpan || !(req instanceof Request)
+            ? `handler (${parameterizedRoute})`
+            : `${req.method} ${parameterizedRoute}`,
+        spanOp: activeSpan ? 'function' : 'http.server',
+        mechanismFunctionName: 'wrapApiHandlerWithSentry',
+      });
 
-    return await wrappedHandler.apply(this, args);
-  };
+      return await wrappedHandler.apply(thisArg, args);
+    },
+  });
 }
 
 /**

packages/nextjs/src/edge/wrapMiddlewareWithSentry.ts

@@ -10,9 +10,13 @@ import { withEdgeWrapping } from './utils/edgeWrapperUtils';
 export function wrapMiddlewareWithSentry<H extends EdgeRouteHandler>(
   middleware: H,
 ): (...params: Parameters<H>) => Promise<ReturnType<H>> {
-  return withEdgeWrapping(middleware, {
-    spanDescription: 'middleware',
-    spanOp: 'middleware.nextjs',
-    mechanismFunctionName: 'withSentryMiddleware',
+  return new Proxy(middleware, {
+    apply: async (wrappingTarget, thisArg, args: Parameters<H>) => {
+      return withEdgeWrapping(wrappingTarget, {
+        spanDescription: 'middleware',
+        spanOp: 'middleware.nextjs',
+        mechanismFunctionName: 'withSentryMiddleware',
+      }).apply(thisArg, args);
+    },
   });
 }