@sentry/react 11.0.0-beta.1 → 11.0.0-rc.0

package/build/esm/reactrouter-compat-utils/instrumentation.js

@@ -1,23 +1,17 @@
 import { WINDOW, browserTracingIntegration, startBrowserTracingPageLoadSpan, startBrowserTracingNavigationSpan } from '@sentry/browser';
-import { PAGELOAD_SPAN_NAME_FALLBACK, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN, hasSpanStreamingEnabled, debug, addNonEnumerableProperty, spanToJSON, getCurrentScope, getClient, NAVIGATION_SPAN_NAME_FALLBACK } from '@sentry/core';
+import { extendIntegration, PAGELOAD_SPAN_NAME_FALLBACK, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN, hasSpanStreamingEnabled, debug, getClient, addNonEnumerableProperty, spanToJSON, getCurrentScope, NAVIGATION_SPAN_NAME_FALLBACK } from '@sentry/core';
 import * as React from 'react';
 import { DEBUG_BUILD } from '../debug-build.js';
 import { hoistNonReactStatics } from '../hoist-non-react-statics.js';
 import { checkRouteForAsyncHandler } from './lazy-routes.js';
-import { getActiveRootSpan, setNavigationContext, clearNavigationContext, resolveRouteNameAndSource, transactionNameHasWildcard, initializeRouterUtils } from './utils.js';
+import { getActiveRootSpan, setNavigationContext, clearNavigationContext, resolveRouteNameAndSource, transactionNameHasWildcard } from './utils.js';
 import { SENTRY_OP, SENTRY_SEGMENT_NAME_SOURCE, URL_TEMPLATE } from '@sentry/conventions/attributes';
 import { PAGELOAD, NAVIGATION } from '@sentry/conventions/op';
 
-let _useEffect;
-let _useLocation;
-let _useNavigationType;
-let _createRoutesFromChildren;
-let _matchRoutes;
-let _enableAsyncRouteHandlers = false;
-let _lazyRouteTimeout = 3e3;
-let _lazyRouteManifest;
-let _basename = "";
-const CLIENTS_WITH_INSTRUMENT_NAVIGATION = /* @__PURE__ */ new WeakSet();
+const reactRouterConfigByClient = /* @__PURE__ */ new WeakMap();
+function getRouterConfig(client) {
+  return client ? reactRouterConfigByClient.get(client) : void 0;
+}
 const useIsomorphicLayoutEffect = WINDOW?.document ? React.useLayoutEffect : React.useEffect;
 const activeNavigationSpans = /* @__PURE__ */ new WeakMap();
 const allRoutes = /* @__PURE__ */ new Set();
@@ -101,11 +95,11 @@ function resolveDeferredLazyRoutePromise(span) {
     }
   }
 }
-function processResolvedRoutes(resolvedRoutes, parentRoute, currentLocation = null, capturedSpan) {
+function processResolvedRoutes(resolvedRoutes, config, parentRoute, currentLocation = null, capturedSpan) {
   resolvedRoutes.forEach((child) => {
     allRoutes.add(child);
-    if (_enableAsyncRouteHandlers) {
-      checkRouteForAsyncHandler(child, processResolvedRoutes);
+    if (config.enableAsyncRouteHandlers) {
+      checkRouteForAsyncHandler(child, (r, p, l, s) => processResolvedRoutes(r, config, p, l, s));
     }
   });
   if (parentRoute) {
@@ -134,29 +128,35 @@ function processResolvedRoutes(resolvedRoutes, parentRoute, currentLocation = nu
           activeRootSpan: targetSpan,
           location: { pathname: location.pathname },
           routes: Array.from(allRoutes),
-          allRoutes: Array.from(allRoutes)
+          allRoutes: Array.from(allRoutes),
+          config
         });
       } else if (spanOp === "navigation") {
-        updateNavigationSpan(targetSpan, location, Array.from(allRoutes), false, _matchRoutes);
+        updateNavigationSpan(targetSpan, location, Array.from(allRoutes), false, config);
       }
     }
   }
 }
