Repository: facebook/react
Pull request: Fix tests on main

Not sure how these broke when merging https://github.com/facebook/react/pull/28299 and https://github.com/facebook/react/pull/28361

Changed files:
filename: packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
patch: @@ -453,17 +453,17 @@ describe('ReactDOMServerPartialHydration', () => {
       // Client rendered - suspense comment nodes removed.
       expect(container.innerHTML).toBe('Hello<article>Mismatch</article>');
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'section',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'section',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -561,19 +561,19 @@ describe('ReactDOMServerPartialHydration', () => {
         '<div><article>Mismatch</article></div>',
       );
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'div',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in div (at **)\n' +
-            '    in Child (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'div',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in div (at **)\n' +
+              '    in Child (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -681,18 +681,18 @@ describe('ReactDOMServerPartialHydration', () => {
         '<div><div></div><article>Mismatch</article></div>',
       );
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'div',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in div (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'div',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in div (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -797,18 +797,18 @@ describe('ReactDOMServerPartialHydration', () => {
         '<div><article>Mismatch</article><div></div></div>',
       );
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'div',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in div (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'div',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in div (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -901,17 +901,17 @@ describe('ReactDOMServerPartialHydration', () => {
       // Client rendered - suspense comment nodes removed
       expect(container.innerHTML).toBe('<article><div></div></article>');
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'section',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'section',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -1007,17 +1007,17 @@ describe('ReactDOMServerPartialHydration', () => {
       // Client rendered - suspense comment nodes removed
       expect(container.innerHTML).toBe('<article>Mismatch</article>Hello');
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'section',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'section',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {
@@ -1117,17 +1117,17 @@ describe('ReactDOMServerPartialHydration', () => {
         '<article>Mismatch</article><div>Hello</div>',
       );
       if (__DEV__) {
-        const secondToLastCall =
-          mockError.mock.calls[mockError.mock.calls.length - 2];
-        expect(secondToLastCall).toEqual([
-          'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
-          'article',
-          'section',
-          '\n' +
-            '    in article (at **)\n' +
-            '    in Component (at **)\n' +
-            '    in Suspense (at **)\n' +
-            '    in App (at **)',
+        expect(mockError.mock.calls).toEqual([
+          [
+            'Warning: Expected server HTML to contain a matching <%s> in <%s>.%s',
+            'article',
+            'section',
+            '\n' +
+              '    in article (at **)\n' +
+              '    in Component (at **)\n' +
+              '    in Suspense (at **)\n' +
+              '    in App (at **)',
+          ],
         ]);
       }
     } finally {

filename: packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
patch: @@ -314,32 +314,30 @@ describe('ReactSuspense', () => {
     }, 290);
 
     // Render an empty shell
-    const root = ReactTestRenderer.create(<Foo />, {
-      isConcurrent: true,
-    });
-
+    const root = ReactDOMClient.createRoot(container);
+    root.render(<Foo />);
     await waitForAll(['Foo', 'Suspend! [A]', 'Loading...']);
-    expect(root).toMatchRenderedOutput('Loading...');
+    expect(container.textContent).toEqual('Loading...');
 
     // Now resolve A
     jest.advanceTimersByTime(290);
     await waitFor(['A']);
-    expect(root).toMatchRenderedOutput('Loading...');
+    expect(container.textContent).toEqual('Loading...');
 
     // B starts loading. Parent boundary is in throttle.
     // Still shows parent loading under throttle
     jest.advanceTimersByTime(10);
     await waitForAll(['Suspend! [B]', 'Loading more...']);
-    expect(root).toMatchRenderedOutput('Loading...');
+    expect(container.textContent).toEqual('Loading...');
 
     // !! B could have finished before the throttle, but we show a fallback.
     // !! Pushing out the 30ms fetch for B to 300ms.
     jest.advanceTimersByTime(300);
     await waitFor(['B']);
-    expect(root).toMatchRenderedOutput('ALoading more...');
+    expect(container.textContent).toEqual('ALoading more...');
 
     await act(() => {});
-    expect(root).toMatchRenderedOutput('AB');
+    expect(container.textContent).toEqual('AB');
   });
 
   it('does not throttle fallback committing for too long', async () => {