Ensure passive effects are flushed after a suspended commit resolves

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -3278,6 +3278,9 @@ function commitRootImpl(
       // We don't schedule a separate task for flushing passive effects.
       // Instead, we just rely on ensureRootIsScheduled below to schedule
       // a callback for us to flush the passive effects.
+      // We do need to clear this callback.
+      // Otherwise, we'll still think the commit is suspended.
+      root.cancelPendingCommit = null;
     } else {
       // So we can clear these now to allow a new callback to be scheduled.
       root.callbackNode = null;

packages/react-reconciler/src/__tests__/ReactSuspenseyCommitPhase-test.js

@@ -491,4 +491,44 @@ describe('ReactSuspenseyCommitPhase', () => {
       </>,
     );
   });
+
+  it('runs passive effects after suspended commit resolves', async () => {
+    function Effect() {
+      React.useEffect(() => {
+        Scheduler.log('flush effect');
+      });
+      return <Text text="render effect" />;
+    }
+
+    const root = ReactNoop.createRoot();
+
+    await act(() => {
+      root.render(
+        <Suspense fallback={<Text text="Loading..." />}>
+          <Effect />
+          <SuspenseyImage src="A" />
+        </Suspense>,
+      );
+    });
+
+    assertLog([
+      'render effect',
+      'Image requested [A]',
+      'Loading...',
+      'render effect',
+    ]);
+    expect(root).toMatchRenderedOutput('Loading...');
+
+    await act(() => {
+      resolveSuspenseyThing('A');
+    });
+
+    assertLog(['flush effect']);
+    expect(root).toMatchRenderedOutput(
+      <>
+        {'render effect'}
+        <suspensey-thing src="A" />
+      </>,
+    );
+  });
 });