feat(nextjs): Serve the tunnel from the app with a DSN-derived path

dev-packages/bun-integration-tests/node-suites/excludes.ts

@@ -25,6 +25,7 @@ const NO_HTTP_SERVER_SPANS = [
   'suites/tracing/httpIntegration/test.ts',
   'suites/tracing/httpServerSpans-unrouted/test.ts',
   'suites/tracing/ignoreSpans/**',
+  'suites/tracing/managed-tunnel/test.ts',
   'suites/tracing/meta-tags-twp-errors/test.ts',
   'suites/tracing/meta-tags/test.ts',
   'suites/tracing/requestData/test.ts',

dev-packages/e2e-tests/test-applications/astro-7/astro.config.mjs

@@ -4,8 +4,13 @@ import { defineConfig } from 'astro/config';
 
 import node from '@astrojs/node';
 
+// The tunnel variant serves the app under a base path with trailing slashes to cover that the managed tunnel
+// follows both.
+const tunnelVariant = !!process.env.PUBLIC_E2E_TEST_TUNNEL;
+
 // https://astro.build/config
 export default defineConfig({
+  ...(tunnelVariant && { base: '/docs', trailingSlash: 'always' }),
   integrations: [
     sentry({
       debug: true,

dev-packages/e2e-tests/test-applications/astro-7/package.json

@@ -11,7 +11,10 @@
     "test:build": "pnpm install && pnpm build",
     "test:assert": "pnpm test:prod && pnpm test:dev",
     "test:prod": "TEST_ENV=production playwright test",
-    "test:dev": "TEST_ENV=development playwright test db"
+    "test:dev": "TEST_ENV=development playwright test db",
+    "test:build:tunnel": "pnpm install && PUBLIC_E2E_TEST_TUNNEL=1 PUBLIC_E2E_TEST_DSN=http://public@localhost:3031/1337 pnpm build",
+    "test:assert:tunnel": "PUBLIC_E2E_TEST_TUNNEL=1 PUBLIC_E2E_TEST_DSN=http://public@localhost:3031/1337 TEST_ENV=production playwright test tunnel",
+    "test:assert:tunnel-dev": "PUBLIC_E2E_TEST_TUNNEL=1 PUBLIC_E2E_TEST_DSN=http://public@localhost:3031/1337 TEST_ENV=development playwright test tunnel"
   },
   "//": "Need to use ioredis 5.10.1 because that's the last version before they support tracing channels",
   "dependencies": {
@@ -27,6 +30,18 @@
     "extends": "../../package.json"
   },
   "sentryTest": {
-    "optional": true
+    "optional": true,
+    "variants": [
+      {
+        "build-command": "pnpm test:build:tunnel",
+        "assert-command": "pnpm test:assert:tunnel",
+        "label": "astro-7 (tunnel)"
+      },
+      {
+        "label": "astro-7 (tunnel-dev)",
+        "build-command": "pnpm install",
+        "assert-command": "pnpm test:assert:tunnel-dev"
+      }
+    ]
   }
 }

dev-packages/e2e-tests/test-applications/astro-7/sentry.client.config.js

@@ -4,7 +4,7 @@ Sentry.init({
   dsn: import.meta.env.PUBLIC_E2E_TEST_DSN,
   environment: 'qa',
   tracesSampleRate: 1.0,
-  tunnel: 'http://localhost:3031/', // proxy server
+  tunnel: import.meta.env.PUBLIC_E2E_TEST_TUNNEL ? true : 'http://localhost:3031/', // proxy server
   integrations: [
     Sentry.browserTracingIntegration({
       beforeStartSpan: opts => {

dev-packages/e2e-tests/test-applications/astro-7/sentry.server.config.js

@@ -4,6 +4,6 @@ Sentry.init({
   dsn: import.meta.env.PUBLIC_E2E_TEST_DSN,
   environment: 'qa',
   tracesSampleRate: 1.0,
-  tunnel: 'http://localhost:3031/', // proxy server
+  tunnel: import.meta.env.PUBLIC_E2E_TEST_TUNNEL ? true : 'http://localhost:3031/', // proxy server
   debug: true,
 });

dev-packages/e2e-tests/test-applications/astro-7/src/middleware.ts

@@ -0,0 +1,14 @@
+import { defineMiddleware } from 'astro:middleware';
+
+// The tunnel variant checks that the managed tunnel answers before an auth middleware like this one.
+export const onRequest = defineMiddleware((context, next) => {
+  if (
+    import.meta.env.PUBLIC_E2E_TEST_TUNNEL &&
+    context.request.method === 'POST' &&
+    context.request.headers.get('x-auth') !== 'ok'
+  ) {
+    return new Response('blocked by user auth', { status: 401 });
+  }
+
+  return next();
+});

dev-packages/e2e-tests/test-applications/astro-7/tests/tunnel.test.ts

@@ -0,0 +1,43 @@
+import { expect, test } from '@playwright/test';
+import { getSpanOp, waitForStreamedSpan } from '@sentry-internal/test-utils';
+
+test.skip(!process.env.PUBLIC_E2E_TEST_TUNNEL, 'Only runs in the tunnel variant');
+
+const TUNNEL_PATH = /^\/docs\/[a-z0-9]{1,7}\/$/;
+
+test('answers the managed tunnel under the base path before the app middleware', async ({ page }) => {
+  // The variant's auth middleware rejects every other POST.
+  expect((await page.request.post('/docs/anything/', { data: 'x' })).status()).toBe(401);
+
+  const tunnelServerSpanPromise = waitForStreamedSpan(
+    'astro-7',
+    span =>
+      getSpanOp(span) === 'http.server' &&
+      /\/docs\/[a-z0-9]{1,7}\/?$/.test(String(span.attributes['url.path']?.value ?? '')),
+  );
+  const tunnelResponsePromise = page.waitForResponse(
+    response => response.request().method() === 'POST' && TUNNEL_PATH.test(new URL(response.url()).pathname),
+  );
+
+  await page.goto('/docs/');
+  const tunnelResponse = await tunnelResponsePromise;
+
+  expect(tunnelResponse.status()).toBe(200);
+  expect(new URL(tunnelResponse.url()).origin).toBe(new URL(page.url()).origin);
+
+  // Anchor on a regular server span requested after the tunnel traffic: spans flush in order, so a tunnel span
+  // would arrive first.
+  const anchorSpanPromise = waitForStreamedSpan(
+    'astro-7',
+    span =>
+      getSpanOp(span) === 'http.server' &&
+      String(span.attributes['url.path']?.value ?? '').startsWith('/docs/test-ssr'),
+  );
+  await page.request.get('/docs/test-ssr/');
+
+  const winner = await Promise.race([
+    tunnelServerSpanPromise.then(() => 'tunnel' as const),
+    anchorSpanPromise.then(() => 'anchor' as const),
+  ]);
+  expect(winner).toBe('anchor');
+});

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/instrumentation-client.ts

@@ -2,8 +2,8 @@ import * as Sentry from '@sentry/nextjs';
 
 Sentry.init({
   environment: 'qa', // dynamic sampling bias to keep transactions
-  // Use a fake but properly formatted Sentry SaaS DSN for tunnel route testing
-  dsn: 'https://public@o12345.ingest.us.sentry.io/67890',
+  // The tunnel forwards to the DSN host, which is the event proxy here
+  dsn: 'http://public@localhost:3031/1337',
   // No tunnel option - using tunnelRoute from withSentryConfig
   tracesSampleRate: 1.0,
 });

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/package.json

@@ -4,15 +4,15 @@
   "private": true,
   "scripts": {
     "dev": " next dev",
-    "build": "_SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ next build > .tmp_build_stdout 2> .tmp_build_stderr || (cat .tmp_build_stdout && cat .tmp_build_stderr && exit 1)",
+    "build": "next build > .tmp_build_stdout 2> .tmp_build_stderr || (cat .tmp_build_stdout && cat .tmp_build_stderr && exit 1)",
     "clean": "npx rimraf node_modules pnpm-lock.yaml .tmp_dev_server_logs",
-    "dev:webpack": "_SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ next dev --webpack",
-    "build-webpack": "_SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ next build --webpack > .tmp_build_stdout 2> .tmp_build_stderr || (cat .tmp_build_stdout && cat .tmp_build_stderr && exit 1)",
-    "start": "_SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ next start",
+    "dev:webpack": "next dev --webpack",
+    "build-webpack": "next build --webpack > .tmp_build_stdout 2> .tmp_build_stderr || (cat .tmp_build_stdout && cat .tmp_build_stderr && exit 1)",
+    "start": "next start",
     "lint": "eslint",
     "test:prod": "TEST_ENV=production playwright test",
-    "test:dev": "TEST_ENV=development _SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ playwright test",
-    "test:dev-webpack": "TEST_ENV=development-webpack _SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ playwright test",
+    "test:dev": "TEST_ENV=development playwright test",
+    "test:dev-webpack": "TEST_ENV=development-webpack playwright test",
     "test:build": "pnpm install && pnpm build",
     "test:build-webpack": "pnpm install && pnpm build-webpack",
     "test:build-canary": "pnpm install && pnpm add next@canary && pnpm build",
@@ -21,7 +21,7 @@
     "test:build-canary-webpack": "pnpm install && pnpm add next@canary && pnpm build-webpack",
     "test:assert": "pnpm test:prod && pnpm test:dev",
     "test:assert-webpack": "pnpm test:prod && pnpm test:dev-webpack",
-    "test:build:cloudflare": "pnpm install && _SENTRY_TUNNEL_DESTINATION_OVERRIDE=http://localhost:3031/ opennextjs-cloudflare build",
+    "test:build:cloudflare": "pnpm install && opennextjs-cloudflare build",
     "start:cloudflare": "opennextjs-cloudflare preview"
   },
   "dependencies": {

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/proxy.ts

@@ -1,7 +1,13 @@
+import * as Sentry from '@sentry/nextjs';
 import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
-export async function proxy(_request: NextRequest) {
+export async function proxy(request: NextRequest) {
+  // Stands in for auth middleware, without blocking the other tests.
+  if (request.headers.get('x-e2e-require-auth') && !Sentry.isTunnelRequest(request)) {
+    return new NextResponse(null, { status: 401 });
+  }
+
   return NextResponse.next();
 }
 

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/sentry.edge.config.ts

@@ -2,8 +2,8 @@ import * as Sentry from '@sentry/nextjs';
 
 Sentry.init({
   environment: 'qa', // dynamic sampling bias to keep transactions
-  // Use a fake but properly formatted Sentry SaaS DSN for tunnel route testing
-  dsn: 'https://public@o12345.ingest.us.sentry.io/67890',
+  // The tunnel forwards to the DSN host, which is the event proxy here
+  dsn: 'http://public@localhost:3031/1337',
   // No tunnel option - using tunnelRoute from withSentryConfig
   tracesSampleRate: 1.0,
   // debug: true,

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/sentry.server.config.ts

@@ -2,8 +2,8 @@ import * as Sentry from '@sentry/nextjs';
 
 Sentry.init({
   environment: 'qa', // dynamic sampling bias to keep transactions
-  // Use a fake but properly formatted Sentry SaaS DSN for tunnel route testing
-  dsn: 'https://public@o12345.ingest.us.sentry.io/67890',
+  // The tunnel forwards to the DSN host, which is the event proxy here
+  dsn: 'http://public@localhost:3031/1337',
   // No tunnel option - using tunnelRoute from withSentryConfig
   tracesSampleRate: 1.0,
   // debug: true,

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/tests/tunnel-dsn-path.test.ts

@@ -0,0 +1,79 @@
+import { expect, test } from '@playwright/test';
+import { getSpanOp, waitForError, waitForStreamedSpan, waitForStreamedSpans } from '@sentry-internal/test-utils';
+import type { SerializedStreamedSpan } from '@sentry/core';
+import { getTunnelPath } from '@sentry/core';
+
+const TUNNEL_PATH = getTunnelPath('http://public@localhost:3031/1337');
+
+test('sends events to the DSN-derived path, served by the app', async ({ page }) => {
+  const tunnelRequests: string[] = [];
+  page.on('request', request => {
+    if (request.method() === 'POST') {
+      tunnelRequests.push(new URL(request.url()).pathname);
+    }
+  });
+
+  const errorPromise = waitForError('nextjs-16-tunnel', event => {
+    return event.exception?.values?.[0]?.value === 'Managed tunnel error';
+  });
+
+  await page.goto('/');
+  await page.evaluate(() => {
+    setTimeout(() => {
+      throw new Error('Managed tunnel error');
+    });
+  });
+
+  expect(await errorPromise).toBeDefined();
+  expect(tunnelRequests).toContain(TUNNEL_PATH);
+});
+
+test('does not create server spans for tunnel requests', async ({ page }) => {
+  const serverSpans: SerializedStreamedSpan[] = [];
+  void waitForStreamedSpans('nextjs-16-tunnel', spans => {
+    serverSpans.push(...spans.filter(span => span.is_segment));
+    return false;
+  });
+
+  const errorPromise = waitForError('nextjs-16-tunnel', event => {
+    return event.exception?.values?.[0]?.value === 'Managed tunnel span error';
+  });
+
+  await page.goto('/');
+  await page.evaluate(() => {
+    setTimeout(() => {
+      throw new Error('Managed tunnel span error');
+    });
+  });
+  await errorPromise;
+
+  // Spans flush in order, so a span for the tunnel request would arrive before the one for this request.
+  const anchorSpanPromise = waitForStreamedSpan(
+    'nextjs-16-tunnel',
+    span => span.is_segment && getSpanOp(span) === 'http.server' && span.name === 'GET /',
+  );
+  await page.request.get('/');
+  await anchorSpanPromise;
+
+  const tunnelSpans = serverSpans.filter(
+    span => span.name.includes(TUNNEL_PATH!) || span.name.includes('sentry-tunnel'),
+  );
+  expect(tunnelSpans).toEqual([]);
+});
+
+test('lets tunnel requests through auth middleware with `isTunnelRequest`', async ({ request }) => {
+  const headers = { 'content-type': 'application/x-sentry-envelope', 'x-e2e-require-auth': '1' };
+  const data = `${JSON.stringify({ dsn: 'http://public@localhost:3031/1337' })}\n`;
+
+  expect((await request.post(TUNNEL_PATH!, { headers, data })).status()).toBe(200);
+  expect((await request.post('/notatunnel', { headers, data })).status()).toBe(401);
+});
+
+test('answers 404 to an envelope POST on any other path', async ({ request }) => {
+  const response = await request.post('/notatunnel', {
+    headers: { 'content-type': 'application/x-sentry-envelope' },
+    data: `${JSON.stringify({ dsn: 'http://public@localhost:3031/1337' })}\n`,
+  });
+
+  expect(response.status()).toBe(404);
+});

dev-packages/e2e-tests/test-applications/nextjs-16-tunnel/worker.ts

@@ -5,7 +5,7 @@ import handler from './.open-next/worker.js';
 export default Sentry.withSentry(
   () => ({
     environment: 'qa', // dynamic sampling bias to keep transactions
-    dsn: 'https://public@o12345.ingest.us.sentry.io/67890',
+    dsn: 'http://public@localhost:3031/1337',
     // Sends the server spans to the proxy server, so the tests see whether a tunnel request was sampled.
     tunnel: 'http://localhost:3031/',
     tracesSampleRate: 1.0,

dev-packages/e2e-tests/test-applications/nextjs-pages-dir/instrumentation-client.ts

@@ -2,8 +2,9 @@ import * as Sentry from '@sentry/nextjs';
 
 Sentry.init({
   environment: 'qa', // dynamic sampling bias to keep transactions
-  dsn: process.env.NEXT_PUBLIC_E2E_TEST_DSN,
-  tunnel: `http://localhost:3031/`, // proxy server
+  // The tunnel forwards to the DSN host, so the tunnel variant points it at the event proxy
+  dsn: process.env.NEXT_PUBLIC_E2E_TUNNEL ? 'http://public@localhost:3031/1337' : process.env.NEXT_PUBLIC_E2E_TEST_DSN,
+  tunnel: process.env.NEXT_PUBLIC_E2E_TUNNEL ? undefined : `http://localhost:3031/`, // proxy server
   tracesSampleRate: 1.0,
 });
 

dev-packages/e2e-tests/test-applications/nextjs-pages-dir/instrumentation.ts

@@ -4,8 +4,11 @@ export function register() {
   if (process.env.NEXT_RUNTIME === 'nodejs' || process.env.NEXT_RUNTIME === 'edge') {
     Sentry.init({
       environment: 'qa', // dynamic sampling bias to keep transactions
-      dsn: process.env.NEXT_PUBLIC_E2E_TEST_DSN,
-      tunnel: `http://localhost:3031/`, // proxy server
+      // The tunnel forwards to the DSN host, so the tunnel variant points it at the event proxy
+      dsn: process.env.NEXT_PUBLIC_E2E_TUNNEL
+        ? 'http://public@localhost:3031/1337'
+        : process.env.NEXT_PUBLIC_E2E_TEST_DSN,
+      tunnel: process.env.NEXT_PUBLIC_E2E_TUNNEL ? undefined : `http://localhost:3031/`, // proxy server
       tracesSampleRate: 1.0,
       transportOptions: {
         // We are doing a lot of events at once in this test

dev-packages/e2e-tests/test-applications/nextjs-pages-dir/middleware.ts

@@ -15,10 +15,16 @@ export async function middleware(request: NextRequest) {
     await fetch('http://localhost:3030/');
   }
 
+  // Stands in for auth middleware, without blocking the other tests.
+  if (request.headers.has('x-e2e-require-auth') && !Sentry.isTunnelRequest(request)) {
+    return new NextResponse(null, { status: 401 });
+  }
+
   return NextResponse.next();
 }
 
 // See "Matching Paths" below to learn more
 export const config = {
-  matcher: ['/api/endpoint-behind-middleware', '/api/endpoint-behind-faulty-middleware'],
+  // The tunnel path of the test DSN, and a path next to it for the tunnel variant.
+  matcher: ['/api/endpoint-behind-middleware', '/api/endpoint-behind-faulty-middleware', '/qpo967', '/notatunnel'],
 };

dev-packages/e2e-tests/test-applications/nextjs-pages-dir/next.config.js

@@ -9,6 +9,7 @@ const nextConfig = {
 
 module.exports = withSentryConfig(nextConfig, {
   debug: true,
+  tunnelRoute: !!process.env.NEXT_PUBLIC_E2E_TUNNEL,
   sourcemaps: {
     deleteSourcemapsAfterUpload: true,
   },

dev-packages/e2e-tests/test-applications/nextjs-pages-dir/package.json

@@ -11,7 +11,9 @@
     "test:build": "pnpm install && pnpm build",
     "test:test-build": "pnpm ts-node --script-mode assert-build.ts",
     "test:build-15": "pnpm install && pnpm add next@15 && pnpm add react@latest && pnpm add react-dom@latest && pnpm build",
-    "test:assert": "pnpm test:test-build && pnpm test:prod && pnpm test:dev"
+    "test:assert": "pnpm test:test-build && pnpm test:prod && pnpm test:dev",
+    "test:build:tunnel": "pnpm install && NEXT_PUBLIC_E2E_TUNNEL=1 pnpm build",
+    "test:assert:tunnel": "NEXT_PUBLIC_E2E_TUNNEL=1 pnpm test:prod tunnel-dsn-path"
   },
   "dependencies": {
     "@sentry/nextjs": "file:../../packed/sentry-nextjs-packed.tgz",
@@ -37,6 +39,11 @@
       {
         "build-command": "pnpm test:build-15",
         "label": "nextjs-pages-dir (next@15)"
+      },
+      {
+        "build-command": "pnpm test:build:tunnel",
+        "assert-command": "pnpm test:assert:tunnel",
+        "label": "nextjs-pages-dir (tunnel)"
       }
     ],
     "optionalVariants": []