From 718e73a09742d04e755b940d5960a0dc9eeea12a Mon Sep 17 00:00:00 2001
From: Hendrik Liebau <mail@hendrik-liebau.de>
Date: Mon, 6 May 2024 09:11:13 +0200
Subject: [PATCH] Verifying that #28996 makes this change obsolete

---
 .../src/__tests__/ReactFlight-test.js         | 72 +++++++++++++++++++
 .../react-server/src/ReactFlightServer.js     |  3 +
 2 files changed, 75 insertions(+)

diff --git a/packages/react-client/src/__tests__/ReactFlight-test.js b/packages/react-client/src/__tests__/ReactFlight-test.js
index a2e4d7af2953d..f9a1d717afbf6 100644
--- a/packages/react-client/src/__tests__/ReactFlight-test.js
+++ b/packages/react-client/src/__tests__/ReactFlight-test.js
@@ -2490,4 +2490,76 @@ describe('ReactFlight', () => {
 
     expect(ReactNoop).toMatchRenderedOutput(<span>Hello, Seb</span>);
   });
+
+  // @gate __DEV__
+  it('does not emit duplicate chunks for already outlined elements in dev mode', async () => {
+    async function Bar({text}) {
+      return text.toUpperCase();
+    }
+
+    function Foo() {
+      const bar = <Bar text="bar" />;
+
+      return (
+        <div>
+          {bar}
+          {bar}
+        </div>
+      );
+    }
+
+    const transport = ReactNoopFlightServer.render(<Foo />);
+    const textDecoder = new TextDecoder();
+
+    await act(async () => {
+      const chunks = transport
+        .map(chunk => textDecoder.decode(chunk).replace(/\n$/, ''))
+        .join('\n');
+
+      expect(chunks).toEqual(
+        `
+1:{"name":"Foo","env":"Server","owner":null}
+0:D"$1"
+3:{"name":"Bar","env":"Server","owner":null}
+2:D"$3"
+0:["$","div",null,{"children":["$L2","$2"]},null]
+2:"BAR"
+`.trim(),
+      );
+    });
+  });
+
+  // @gate !__DEV__
+  it('does not emit duplicate chunks for already outlined elements in production mode', async () => {
+    async function Bar({text}) {
+      return text.toUpperCase();
+    }
+
+    function Foo() {
+      const bar = <Bar text="bar" />;
+
+      return (
+        <div>
+          {bar}
+          {bar}
+        </div>
+      );
+    }
+
+    const transport = ReactNoopFlightServer.render(<Foo />);
+    const textDecoder = new TextDecoder();
+
+    await act(async () => {
+      const chunks = transport
+        .map(chunk => textDecoder.decode(chunk).replace(/\n$/, ''))
+        .join('\n');
+
+      expect(chunks).toEqual(
+        `
+0:["$","div",null,{"children":["$L1","$0:props:children:0"]}]
+1:"BAR"
+`.trim(),
+      );
+    });
+  });
 });
diff --git a/packages/react-server/src/ReactFlightServer.js b/packages/react-server/src/ReactFlightServer.js
index 6c3bbfb453fd4..f449aa3d203ed 100644
--- a/packages/react-server/src/ReactFlightServer.js
+++ b/packages/react-server/src/ReactFlightServer.js
@@ -1649,6 +1649,9 @@ function renderModel(
           task.implicitSlot,
           request.abortableTasks,
         );
+        // The suspended element was outlined, so we're using the same ID for the
+        // original value, thus ensuring that it's deduplicated if it's referenced again.
+        // request.writtenObjects.set((value: any), newTask.id);
         const ping = newTask.ping;
         (x: any).then(ping, ping);
         newTask.thenableState = getThenableStateAfterSuspending();