-function updateNavigationSpan(activeRootSpan, location, allRoutes2, forceUpdate = false, matchRoutes) {
+function updateNavigationSpan(activeRootSpan, location, allRoutes2, forceUpdate = false, config) {
   const { name: currentName, end_timestamp, attributes } = spanToJSON(activeRootSpan);
+  const spanPathname = activeRootSpan?.__sentry_navigation_pathname__;
+  if (spanPathname !== void 0 && spanPathname !== location.pathname) {
+    DEBUG_BUILD && debug.log(
+      `[React Router] Not renaming the navigation span for "${spanPathname}" with the route of "${location.pathname}"`
+    );
+    return;
+  }
   const hasBeenNamed = activeRootSpan?.__sentry_navigation_name_set__;
   const currentNameHasWildcard = currentName && transactionNameHasWildcard(currentName);
   const shouldUpdate = !hasBeenNamed || forceUpdate || currentNameHasWildcard;
   if (shouldUpdate && !end_timestamp) {
-    const currentBranches = matchRoutes(allRoutes2, location);
+    const currentBranches = config.matchRoutes(allRoutes2, location);
     const [name, source] = resolveRouteNameAndSource(
       location,
       allRoutes2,
       allRoutes2,
       currentBranches || [],
-      _basename,
-      _lazyRouteManifest,
-      _enableAsyncRouteHandlers
+      config
     );
     const currentSource = attributes[SENTRY_SEGMENT_NAME_SOURCE];
     const isImprovement = name && (!currentName || // No current name - always set
@@ -177,7 +177,7 @@ function updateNavigationSpan(activeRootSpan, location, allRoutes2, forceUpdate
     }
   }
 }
-function setupRouterSubscription(router, routes, version, basename, activeRootSpan) {
+function setupRouterSubscription(router, routes, version, activeRootSpan, config) {
   let isInitialPageloadComplete = false;
   let hasSeenPageloadSpan = !!activeRootSpan && spanToJSON(activeRootSpan).attributes[SENTRY_OP] === "pageload";
   let hasSeenPopAfterPageload = false;
@@ -211,8 +211,8 @@ function setupRouterSubscription(router, routes, version, basename, activeRootSp
           routes,
           navigationType: state.historyAction,
           version,
-          basename,
-          allRoutes: Array.from(allRoutes)
+          allRoutes: Array.from(allRoutes),
+          config
         });
       };
       if (state.navigation.state !== "idle") {
@@ -234,17 +234,19 @@ function setupRouterSubscription(router, routes, version, basename, activeRootSp
   });
 }
 function createV6CompatibleWrapCreateBrowserRouter(createRouterFunction, version) {
-  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes) {
-    DEBUG_BUILD && debug.warn(
-      `reactRouter${version ? `V${version}` : ""}Instrumentation was unable to wrap the \`createRouter\` function because of one or more missing parameters.`
-    );
-    return createRouterFunction;
-  }
   return function(routes, opts) {
+    const base = getRouterConfig(getClient());
+    if (!base) {
+      DEBUG_BUILD && debug.warn(
+        `reactRouter${version ? `V${version}` : ""}Instrumentation was unable to wrap the \`createRouter\` function because the React Router browser tracing integration was not set up. Make sure \`Sentry.init()\` runs before the router is created.`
+      );
+      return createRouterFunction(routes, opts);
+    }
+    const config = { ...base, basename: opts?.basename || "" };
     addRoutesToAllRoutes(routes);
-    if (_enableAsyncRouteHandlers) {
+    if (config.enableAsyncRouteHandlers) {
       for (const route of routes) {
-        checkRouteForAsyncHandler(route, processResolvedRoutes);
+        checkRouteForAsyncHandler(route, (r, p, l, s) => processResolvedRoutes(r, config, p, l, s));
       }
     }
     const activeRootSpan = getActiveRootSpan();
@@ -253,35 +255,35 @@ function createV6CompatibleWrapCreateBrowserRouter(createRouterFunction, version
       addNonEnumerableProperty(activeRootSpan, "__sentry_may_have_lazy_routes__", true);
       createDeferredLazyRoutePromise(activeRootSpan);
     }
-    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, false, activeRootSpan);
+    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, false, activeRootSpan, config);
     const router = createRouterFunction(routes, wrappedOpts);
-    const basename = opts?.basename;
     if (router.state.historyAction === "POP" && activeRootSpan) {
       updatePageloadTransaction({
         activeRootSpan,
         location: router.state.location,
         routes,
-        basename,
-        allRoutes: Array.from(allRoutes)
+        allRoutes: Array.from(allRoutes),
+        config
       });
     }
-    _basename = basename || "";
-    setupRouterSubscription(router, routes, version, basename, activeRootSpan);
+    setupRouterSubscription(router, routes, version, activeRootSpan, config);
     return router;
   };
 }
 function createV6CompatibleWrapCreateMemoryRouter(createRouterFunction, version) {
-  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes) {
-    DEBUG_BUILD && debug.warn(
-      `reactRouter${version ? `V${version}` : ""}Instrumentation was unable to wrap the \`createMemoryRouter\` function because of one or more missing parameters.`
-    );
-    return createRouterFunction;
-  }
   return function(routes, opts) {
+    const base = getRouterConfig(getClient());
+    if (!base) {
+      DEBUG_BUILD && debug.warn(
+        `reactRouter${version ? `V${version}` : ""}Instrumentation was unable to wrap the \`createMemoryRouter\` function because the React Router browser tracing integration was not set up. Make sure \`Sentry.init()\` runs before the router is created.`
+      );
+      return createRouterFunction(routes, opts);
+    }
+    const config = { ...base, basename: opts?.basename || "" };
     addRoutesToAllRoutes(routes);
-    if (_enableAsyncRouteHandlers) {
+    if (config.enableAsyncRouteHandlers) {
       for (const route of routes) {
-        checkRouteForAsyncHandler(route, processResolvedRoutes);
+        checkRouteForAsyncHandler(route, (r, p, l, s) => processResolvedRoutes(r, config, p, l, s));
       }
     }
     const memoryActiveRootSpanEarly = getActiveRootSpan();
@@ -290,9 +292,8 @@ function createV6CompatibleWrapCreateMemoryRouter(createRouterFunction, version)
       addNonEnumerableProperty(memoryActiveRootSpanEarly, "__sentry_may_have_lazy_routes__", true);
       createDeferredLazyRoutePromise(memoryActiveRootSpanEarly);
     }
-    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, true, memoryActiveRootSpanEarly);
+    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, true, memoryActiveRootSpanEarly, config);
     const router = createRouterFunction(routes, wrappedOpts);
