Fix nextjs duplicate connections causing duplicate traces to be sent (#…

…201)

.changeset/curly-swans-agree.md

@@ -0,0 +1,5 @@
+---
+'@envyjs/nextjs': patch
+---
+
+Fix bug where the nextjs sender could be registered multiple times, causing traces to show duplicates

examples/next/app/api/swapi/route.ts

@@ -0,0 +1,10 @@
+import axios from 'axios';
+import { NextResponse } from 'next/server';
+
+const SWAPI_URL = 'https://swapi.dev/api/people/1';
+
+export async function GET() {
+  // Look - just one call to the SWAPI endpoint!
+  const { data } = await axios.get(SWAPI_URL);
+  return NextResponse.json(data);
+}

examples/next/app/next13app/call-api-route/ApiRouteExample.tsx

@@ -0,0 +1,34 @@
+'use client';
+
+const API_ROUTE_URL = 'http://localhost:3000/api/swapi';
+const SWAPI_URL = 'https://swapi.dev/api/people/1';
+
+export default function ApiRouteExample() {
+  async function makeSwapiCall() {
+    await fetch(API_ROUTE_URL);
+  }
+
+  const swapiUrl = <code className="text-pink-600 bg-pink-100 px-2 py-1 rounded-xl font-bold">{SWAPI_URL}</code>;
+  const apiRouteUrl = (
+    <code className="text-green-700 bg-green-100 px-2 py-1 rounded-xl font-bold">{API_ROUTE_URL}</code>
+  );
+
+  const button = (
+    <button className="inline-block px-4 py-2 rounded-xl" onClick={makeSwapiCall}>
+      Make SWAPI call
+    </button>
+  );
+
+  return (
+    <main className="container my-8 mx-auto">
+      <div className="space-y-4">
+        <h1>Calling an API route which makes an upstream request</h1>
+        <p>Click the button to make a call to an API route from this page.</p>
+        <p>
+          This will call {apiRouteUrl}, where that API route will call {swapiUrl}
+        </p>
+      </div>
+      <div className="mt-8">{button}</div>
+    </main>
+  );
+}

examples/next/app/next13app/call-api-route/page.tsx

@@ -0,0 +1,5 @@
+import ApiRouteExample from './ApiRouteExample';
+
+export default function Home() {
+  return <ApiRouteExample />;
+}

examples/next/package.json

@@ -12,6 +12,7 @@
     "@types/react": "18.2.21",
     "@types/react-dom": "18.2.7",
     "autoprefixer": "10.4.15",
+    "axios": "1.6.5",
     "eslint": "8.49.0",
     "eslint-config-next": "13.4.19",
     "next": "13.4.19",

packages/nextjs/src/tracing.ts

@@ -3,13 +3,12 @@ import { TracingOptions, enableTracing as nodeTracing } from '@envyjs/node';
 
 import { Routes } from './route';
 
+type GlobalWithFlag = { __nextjsTracingInitialized: boolean };
+const globalWithFlag: GlobalWithFlag = global as unknown as GlobalWithFlag;
+
 // eslint-disable-next-line @typescript-eslint/ban-types
 export type NextjsTracingOptions = TracingOptions & {};
 
-// nextjs dev mode can run this multiple times
-// prevent multiple registrations with a flag
-let initialized = false;
-
 export function enableTracing(options: NextjsTracingOptions) {
   const nextjsOptions: NextjsTracingOptions = {
     ...options,
@@ -30,8 +29,8 @@ export function enableTracing(options: NextjsTracingOptions) {
     return true;
   };
 
-  if (!initialized) {
-    initialized = true;
+  if (!globalWithFlag.__nextjsTracingInitialized) {
+    globalWithFlag.__nextjsTracingInitialized = true;
     return nodeTracing({
       ...nextjsOptions,
       plugins: [...(options.plugins || []), Routes],

yarn.lock

@@ -5199,6 +5199,15 @@ axe-core@^4.6.2:
   resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.8.1.tgz#6948854183ee7e7eae336b9877c5bafa027998ea"
   integrity sha512-9l850jDDPnKq48nbad8SiEelCv4OrUWrKab/cPj0GScVg6cb6NbCCt/Ulk26QEq5jP9NnGr04Bit1BHyV6r5CQ==
 
+[email protected]:
+  version "1.6.5"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-1.6.5.tgz#2c090da14aeeab3770ad30c3a1461bc970fb0cd8"
+  integrity sha512-Ii012v05KEVuUoFWmMW/UQv9aRIc3ZwkWDcM+h5Il8izZCtRVpDUfwpoFf7eOtajT3QiGR4yDUx7lPqHJULgbg==
+  dependencies:
+    follow-redirects "^1.15.4"
+    form-data "^4.0.0"
+    proxy-from-env "^1.1.0"
+
 axios@^0.27.2:
   version "0.27.2"
   resolved "https://registry.yarnpkg.com/axios/-/axios-0.27.2.tgz#207658cc8621606e586c85db4b41a750e756d972"
@@ -7515,6 +7524,11 @@ follow-redirects@^1.14.9, follow-redirects@^1.15.2:
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13"
   integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==
 
+follow-redirects@^1.15.4:
+  version "1.15.5"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.5.tgz#54d4d6d062c0fa7d9d17feb008461550e3ba8020"
+  integrity sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==
+
 for-each@^0.3.3:
   version "0.3.3"
   resolved "https://registry.yarnpkg.com/for-each/-/for-each-0.3.3.tgz#69b447e88a0a5d32c3e7084f3f1710034b21376e"
@@ -10765,7 +10779,7 @@ proxy-addr@~2.0.7:
     forwarded "0.2.0"
     ipaddr.js "1.9.1"
 
-proxy-from-env@^1.0.0:
+proxy-from-env@^1.0.0, proxy-from-env@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2"
   integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==