Codemod act -> await act (4/?)

Similar to the rationale for `waitFor` (see #26285), we should always
await the result of an `act` call so that microtasks have a chance to
fire.

This only affects the internal `act` that we use in our repo, for now.
In the public `act` API, we don't yet require this; however, we
effectively will for any update that triggers suspense once `use` lands.
So we likely will start warning in an upcoming minor.

Author: acdlite

packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js

@@ -984,7 +984,7 @@ describe('ReactHooksInspectionIntegration', () => {
       children: ['count: ', '1'],
     });
 
-    act(incrementCount);
+    await act(async () => incrementCount());
     expect(renderer.toJSON()).toEqual({
       type: 'div',
       props: {},

packages/react-dom/src/__tests__/utils/ReactDOMServerIntegrationTestUtils.js

@@ -48,21 +48,16 @@ module.exports = function (initModules) {
   // ====================================
 
   // promisified version of ReactDOM.render()
-  function asyncReactDOMRender(reactElement, domElement, forceHydrate) {
-    return new Promise(resolve => {
-      if (forceHydrate) {
-        act(() => {
-          ReactDOM.hydrate(reactElement, domElement);
-        });
-      } else {
-        act(() => {
-          ReactDOM.render(reactElement, domElement);
-        });
-      }
-      // We can't use the callback for resolution because that will not catch
-      // errors. They're thrown.
-      resolve();
-    });
+  async function asyncReactDOMRender(reactElement, domElement, forceHydrate) {
+    if (forceHydrate) {
+      await act(async () => {
+        ReactDOM.hydrate(reactElement, domElement);
+      });
+    } else {
+      await act(async () => {
+        ReactDOM.render(reactElement, domElement);
+      });
+    }
   }
   // performs fn asynchronously and expects count errors logged to console.error.
   // will fail the test if the count of errors logged is not equal to count.

packages/react-dom/src/events/__tests__/DOMPluginEventSystem-test.internal.js

@@ -2520,7 +2520,7 @@ describe('DOMPluginEventSystem', () => {
           });
 
           // @gate www
-          it('beforeblur and afterblur are called after a focused element is suspended', () => {
+          it('beforeblur and afterblur are called after a focused element is suspended', async () => {
             const log = [];
             // We have to persist here because we want to read relatedTarget later.
             const onAfterBlur = jest.fn(e => {
@@ -2575,7 +2575,7 @@ describe('DOMPluginEventSystem', () => {
 
             const root = ReactDOMClient.createRoot(container2);
 
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });
             jest.runAllTimers();
@@ -2587,7 +2587,7 @@ describe('DOMPluginEventSystem', () => {
             expect(onAfterBlur).toHaveBeenCalledTimes(0);
 
             suspend = true;
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });
             jest.runAllTimers();
@@ -2604,7 +2604,7 @@ describe('DOMPluginEventSystem', () => {
           });
 
           // @gate www
-          it('beforeblur should skip handlers from a deleted subtree after the focused element is suspended', () => {
+          it('beforeblur should skip handlers from a deleted subtree after the focused element is suspended', async () => {
             const onBeforeBlur = jest.fn();
             const innerRef = React.createRef();
             const innerRef2 = React.createRef();
@@ -2661,7 +2661,7 @@ describe('DOMPluginEventSystem', () => {
 
             const root = ReactDOMClient.createRoot(container2);
 
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });
             jest.runAllTimers();
@@ -2672,7 +2672,7 @@ describe('DOMPluginEventSystem', () => {
             expect(onBeforeBlur).toHaveBeenCalledTimes(0);
 
             suspend = true;
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });
             jest.runAllTimers();
@@ -2684,17 +2684,17 @@ describe('DOMPluginEventSystem', () => {
           });
 
           // @gate www
-          it('regression: does not fire beforeblur/afterblur if target is already hidden', () => {
+          it('regression: does not fire beforeblur/afterblur if target is already hidden', async () => {
             const Suspense = React.Suspense;
             let suspend = false;
-            const promise = Promise.resolve();
+            const fakePromise = {then() {}};
             const setBeforeBlurHandle =
               ReactDOM.unstable_createEventHandle('beforeblur');
             const innerRef = React.createRef();
 
             function Child() {
               if (suspend) {
-                throw promise;
+                throw fakePromise;
               }
               return <input ref={innerRef} />;
             }
@@ -2726,7 +2726,7 @@ describe('DOMPluginEventSystem', () => {
             document.body.appendChild(container2);
 
             const root = ReactDOMClient.createRoot(container2);
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });
 
@@ -2737,7 +2737,7 @@ describe('DOMPluginEventSystem', () => {
 
             // Suspend. This hides the input node, causing it to lose focus.
             suspend = true;
-            act(() => {
+            await act(async () => {
               root.render(<Component />);
             });