-    const basename = opts?.basename;
     let initialEntry = void 0;
     const initialEntries = opts?.initialEntries;
     const initialIndex = opts?.initialIndex;
@@ -306,19 +307,17 @@ function createV6CompatibleWrapCreateMemoryRouter(createRouterFunction, version)
         activeRootSpan: memoryActiveRootSpan,
         location,
         routes,
-        basename,
-        allRoutes: Array.from(allRoutes)
+        allRoutes: Array.from(allRoutes),
+        config
       });
     }
-    _basename = basename || "";
-    setupRouterSubscription(router, routes, version, basename, memoryActiveRootSpan);
+    setupRouterSubscription(router, routes, version, memoryActiveRootSpan, config);
     return router;
   };
 }
 function createReactRouterV6CompatibleTracingIntegration(options, version) {
   const integration = browserTracingIntegration({ ...options, instrumentPageLoad: false, instrumentNavigation: false });
   const {
-    useEffect,
     useLocation,
     useNavigationType,
     createRoutesFromChildren,
@@ -330,15 +329,14 @@ function createReactRouterV6CompatibleTracingIntegration(options, version) {
     lazyRouteTimeout,
     lazyRouteManifest
   } = options;
-  return {
-    ...integration,
+  return extendIntegration(integration, {
     setup(client) {
-      integration.setup(client);
       const finalTimeout = options.finalTimeout ?? 3e4;
       const defaultMaxWait = (options.idleTimeout ?? 1e3) * 3;
       const configuredMaxWait = lazyRouteTimeout ?? defaultMaxWait;
+      let resolvedLazyRouteTimeout;
       if (configuredMaxWait === Infinity) {
-        _lazyRouteTimeout = finalTimeout;
+        resolvedLazyRouteTimeout = finalTimeout;
         DEBUG_BUILD && debug.log(
           "[React Router] lazyRouteTimeout set to Infinity, capping at finalTimeout:",
           finalTimeout,
@@ -346,7 +344,7 @@ function createReactRouterV6CompatibleTracingIntegration(options, version) {
         );
       } else if (Number.isNaN(configuredMaxWait)) {
         DEBUG_BUILD && debug.warn("[React Router] lazyRouteTimeout must be a number, falling back to default:", defaultMaxWait);
-        _lazyRouteTimeout = defaultMaxWait;
+        resolvedLazyRouteTimeout = defaultMaxWait;
       } else if (configuredMaxWait < 0) {
         DEBUG_BUILD && debug.warn(
           "[React Router] lazyRouteTimeout must be non-negative or Infinity, got:",
@@ -354,21 +352,30 @@ function createReactRouterV6CompatibleTracingIntegration(options, version) {
           "falling back to:",
           defaultMaxWait
         );
-        _lazyRouteTimeout = defaultMaxWait;
+        resolvedLazyRouteTimeout = defaultMaxWait;
       } else {
-        _lazyRouteTimeout = configuredMaxWait;
+        resolvedLazyRouteTimeout = configuredMaxWait;
+      }
+      if (typeof useLocation === "function" && typeof useNavigationType === "function" && typeof createRoutesFromChildren === "function" && typeof matchRoutes === "function") {
+        reactRouterConfigByClient.set(client, {
+          useLocation,
+          useNavigationType,
+          createRoutesFromChildren,
+          matchRoutes,
+          stripBasename: stripBasename || false,
+          enableAsyncRouteHandlers,
+          instrumentNavigation,
+          lazyRouteTimeout: resolvedLazyRouteTimeout,
+          lazyRouteManifest,
+          basename: ""
+        });
+      } else {
+        DEBUG_BUILD && debug.warn(
+          "[React Router] Skipping route instrumentation because `useLocation`, `useNavigationType`, `createRoutesFromChildren` or `matchRoutes` was not provided. Pass them to `reactRouterBrowserTracingIntegration`, or import it from `@sentry/react/react-router` to have them supplied automatically."
+        );
       }
-      _useEffect = useEffect;
-      _useLocation = useLocation;
-      _useNavigationType = useNavigationType;
-      _matchRoutes = matchRoutes;
-      _createRoutesFromChildren = createRoutesFromChildren;
-      _enableAsyncRouteHandlers = enableAsyncRouteHandlers;
-      _lazyRouteManifest = lazyRouteManifest;
-      initializeRouterUtils(matchRoutes, stripBasename || false);
     },
     afterAllSetup(client) {
-      integration.afterAllSetup(client);
       const initPathName = WINDOW.location?.pathname;
       if (instrumentPageLoad && initPathName) {
         startBrowserTracingPageLoadSpan(client, {
@@ -382,25 +389,14 @@ function createReactRouterV6CompatibleTracingIntegration(options, version) {
           }
         });
       }
-      if (instrumentNavigation) {
-        CLIENTS_WITH_INSTRUMENT_NAVIGATION.add(client);
-      }
     }
-  };
+  });
 }
 function createV6CompatibleWrapUseRoutes(origUseRoutes, version) {
-  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes) {
-    DEBUG_BUILD && debug.warn(
-      "reactRouterV6Instrumentation was unable to wrap `useRoutes` because of one or more missing parameters."
-    );
-    return origUseRoutes;
-  }
-  const SentryRoutes = (props) => {
+  const RouteReporter = ({ config, routes, locationArg }) => {
     const isMountRenderPass = React.useRef(true);
-    const { routes, locationArg } = props;
-    const Routes = origUseRoutes(routes, locationArg);
-    const location = _useLocation();
-    const navigationType = _useNavigationType();
+    const location = config.useLocation();
+    const navigationType = config.useNavigationType();
     const stableLocationParam = typeof locationArg === "string" || locationArg?.pathname ? locationArg : location;
     useIsomorphicLayoutEffect(() => {
       const added = addRoutesToAllRoutes(routes);
@@ -413,7 +409,8 @@ function createV6CompatibleWrapUseRoutes(origUseRoutes, version) {
           activeRootSpan: getActiveRootSpan(),
           location: normalizedLocation,
           routes,
-          allRoutes: Array.from(allRoutes)
+          allRoutes: Array.from(allRoutes),
+          config
         });
         isMountRenderPass.current = false;
       } else {
@@ -422,17 +419,26 @@ function createV6CompatibleWrapUseRoutes(origUseRoutes, version) {
           routes,
           navigationType,
           version,
-          allRoutes: Array.from(allRoutes)
+          allRoutes: Array.from(allRoutes),
+          config
         });
       }
     }, [navigationType, stableLocationParam]);
-    return Routes;
+    return null;
+  };
+  const SentryRoutesWrapper = ({
+    routes,
+    locationArg
+  }) => {
+    const config = getRouterConfig(getClient());
+    const routesElement = origUseRoutes(routes, locationArg);
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, routesElement, config ? /* @__PURE__ */ React.createElement(RouteReporter, { config, routes, locationArg }) : null);
   };
   return (routes, locationArg) => {
-    return /* @__PURE__ */ React.createElement(SentryRoutes, { routes, locationArg });
+    return /* @__PURE__ */ React.createElement(SentryRoutesWrapper, { routes, locationArg });
   };
 }
