Merge pull request #2773 from Shopify/hack-act

Use act from 'react' when possible

.changeset/flat-paws-exercise.md

@@ -0,0 +1,5 @@
+---
+'@shopify/react-testing': minor
+---
+
+Change act to use from 'react' if it exists, fallback to 'react-dom/test-utils'

packages/react-testing/src/compat.ts

@@ -1,6 +1,7 @@
 import ReactDOM from 'react-dom';
 import React from 'react';
 import type {Root as ReactRoot} from 'react-dom/client';
+import {act as oldAct} from 'react-dom/test-utils';
 
 import type {ReactInstance, Fiber} from './types';
 
@@ -38,6 +39,16 @@ export function createRoot(element: HTMLElement): ReactRoot {
 
 export const isLegacyReact = parseInt(React.version, 10) < 18;
 
+export const act: typeof oldAct = (() => {
+  try {
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const {act} = require('react');
+    return act ?? oldAct;
+  } catch {
+    return oldAct;
+  }
+})();
+
 // https://github.com/facebook/react/blob/12adaffef7105e2714f82651ea51936c563fe15c/packages/shared/enqueueTask.js#L13
 let enqueueTaskImpl: any = null;
 

packages/react-testing/src/root.tsx

@@ -1,12 +1,17 @@
 import React from 'react';
 import {flushSync} from 'react-dom';
 import type {Root as ReactRoot} from 'react-dom/client';
-import {act} from 'react-dom/test-utils';
 import {findCurrentFiberUsingSlowPath} from 'react-reconciler/reflection.js';
 
 import {TestWrapper} from './TestWrapper';
 import {Element} from './element';
-import {createRoot, getInternals, enqueueTask, isLegacyReact} from './compat';
+import {
+  createRoot,
+  getInternals,
+  enqueueTask,
+  isLegacyReact,
+  act,
+} from './compat';
 import type {
   Fiber,
   Node,