start span for other server requests

Author: nicohrubec

dev-packages/e2e-tests/test-applications/tanstackstart-react/tests/transaction.test.ts

@@ -102,8 +102,7 @@ test('Sends a server function transaction for a nested server function only if i
 test('Sends an API route transaction with auto-instrumentation', async ({ page }) => {
   const transactionEventPromise = waitForTransaction('tanstackstart-react', transactionEvent => {
     return (
-      transactionEvent?.contexts?.trace?.op === 'http.server' &&
-      transactionEvent?.transaction === 'GET /api/hello'
+      transactionEvent?.contexts?.trace?.op === 'http.server' && transactionEvent?.transaction === 'GET /api/hello'
     );
   });
 
@@ -125,11 +124,11 @@ test('Sends an API route transaction with auto-instrumentation', async ({ page }
         description: 'GET /api/hello',
         op: 'http.server',
         origin: 'auto.http.tanstackstart.server',
-        source: 'route',
         data: {
           'sentry.op': 'http.server',
           'sentry.origin': 'auto.http.tanstackstart.server',
-          'http.route': '/api/hello',
+          'sentry.source': 'route',
+          'http.request.method': 'GET',
         },
       }),
     ]),

packages/tanstackstart-react/src/server/wrapFetchWithSentry.ts

@@ -1,4 +1,11 @@
-import { SEMANTIC_ATTRIBUTE_SENTRY_OP, SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN, startSpan } from '@sentry/node';
+import type { SpanAttributes } from '@sentry/core';
+import { SEMANTIC_ATTRIBUTE_HTTP_REQUEST_METHOD } from '@sentry/core';
+import {
+  SEMANTIC_ATTRIBUTE_SENTRY_OP,
+  SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN,
+  SEMANTIC_ATTRIBUTE_SENTRY_SOURCE,
+  startSpan,
+} from '@sentry/node';
 import { extractServerFunctionSha256 } from './utils';
 
 export type ServerEntry = {
@@ -42,7 +49,7 @@ export function wrapFetchWithSentry(serverEntry: ServerEntry): ServerEntry {
           const functionSha256 = extractServerFunctionSha256(url.pathname);
           const op = 'function.tanstackstart';
 
-          const serverFunctionSpanAttributes = {
+          const serverFunctionSpanAttributes: SpanAttributes = {
             [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.function.tanstackstart.server',
             [SEMANTIC_ATTRIBUTE_SENTRY_OP]: op,
             'tanstackstart.function.hash.sha256': functionSha256,
@@ -60,7 +67,25 @@ export function wrapFetchWithSentry(serverEntry: ServerEntry): ServerEntry {
           );
         }
 
-        return target.apply(thisArg, args);
+        // instrument other server requests including API routes
+        const op = 'http.server';
+        const httpServerSpanAttributes: SpanAttributes = {
+          [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.tanstackstart.server',
+          [SEMANTIC_ATTRIBUTE_SENTRY_OP]: op,
+          [SEMANTIC_ATTRIBUTE_HTTP_REQUEST_METHOD]: method,
+          [SEMANTIC_ATTRIBUTE_SENTRY_SOURCE]: 'route',
+        };
+
+        return startSpan(
+          {
+            op: op,
+            name: `${method} ${url.pathname}`,
+            attributes: httpServerSpanAttributes,
+          },
+          () => {
+            return target.apply(thisArg, args);
+          },
+        );
       },
     });
   }