[Flight] don't emit chunks for rejected thenables after abort (#31169)

When aborting we emit chunks for each pending task. However there was a
bug where a thenable could also reject before we could flush and we end
up with an extra chunk throwing off the pendingChunks bookeeping. When a
task is retried we skip it if is is not in PENDING status because we
understand it was completed some other way. We need to replciate this
for the reject pathway on serialized thenables since aborting if
effectively completing all pending tasks and not something we need to
continue to do once the thenable rejects later.

packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js

@@ -3084,4 +3084,54 @@ describe('ReactFlightDOM', () => {
       </div>,
     );
   });
+
+  it('rejecting a thenable after an abort before flush should not lead to a frozen readable', async () => {
+    const ClientComponent = clientExports(function (props: {
+      promise: Promise<void>,
+    }) {
+      return 'hello world';
+    });
+
+    let reject;
+    const promise = new Promise((_, re) => {
+      reject = re;
+    });
+
+    function App() {
+      return (
+        <div>
+          <Suspense fallback="loading...">
+            <ClientComponent promise={promise} />
+          </Suspense>
+        </div>
+      );
+    }
+
+    const errors = [];
+    const {writable, readable} = getTestStream();
+    const {pipe, abort} = await serverAct(() =>
+      ReactServerDOMServer.renderToPipeableStream(<App />, webpackMap, {
+        onError(x) {
+          errors.push(x);
+        },
+      }),
+    );
+    await serverAct(() => {
+      abort('STOP');
+      reject('STOP');
+    });
+    pipe(writable);
+
+    const reader = readable.getReader();
+    while (true) {
+      const {done} = await reader.read();
+      if (done) {
+        break;
+      }
+    }
+
+    expect(errors).toEqual(['STOP']);
+
+    // We expect it to get to the end here rather than hang on the reader.
+  });
 });

packages/react-server/src/ReactFlightServer.js

@@ -696,22 +696,27 @@ function serializeThenable(
       pingTask(request, newTask);
     },
     reason => {
-      if (
+      if (newTask.status === PENDING) {
-        enablePostpone &&
+        // We expect that the only status it might be otherwise is ABORTED.
-        typeof reason === 'object' &&
+        // When we abort we emit chunks in each pending task slot and don't need
-        reason !== null &&
+        // to do so again here.
-        (reason: any).$$typeof === REACT_POSTPONE_TYPE
+        if (
-      ) {
+          enablePostpone &&
-        const postponeInstance: Postpone = (reason: any);
+          typeof reason === 'object' &&
-        logPostpone(request, postponeInstance.message, newTask);
+          reason !== null &&
-        emitPostponeChunk(request, newTask.id, postponeInstance);
+          (reason: any).$$typeof === REACT_POSTPONE_TYPE
-      } else {
+        ) {
-        const digest = logRecoverableError(request, reason, newTask);
+          const postponeInstance: Postpone = (reason: any);
-        emitErrorChunk(request, newTask.id, digest, reason);
+          logPostpone(request, postponeInstance.message, newTask);
+          emitPostponeChunk(request, newTask.id, postponeInstance);
+        } else {
+          const digest = logRecoverableError(request, reason, newTask);
+          emitErrorChunk(request, newTask.id, digest, reason);
+        }
+        newTask.status = ERRORED;
+        request.abortableTasks.delete(newTask);
+        enqueueFlush(request);
       }
-      newTask.status = ERRORED;
-      request.abortableTasks.delete(newTask);
-      enqueueFlush(request);
     },
   );