fix(react-router): Don't patch when loaded via require(esm)

Author: timfish

packages/react-router/src/server/instrumentation/reactRouter.ts

@@ -37,11 +37,11 @@ export class ReactRouterInstrumentation extends InstrumentationBase<Instrumentat
       COMPONENT,
       supportedVersions,
       (moduleExports: ReactRouterModuleExports) => {
-        return this._createPatchedModuleProxy(moduleExports);
-      },
-      (_moduleExports: unknown) => {
-        // nothing to unwrap here
-        return _moduleExports;
+        try {
+          return this._createPatchedModuleProxy(moduleExports);
+        } catch (_) {
+          return moduleExports;
+        }
       },
     );
 
@@ -53,59 +53,54 @@ export class ReactRouterInstrumentation extends InstrumentationBase<Instrumentat
    * This allows us to wrap the request handler to add performance monitoring for data loaders and actions.
    */
   private _createPatchedModuleProxy(moduleExports: ReactRouterModuleExports): ReactRouterModuleExports {
-    return new Proxy(moduleExports, {
-      get(target, prop, receiver) {
-        if (prop === 'createRequestHandler') {
-          const original = target[prop];
-          return function sentryWrappedCreateRequestHandler(this: unknown, ...args: unknown[]) {
-            const originalRequestHandler = original.apply(this, args);
+    const original = moduleExports.createRequestHandler;
+    moduleExports.createRequestHandler = function (this: unknown, ...args: unknown[]) {
+      const originalRequestHandler = original.apply(this, args);
+
+      return async function sentryWrappedRequestHandler(request: Request, initialContext?: unknown) {
+        let url: URL;
+        try {
+          url = new URL(request.url);
+        } catch (error) {
+          return originalRequestHandler(request, initialContext);
+        }
 
-            return async function sentryWrappedRequestHandler(request: Request, initialContext?: unknown) {
-              let url: URL;
-              try {
-                url = new URL(request.url);
-              } catch (error) {
-                return originalRequestHandler(request, initialContext);
-              }
+        // We currently just want to trace loaders and actions
+        if (!isDataRequest(url.pathname)) {
+          return originalRequestHandler(request, initialContext);
+        }
 
-              // We currently just want to trace loaders and actions
-              if (!isDataRequest(url.pathname)) {
-                return originalRequestHandler(request, initialContext);
-              }
+        const activeSpan = getActiveSpan();
+        const rootSpan = activeSpan && getRootSpan(activeSpan);
 
-              const activeSpan = getActiveSpan();
-              const rootSpan = activeSpan && getRootSpan(activeSpan);
+        if (!rootSpan) {
+          DEBUG_BUILD && logger.debug('No active root span found, skipping tracing for data request');
+          return originalRequestHandler(request, initialContext);
+        }
 
-              if (!rootSpan) {
-                DEBUG_BUILD && logger.debug('No active root span found, skipping tracing for data request');
-                return originalRequestHandler(request, initialContext);
-              }
+        // Set the source and overwrite attributes on the root span to ensure the transaction name
+        // is derived from the raw URL pathname rather than any parameterized route that may be set later
+        // TODO: try to set derived parameterized route from build here (args[0])
+        rootSpan.setAttributes({
+          [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'url',
+          [SEMANTIC_ATTRIBUTE_SENTRY_OVERWRITE]: `${request.method} ${url.pathname}`,
+        });
 
-              // Set the source and overwrite attributes on the root span to ensure the transaction name
-              // is derived from the raw URL pathname rather than any parameterized route that may be set later
-              // TODO: try to set derived parameterized route from build here (args[0])
-              rootSpan.setAttributes({
-                [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'url',
-                [SEMANTIC_ATTRIBUTE_SENTRY_OVERWRITE]: `${request.method} ${url.pathname}`,
-              });
+        return startSpan(
+          {
+            name: getSpanName(url.pathname, request.method),
+            attributes: {
+              [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.react-router',
+              [SEMANTIC_ATTRIBUTE_SENTRY_OP]: getOpName(url.pathname, request.method),
+            },
+          },
+          () => {
+            return originalRequestHandler(request, initialContext);
+          },
+        );
+      };
+    };
 
-              return startSpan(
-                {
-                  name: getSpanName(url.pathname, request.method),
-                  attributes: {
-                    [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.react-router',
-                    [SEMANTIC_ATTRIBUTE_SENTRY_OP]: getOpName(url.pathname, request.method),
-                  },
-                },
-                () => {
-                  return originalRequestHandler(request, initialContext);
-                },
-              );
-            };
-          };
-        }
-        return Reflect.get(target, prop, receiver);
-      },
-    });
+    return moduleExports;
   }
 }