diff --git a/packages/nextjs/src/client/routing/appRouterRoutingInstrumentation.ts b/packages/nextjs/src/client/routing/appRouterRoutingInstrumentation.ts index 6ff2da7f9a37..312a7119c250 100644 --- a/packages/nextjs/src/client/routing/appRouterRoutingInstrumentation.ts +++ b/packages/nextjs/src/client/routing/appRouterRoutingInstrumentation.ts @@ -94,31 +94,32 @@ export function appRouterInstrumentNavigation(client: Client): void { // @ts-expect-error Weird type error related to not knowing how to associate return values with the individual functions - we can just ignore router[routerFunctionName] = new Proxy(router[routerFunctionName], { apply(target, thisArg, argArray) { - const span = startBrowserTracingNavigationSpan(client, { - name: INCOMPLETE_APP_ROUTER_INSTRUMENTATION_TRANSACTION_NAME, - attributes: { - [SEMANTIC_ATTRIBUTE_SENTRY_OP]: 'navigation', - [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.navigation.nextjs.app_router_instrumentation', - [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'url', - }, - }); - - currentNavigationSpan = span; + let transactionName = INCOMPLETE_APP_ROUTER_INSTRUMENTATION_TRANSACTION_NAME; + const transactionAttributes: Record = { + [SEMANTIC_ATTRIBUTE_SENTRY_OP]: 'navigation', + [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.navigation.nextjs.app_router_instrumentation', + [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'url', + }; if (routerFunctionName === 'push') { - span?.updateName(transactionNameifyRouterArgument(argArray[0])); - span?.setAttribute(SEMANTIC_ATTRIBUTE_SENTRY_SOURCE, 'url'); - span?.setAttribute('navigation.type', 'router.push'); + transactionName = transactionNameifyRouterArgument(argArray[0]); + transactionAttributes[SEMANTIC_ATTRIBUTE_SENTRY_SOURCE] = 'url'; + transactionAttributes['navigation.type'] = 'router.push'; } else if (routerFunctionName === 'replace') { - span?.updateName(transactionNameifyRouterArgument(argArray[0])); - span?.setAttribute(SEMANTIC_ATTRIBUTE_SENTRY_SOURCE, 'url'); - span?.setAttribute('navigation.type', 'router.replace'); + transactionName = transactionNameifyRouterArgument(argArray[0]); + transactionAttributes[SEMANTIC_ATTRIBUTE_SENTRY_SOURCE] = 'url'; + transactionAttributes['navigation.type'] = 'router.replace'; } else if (routerFunctionName === 'back') { - span?.setAttribute('navigation.type', 'router.back'); + transactionAttributes['navigation.type'] = 'router.back'; } else if (routerFunctionName === 'forward') { - span?.setAttribute('navigation.type', 'router.forward'); + transactionAttributes['navigation.type'] = 'router.forward'; } + currentNavigationSpan = startBrowserTracingNavigationSpan(client, { + name: transactionName, + attributes: transactionAttributes, + }); + return target.apply(thisArg, argArray); }, });