feat(instrumentation-fetch)! Passthrough original request to `applyCu…

…stomAttributes` (#5281)

experimental/CHANGELOG.md

@@ -7,6 +7,9 @@ All notable changes to experimental packages in this project will be documented
 
 ### :boom: Breaking Change
 
+* feat(instrumentation-fetch)!: passthrough original response to `applyCustomAttributes` hook [#5281](https://github.com/open-telemetry/opentelemetry-js/pull/5281) @chancancode
+  * Previously, the fetch instrumentation code unconditionally clones every `fetch()` response in order to preserve the ability for the `applyCustomAttributes` hook to consume the response body. This is fundamentally unsound, as it forces the browser to buffer and retain the response body until it is fully received and read, which crates unnecessary memory pressure on large or long-running response streams. In extreme cases, this is effectively a memory leak and can cause the browser tab to crash. If your use case for `applyCustomAttributes` requires access to the response body, please chime in on [#5293](https://github.com/open-telemetry/opentelemetry-js/issues/5293).
+
 ### :rocket: (Enhancement)
 
 ### :bug: (Bug Fix)

experimental/packages/opentelemetry-instrumentation-fetch/src/fetch.ts

@@ -372,15 +372,14 @@ export class FetchInstrumentation extends InstrumentationBase<FetchInstrumentati
         ): void {
           try {
             const resClone = response.clone();
-            const resClone4Hook = response.clone();
             const body = resClone.body;
             if (body) {
               const reader = body.getReader();
               const read = (): void => {
                 reader.read().then(
                   ({ done }) => {
                     if (done) {
-                      endSpanOnSuccess(span, resClone4Hook);
+                      endSpanOnSuccess(span, response);
                     } else {
                       read();
                     }

experimental/packages/opentelemetry-instrumentation-fetch/test/fetch.test.ts

@@ -930,25 +930,33 @@ describe('fetch', () => {
       };
 
       await prepare(url, applyCustomAttributes);
-      assert.ok(request.method === 'GET');
-      assert.ok(response.status === 200);
-    });
-
-    it('get response body from callback arguments response', async () => {
-      let response: any;
-      const applyCustomAttributes: FetchCustomAttributeFunction = async (
-        span,
-        req,
-        res
-      ) => {
-        if (res instanceof Response) {
-          response = res;
-        }
-      };
-
-      await prepare(url, applyCustomAttributes);
-      const rsp = await response.json();
-      assert.strictEqual(rsp.isServerResponse, true);
+      assert.strictEqual(request.method, 'GET');
+      assert.ok(lastResponse !== undefined);
+      assert.strictEqual(response, lastResponse);
+      assert.strictEqual(response.status, 200);
+
+      /*
+         Note: this confirms that nothing *in the instrumentation code*
+         consumed the response body; it doesn't guarantee that the response
+         object passed to the `applyCustomAttributes` hook will always have
+         a consumable body – in fact, this is typically *not* the case:
+
+         ```js
+         // user code:
+         let response = await fetch("foo");
+         let json = await response.json(); // <- user code consumes the body on `response`
+         // ...
+
+         {
+           // ...this is called sometime later...
+           applyCustomAttributes(span, request, response) {
+             // too late!
+             response.bodyUsed // => true
+           }
+         }
+         ```
+      */
+      assert.strictEqual(response.bodyUsed, false);
     });
   });