Skip to content

Commit

Permalink
Add a regression test for infinite suspense
Browse files Browse the repository at this point in the history
  • Loading branch information
tyao1 committed Nov 15, 2023
1 parent aec521a commit c6ffc00
Showing 1 changed file with 71 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -4008,4 +4008,75 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
},
);

it('recurring updates in siblings should not block expensive nodes in suspense boundary from committing', async () => {
const {useState} = React;

let setText;
function UpdatingText() {
const [text, _setText] = useState('1');
setText = _setText;
return <Text text={text} />;
}

function ExpensiveText({text, ms}) {
Scheduler.log(text);
Scheduler.unstable_advanceTime(ms);
return <span prop={text} />;
}

function App() {
return (
<>
<UpdatingText />
<Suspense fallback={<Text text="Loading..." />}>
<AsyncText text="Async" />
<ExpensiveText text="A" ms={1000} />
<ExpensiveText text="B" ms={3999} />
<ExpensiveText text="C" ms={1000000} />
</Suspense>
</>
);
}

const root = ReactNoop.createRoot();
root.render(<App />);
await waitForAll(['1', 'Suspend! [Async]', 'Loading...']);
expect(root).toMatchRenderedOutput(
<>
<span prop="1" />
<span prop="Loading..." />
</>,
);

await resolveText('Async');
expect(root).toMatchRenderedOutput(
<>
<span prop="1" />
<span prop="Loading..." />
</>,
);

await waitFor(['Async', 'A', 'B']);
ReactNoop.expire(10000);
await advanceTimers(10000);
setText('2');
await waitForPaint(['2']);

await waitFor(['Async', 'A', 'B']);
ReactNoop.expire(10000);
await advanceTimers(10000);
setText('3');

// TODO: At this point we want "C" to commit
await waitForPaint(['3']);
await waitFor(['Async', 'A', 'B']);

expect(root).toMatchRenderedOutput(
<>
<span prop="3" />
<span prop="Loading..." />
</>,
);
});
});

0 comments on commit c6ffc00

Please sign in to comment.