Skip to content

[Fizz] Finish abort in a scheduled task #36580

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
gnoff merged 1 commit into from
Jun 1, 2026
Merged

[Fizz] Finish abort in a scheduled task #36580

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 33 additions & 5 deletions packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7100,7 +7100,7 @@ describe('ReactDOMFizzServer', () => {
expect(errors).toEqual(['abort reason', 'abort reason']);
});

it('reports a root task that suspends after aborting during render', async () => {
it('reports a root task before rendering a suspended child returned after aborting', async () => {
const promise = new Promise(() => {});
function SuspendedRoot() {
use(promise);
Expand Down Expand Up @@ -7138,6 +7138,34 @@ describe('ReactDOMFizzServer', () => {
expect(errors).toEqual(['abort reason', 'abort reason']);
});

it('currently does not report a root task that suspends directly after aborting during render', async () => {
const promise = new Promise(() => {});
const abortRef = {current: null};
function ComponentThatAbortsAndSuspends() {
abortRef.current(new Error('abort reason'));
use(promise);
return null;
}

const errors = [];
await act(() => {
const {abort} = renderToPipeableStream(
<ComponentThatAbortsAndSuspends />,
{
onError(error) {
errors.push(error.message);
},
onShellError() {},
},
);
abortRef.current = abort;
});

// The task suspends before renderFunctionComponent gets to throw the
// abort reason, and retryRenderTask currently suspends it again.
expect(errors).toEqual([]);
});

it('can abort during render in a lazy initializer for a component', async () => {
function Sibling() {
return <p>sibling</p>;
Expand Down Expand Up @@ -8443,6 +8471,10 @@ describe('ReactDOMFizzServer', () => {

expect(thrownError).toBe('boom');
expect(errors).toEqual([
{
error: 'boom',
componentStack: componentStack(['Abort', 'body', 'html', 'App']),
},
{
error: 'boom',
componentStack: componentStack([
Expand All @@ -8462,10 +8494,6 @@ describe('ReactDOMFizzServer', () => {
'App',
]),
},
{
error: 'boom',
componentStack: componentStack(['Abort', 'body', 'html', 'App']),
},
]);

// We expect the render to throw before streaming anything so the default
Expand Down
18 changes: 13 additions & 5 deletions packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -221,7 +221,9 @@ describe('ReactDOMFizzServerBrowser', () => {
),
);

controller.abort();
await serverAct(() => {
controller.abort();
});

const result = await readResult(stream);
expect(result).toContain('Loading');
Expand All @@ -247,7 +249,9 @@ describe('ReactDOMFizzServerBrowser', () => {
);

const theReason = new Error('aborted for reasons');
controller.abort(theReason);
await serverAct(() => {
controller.abort(theReason);
});

let caughtError = null;
try {
Expand Down Expand Up @@ -364,7 +368,7 @@ describe('ReactDOMFizzServerBrowser', () => {

const reader = stream.getReader();
await reader.read();
await reader.cancel();
await serverAct(() => reader.cancel());

expect(errors).toEqual([
'The render was aborted by the server without a reason.',
Expand Down Expand Up @@ -463,7 +467,9 @@ describe('ReactDOMFizzServerBrowser', () => {
}),
);

controller.abort('foobar');
await serverAct(() => {
controller.abort('foobar');
});

expect(errors).toEqual(['foobar', 'foobar']);
});
Expand Down Expand Up @@ -502,7 +508,9 @@ describe('ReactDOMFizzServerBrowser', () => {
}),
);

controller.abort(new Error('uh oh'));
await serverAct(() => {
controller.abort(new Error('uh oh'));
});

expect(errors).toEqual(['uh oh', 'uh oh']);
});
Expand Down
4 changes: 4 additions & 0 deletions packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -382,6 +382,7 @@ describe('ReactDOMFizzServerNode', () => {
expect(isCompleteCalls).toBe(0);

abort(new Error('uh oh'));
await jest.runAllTimers();

await completed;

Expand Down Expand Up @@ -468,6 +469,7 @@ describe('ReactDOMFizzServerNode', () => {

const reason = new Error('abort reason');
abort(reason);
await jest.runAllTimers();

expect(shellErrors).toEqual([reason]);
expect(errors).toEqual(['abort reason', 'abort reason', 'abort reason']);
Expand Down Expand Up @@ -504,6 +506,7 @@ describe('ReactDOMFizzServerNode', () => {
expect(isCompleteCalls).toBe(0);

abort();
await jest.runAllTimers();

await completed;

Expand Down Expand Up @@ -746,6 +749,7 @@ describe('ReactDOMFizzServerNode', () => {
resolve();

await completed;
await jest.runAllTimers();

expect(errors).toEqual([
'The destination stream errored while writing data.',
Expand Down
104 changes: 90 additions & 14 deletions packages/react-dom/src/__tests__/ReactDOMFizzStaticBrowser-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -299,7 +299,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
);
});

controller.abort();
await serverAct(() => {
controller.abort();
});

const result = await resultPromise;

Expand Down Expand Up @@ -329,7 +331,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
await jest.runAllTimers();

const theReason = new Error('aborted for reasons');
controller.abort(theReason);
await serverAct(() => {
controller.abort(theReason);
});

let rejected = false;
let prelude;
Expand Down Expand Up @@ -447,7 +451,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort('foobar');
await serverAct(() => {
controller.abort('foobar');
});

await resultPromise;

Expand Down Expand Up @@ -489,13 +495,63 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort(new Error('uh oh'));
await serverAct(() => {
controller.abort(new Error('uh oh'));
});

await resultPromise;

expect(errors).toEqual(['uh oh', 'uh oh']);
});

it('currently uses the abort reason when an abort listener synchronously rejects pending work', async () => {
let reject;
const rejectedPromise = new Promise((resolve, rejectPromise) => {
reject = rejectPromise;
});
const haltedPromise = new Promise(() => {});
function RejectedWait() {
React.use(rejectedPromise);
return null;
}
function HaltedWait() {
React.use(haltedPromise);
return null;
}

const errors = [];
const controller = new AbortController();
let resultPromise;
await serverAct(() => {
resultPromise = ReactDOMFizzStatic.prerender(
<>
<Suspense fallback="Loading rejected">
<RejectedWait />
</Suspense>
<Suspense fallback="Loading halted">
<HaltedWait />
</Suspense>
</>,
{
signal: controller.signal,
onError(error) {
errors.push(error.message);
},
},
);
});

controller.signal.addEventListener('abort', () => {
reject(new Error('rejected during abort'));
});
await serverAct(() => {
controller.abort(new Error('abort reason'));
});
await resultPromise;

expect(errors).toEqual(['abort reason', 'abort reason']);
});

it('logs an error if onHeaders throws but continues the prerender', async () => {
const errors = [];
function onError(error) {
Expand Down Expand Up @@ -562,7 +618,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort();
await serverAct(() => {
controller.abort();
});
const prerendered = await pendingResult;
const postponedState = JSON.stringify(prerendered.postponed);

Expand All @@ -587,7 +645,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
);
});

controller2.abort();
await serverAct(() => {
controller2.abort();
});

const prerendered2 = await pendingResult;
const postponedState2 = JSON.stringify(prerendered2.postponed);
Expand Down Expand Up @@ -641,7 +701,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
onError() {},
});
});
controller.abort('prerender abort');
await serverAct(() => {
controller.abort('prerender abort');
});
const prerendered = await pendingResult;

prerendering = false;
Expand Down Expand Up @@ -693,7 +755,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
onError() {},
});
});
controller.abort('prerender abort');
await serverAct(() => {
controller.abort('prerender abort');
});
const prerendered = await pendingResult;

prerendering = false;
Expand Down Expand Up @@ -761,7 +825,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort();
await serverAct(() => {
controller.abort();
});

const prerendered = await pendingResult;
const postponedState = JSON.stringify(prerendered.postponed);
Expand Down Expand Up @@ -792,7 +858,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
);
});

controller2.abort();
await serverAct(() => {
controller2.abort();
});

const prerendered2 = await pendingResult;
const postponedState2 = JSON.stringify(prerendered2.postponed);
Expand Down Expand Up @@ -855,7 +923,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort(new Error('boom'));
await serverAct(() => {
controller.abort(new Error('boom'));
});

const prerendered = await pendingResult;

Expand Down Expand Up @@ -917,7 +987,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort();
await serverAct(() => {
controller.abort();
});

const prerendered = await pendingResult;

Expand Down Expand Up @@ -995,7 +1067,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
});
});

controller.abort();
await serverAct(() => {
controller.abort();
});

const prerendered = await pendingResult;
const postponedState = JSON.stringify(prerendered.postponed);
Expand All @@ -1021,7 +1095,9 @@ describe('ReactDOMFizzStaticBrowser', () => {
);
});

controller2.abort();
await serverAct(() => {
controller2.abort();
});

const prerendered2 = await pendingResult;
const postponedState2 = JSON.stringify(prerendered2.postponed);
Expand Down
Loading
Loading