fix(nextjs): Re-enable OTEL fetch instrumentation and disable Next.js fetch instrumentation (#11686)

Author: Luca Forstner

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-fetch-external-disallowed/check/route.ts

@@ -0,0 +1,5 @@
+import { checkHandler } from '../../utils';
+
+export const dynamic = 'force-dynamic';
+
+export const GET = checkHandler;

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-fetch-external-disallowed/route.ts

@@ -0,0 +1,10 @@
+import { NextResponse } from 'next/server';
+
+export const dynamic = 'force-dynamic';
+
+export async function GET() {
+  const data = await fetch(`http://localhost:3030/propagation/test-outgoing-fetch-external-disallowed/check`).then(
+    res => res.json(),
+  );
+  return NextResponse.json(data);
+}

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-fetch/check/route.ts

@@ -0,0 +1,5 @@
+import { checkHandler } from '../../utils';
+
+export const dynamic = 'force-dynamic';
+
+export const GET = checkHandler;

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-fetch/route.ts

@@ -0,0 +1,8 @@
+import { NextResponse } from 'next/server';
+
+export const dynamic = 'force-dynamic';
+
+export async function GET() {
+  const data = await fetch(`http://localhost:3030/propagation/test-outgoing-fetch/check`).then(res => res.json());
+  return NextResponse.json(data);
+}

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-http-external-disallowed/check/route.ts

@@ -0,0 +1,5 @@
+import { checkHandler } from '../../utils';
+
+export const dynamic = 'force-dynamic';
+
+export const GET = checkHandler;

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-http-external-disallowed/route.ts

@@ -0,0 +1,9 @@
+import { NextResponse } from 'next/server';
+import { makeHttpRequest } from '../utils';
+
+export const dynamic = 'force-dynamic';
+
+export async function GET() {
+  const data = await makeHttpRequest(`http://localhost:3030/propagation/test-outgoing-http-external-disallowed/check`);
+  return NextResponse.json(data);
+}

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-http/check/route.ts

@@ -0,0 +1,5 @@
+import { checkHandler } from '../../utils';
+
+export const dynamic = 'force-dynamic';
+
+export const GET = checkHandler;

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/test-outgoing-http/route.ts

@@ -0,0 +1,9 @@
+import { NextResponse } from 'next/server';
+import { makeHttpRequest } from '../utils';
+
+export const dynamic = 'force-dynamic';
+
+export async function GET() {
+  const data = await makeHttpRequest(`http://localhost:3030/propagation/test-outgoing-http/check`);
+  return NextResponse.json(data);
+}

dev-packages/e2e-tests/test-applications/nextjs-14/app/propagation/utils.ts

@@ -0,0 +1,38 @@
+import http from 'http';
+import { headers } from 'next/headers';
+import { NextResponse } from 'next/server';
+
+export function makeHttpRequest(url: string) {
+  return new Promise(resolve => {
+    const data: any[] = [];
+    http
+      .request(url, httpRes => {
+        httpRes.on('data', chunk => {
+          data.push(chunk);
+        });
+        httpRes.on('error', error => {
+          resolve({ error: error.message, url });
+        });
+        httpRes.on('end', () => {
+          try {
+            const json = JSON.parse(Buffer.concat(data).toString());
+            resolve(json);
+          } catch {
+            resolve({ data: Buffer.concat(data).toString(), url });
+          }
+        });
+      })
+      .end();
+  });
+}
+
+export function checkHandler() {
+  const headerList = headers();
+
+  const headerObj: Record<string, unknown> = {};
+  headerList.forEach((value, key) => {
+    headerObj[key] = value;
+  });
+
+  return NextResponse.json({ headers: headerObj });
+}

dev-packages/e2e-tests/test-applications/nextjs-14/app/request-instrumentation/page.tsx

@@ -3,7 +3,7 @@ import http from 'http';
 export const dynamic = 'force-dynamic';
 
 export default async function Page() {
-  await fetch('http://example.com/', { cache: 'no-cache' });
+  await fetch('http://example.com/', { cache: 'no-cache' }).then(res => res.text());
   await new Promise<void>(resolve => {
     http.get('http://example.com/', res => {
       res.on('data', () => {