-function wrapPatchRoutesOnNavigation(opts, isMemoryRouter = false, capturedSpan) {
+function wrapPatchRoutesOnNavigation(opts, isMemoryRouter, capturedSpan, config) {
   if (!opts || !("patchRoutesOnNavigation" in opts) || typeof opts.patchRoutesOnNavigation !== "function") {
     return opts || {};
   }
@@ -471,7 +477,7 @@ function wrapPatchRoutesOnNavigation(opts, isMemoryRouter = false, capturedSpan)
                 { pathname: targetPath, search: "", hash: "", state: null, key: "default" },
                 Array.from(allRoutes),
                 true,
-                _matchRoutes
+                config
               );
             }
             return originalPatch(routeId, children);
@@ -499,7 +505,7 @@ function wrapPatchRoutesOnNavigation(opts, isMemoryRouter = false, capturedSpan)
               { pathname, search: "", hash: "", state: null, key: "default" },
               Array.from(allRoutes),
               false,
-              _matchRoutes
+              config
             );
           }
         }
@@ -513,10 +519,10 @@ function wrapPatchRoutesOnNavigation(opts, isMemoryRouter = false, capturedSpan)
   };
 }
 function handleNavigation(opts) {
-  const { location, routes, navigationType, version, matches, basename, allRoutes: allRoutes2 } = opts;
-  const branches = Array.isArray(matches) ? matches : _matchRoutes(allRoutes2 || routes, location, basename);
+  const { location, routes, navigationType, version, config, matches, allRoutes: allRoutes2 } = opts;
+  const branches = Array.isArray(matches) ? matches : config.matchRoutes(allRoutes2 || routes, location, config.basename);
   const client = getClient();
-  if (!client || !CLIENTS_WITH_INSTRUMENT_NAVIGATION.has(client)) {
+  if (!client || !config.instrumentNavigation) {
     return;
   }
   const activeRootSpan = getActiveRootSpan();
@@ -529,9 +535,7 @@ function handleNavigation(opts) {
       allRoutes2 || routes,
       allRoutes2 || routes,
       branches,
-      basename,
-      _lazyRouteManifest,
-      _enableAsyncRouteHandlers
+      config
     );
     const locationKey = computeLocationKey(location);
     const trackedNav = activeNavigationSpans.get(client);
@@ -589,6 +593,7 @@ function handleNavigation(opts) {
       throw e;
     }
     if (navigationSpan) {
+      addNonEnumerableProperty(navigationSpan, "__sentry_navigation_pathname__", location.pathname);
       activeNavigationSpans.set(client, {
         span: navigationSpan,
         routeName: placeholderEntry.routeName,
@@ -596,7 +601,7 @@ function handleNavigation(opts) {
         pathname: location.pathname,
         locationKey
       });
-      patchSpanEnd(navigationSpan, location, routes, basename, "navigation");
+      patchSpanEnd(navigationSpan, location, routes, "navigation", config);
     } else {
       activeNavigationSpans.delete(client);
     }
@@ -636,20 +641,18 @@ function updatePageloadTransaction({
   activeRootSpan,
   location,
   routes,
+  config,
   matches,
-  basename,
   allRoutes: allRoutes2
 }) {
-  const branches = Array.isArray(matches) ? matches : _matchRoutes(allRoutes2 || routes, location, basename);
+  const branches = Array.isArray(matches) ? matches : config.matchRoutes(allRoutes2 || routes, location, config.basename);
   if (branches) {
     const [name, source] = resolveRouteNameAndSource(
       location,
       allRoutes2 || routes,
       allRoutes2 || routes,
       branches,
-      basename,
-      _lazyRouteManifest,
-      _enableAsyncRouteHandlers
+      config
     );
     getCurrentScope().setTransactionName(name || "/");
     if (activeRootSpan) {
@@ -660,10 +663,10 @@ function updatePageloadTransaction({
       if (source === "route") {
         activeRootSpan.setAttribute(URL_TEMPLATE, name);
       }
-      patchSpanEnd(activeRootSpan, location, routes, basename, "pageload");
+      patchSpanEnd(activeRootSpan, location, routes, "pageload", config);
     }
   } else if (activeRootSpan) {
-    patchSpanEnd(activeRootSpan, location, routes, basename, "pageload");
+    patchSpanEnd(activeRootSpan, location, routes, "pageload", config);
   }
 }
 function shouldUpdateWildcardSpanName(currentName, currentSource, newName, newSource, allowNoCurrentName = false) {
@@ -682,7 +685,7 @@ function shouldUpdateWildcardSpanName(currentName, currentSource, newName, newSo
   }
   return false;
 }
-function tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, basename, spanType, allRoutes2) {
+function tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, spanType, allRoutes2, config) {
   try {
     const currentSource = spanJson.attributes[SENTRY_SEGMENT_NAME_SOURCE];
     if (currentSource === "route" && currentName && !transactionNameHasWildcard(currentName)) {
@@ -690,19 +693,11 @@ function tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, route
     }
     const currentAllRoutes = Array.from(allRoutes2);
     const routesToUse = currentAllRoutes.length > 0 ? currentAllRoutes : routes;
-    const branches = _matchRoutes(routesToUse, location, basename);
+    const branches = config.matchRoutes(routesToUse, location, config.basename);
     if (!branches) {
       return;
     }
-    const [name, source] = resolveRouteNameAndSource(
-      location,
-      routesToUse,
-      routesToUse,
-      branches,
-      basename,
-      _lazyRouteManifest,
-      _enableAsyncRouteHandlers
-    );
+    const [name, source] = resolveRouteNameAndSource(location, routesToUse, routesToUse, branches, config);
     const isImprovement = shouldUpdateWildcardSpanName(currentName, currentSource, name, source, true);
     const spanNotEnded = spanType === "pageload" || !spanJson.end_timestamp;
     if (isImprovement && spanNotEnded) {
@@ -719,7 +714,7 @@ function tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, route
     DEBUG_BUILD && debug.warn(`Error updating span details before ending: ${error}`);
   }
 }
-function patchSpanEnd(span, location, routes, basename, spanType) {
+function patchSpanEnd(span, location, routes, spanType, config) {
   const patchedPropertyName = `__sentry_${spanType}_end_patched__`;
   const hasEndBeenPatched = span?.[patchedPropertyName];
   if (hasEndBeenPatched || !span.end) {
@@ -750,18 +745,18 @@ function patchSpanEnd(span, location, routes, basename, spanType) {
     const hasPendingOrMayHaveLazyRoutes = pendingPromises && pendingPromises.size > 0 || mayHaveLazyRoutes;
     const shouldWaitForLazyRoutes = hasPendingOrMayHaveLazyRoutes && currentName && (transactionNameHasWildcard(currentName) || currentSource !== "route");
     if (shouldWaitForLazyRoutes) {
-      if (_lazyRouteTimeout === 0) {
-        tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, basename, spanType, allRoutes);
+      if (config.lazyRouteTimeout === 0) {
+        tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, spanType, allRoutes, config);
         cleanupNavigationSpan();
         originalEnd(endTimestamp);
         return;
       }
-      const timeoutPromise = new Promise((r) => setTimeout(r, _lazyRouteTimeout));
+      const timeoutPromise = new Promise((r) => setTimeout(r, config.lazyRouteTimeout));
       let waitPromise;
       if (pendingPromises && pendingPromises.size > 0) {
         const allSettled = Promise.allSettled(pendingPromises).then(() => {
         });
-        waitPromise = _lazyRouteTimeout === Infinity ? allSettled : Promise.race([allSettled, timeoutPromise]);
+        waitPromise = config.lazyRouteTimeout === Infinity ? allSettled : Promise.race([allSettled, timeoutPromise]);
       } else {
         waitPromise = timeoutPromise;
       }
@@ -773,9 +768,9 @@ function patchSpanEnd(span, location, routes, basename, spanType) {
           updatedSpanJson.name,
           location,
           routes,
-          basename,
           spanType,
-          allRoutes
+          allRoutes,
+          config
         );
         cleanupNavigationSpan();
         originalEnd(endTimestamp);
@@ -785,24 +780,23 @@ function patchSpanEnd(span, location, routes, basename, spanType) {
       });
       return;
     }
-    tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, basename, spanType, allRoutes);
+    tryUpdateSpanNameBeforeEnd(span, spanJson, currentName, location, routes, spanType, allRoutes, config);
     cleanupNavigationSpan();
     originalEnd(endTimestamp);
   };
   addNonEnumerableProperty(span, patchedPropertyName, true);
 }
 function createV6CompatibleWithSentryReactRouterRouting(Routes, version) {
-  if (!_useEffect || !_useLocation || !_useNavigationType || !_createRoutesFromChildren || !_matchRoutes) {
-    DEBUG_BUILD && debug.warn(`reactRouterV6Instrumentation was unable to wrap Routes because of one or more missing parameters.
-      useEffect: ${_useEffect}. useLocation: ${_useLocation}. useNavigationType: ${_useNavigationType}.
-      createRoutesFromChildren: ${_createRoutesFromChildren}. matchRoutes: ${_matchRoutes}.`);
-    return Routes;
-  }
-  const SentryRoutes = (props) => {
+  const RouteReporter = ({
+    config,
+    routeChildren
+  }) => {
     const isMountRenderPass = React.useRef(true);
-    const location = _useLocation();
-    const navigationType = _useNavigationType();
-    const routes = _createRoutesFromChildren(props.children);
+    const location = config.useLocation();
+    const navigationType = config.useNavigationType();
+    const routes = config.createRoutesFromChildren(
+      routeChildren
+    );
     useIsomorphicLayoutEffect(() => {
       const added = addRoutesToAllRoutes(routes);
       return () => removeRoutesFromAllRoutes(added);
@@ -814,17 +808,36 @@ function createV6CompatibleWithSentryReactRouterRouting(Routes, version) {
             activeRootSpan: getActiveRootSpan(),
             location,
             routes,
-            allRoutes: Array.from(allRoutes)
+            allRoutes: Array.from(allRoutes),
+            config
           });
           isMountRenderPass.current = false;
         } else {
-          handleNavigation({ location, routes, navigationType, version, allRoutes: Array.from(allRoutes) });
+          handleNavigation({
+            location,
+            routes,
+            navigationType,
+            version,
+            allRoutes: Array.from(allRoutes),
+            config
+          });
         }
       },
       // Re-run only on location/navigation changes, not children changes
       [location, navigationType]
     );
-    return /* @__PURE__ */ React.createElement(Routes, { ...props });
+    return null;
+  };
+  const SentryRoutes = (props) => {
+    const config = getRouterConfig(getClient());
+    return /* @__PURE__ */ React.createElement(
+      React.Fragment,
+      null,
+      // @ts-expect-error Setting more specific React Component typing for `R` generic above
+      // will break advanced type inference done by react router params
+      /* @__PURE__ */ React.createElement(Routes, { ...props }),
+      config ? /* @__PURE__ */ React.createElement(RouteReporter, { config, routeChildren: props.children }) : null
+    );
   };
   hoistNonReactStatics(SentryRoutes, Routes);
   return SentryRoutes;