Skip to content

Commit

Permalink
Convert ReactDOMSuspensePlaceholder to createRoot (#28168)
Browse files Browse the repository at this point in the history
  • Loading branch information
eps1lon authored Feb 4, 2024
1 parent 3d6fcf9 commit c7bf1c2
Showing 1 changed file with 22 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@

let React;
let ReactDOM;
let ReactDOMClient;
let Suspense;
let Scheduler;
let act;
Expand All @@ -23,6 +24,7 @@ describe('ReactDOMSuspensePlaceholder', () => {
jest.resetModules();
React = require('react');
ReactDOM = require('react-dom');
ReactDOMClient = require('react-dom/client');
Scheduler = require('scheduler');
act = require('internal-test-utils').act;
Suspense = React.Suspense;
Expand Down Expand Up @@ -98,7 +100,7 @@ describe('ReactDOMSuspensePlaceholder', () => {
return text;
}

it('hides and unhides timed out DOM elements', async () => {
it('hides and unhides timed out DOM elements in legacy roots', async () => {
const divs = [
React.createRef(null),
React.createRef(null),
Expand Down Expand Up @@ -144,18 +146,22 @@ describe('ReactDOMSuspensePlaceholder', () => {
</Suspense>
);
}
ReactDOM.render(<App />, container);
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(<App />);
});

expect(container.textContent).toEqual('Loading...');

await act(async () => {
await resolveText('B');
await act(() => {
resolveText('B');
});

expect(container.textContent).toEqual('ABC');
});

it(
'outside concurrent mode, re-hides children if their display is updated ' +
'in legacy roots, re-hides children if their display is updated ' +
'but the boundary is still showing the fallback',
async () => {
const {useState} = React;
Expand Down Expand Up @@ -207,7 +213,7 @@ describe('ReactDOMSuspensePlaceholder', () => {
);

// Regression test for https://github.com/facebook/react/issues/14188
it('can call findDOMNode() in a suspended component commit phase', async () => {
it('can call findDOMNode() in a suspended component commit phase in legacy roots', async () => {
const log = [];
const Lazy = React.lazy(
() =>
Expand Down Expand Up @@ -267,7 +273,7 @@ describe('ReactDOMSuspensePlaceholder', () => {
});

// Regression test for https://github.com/facebook/react/issues/14188
it('can call findDOMNode() in a suspended component commit phase (#2)', () => {
it('can call legacy findDOMNode() in a suspended component commit phase (#2)', async () => {
let suspendOnce = Promise.resolve();
function Suspend() {
if (suspendOnce) {
Expand Down Expand Up @@ -304,9 +310,16 @@ describe('ReactDOMSuspensePlaceholder', () => {
);
}

ReactDOM.render(<App />, container);
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(<App />);
});

expect(log).toEqual(['cDM']);
ReactDOM.render(<App />, container);
await act(() => {
root.render(<App />);
});

expect(log).toEqual(['cDM', 'cDU']);
});
});

0 comments on commit c7bf1c2

Please sign in to comment.