Improve react 18 act support readability

callstack · Sep 21, 2022 · 32b9288 · 32b9288
1 parent bf63ab2
commit 32b9288
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 30 deletions.
diff --git a/src/act.ts b/src/act.ts
@@ -1,38 +1,27 @@
+// This file and the act() implementation is sourced from react-testing-library
+// https://github.com/testing-library/react-testing-library/blob/c80809a956b0b9f3289c4a6fa8b5e8cc72d6ef6d/src/act-compat.js
 import { act as reactTestRendererAct } from 'react-test-renderer';
-import { checkReactVersionAtLeast } from './checkReactVersionAtLeast';
+import { checkReactVersionAtLeast } from './react-versions';
 
 const actMock = (callback: () => void) => {
   callback();
 };
 
-type GlobalWithReactActEnvironment = {
-  IS_REACT_ACT_ENVIRONMENT?: boolean;
-} & typeof globalThis;
-function getGlobalThis(): GlobalWithReactActEnvironment {
-  // eslint-disable-next-line no-restricted-globals
-  if (typeof self !== 'undefined') {
-    // eslint-disable-next-line no-restricted-globals
-    return self as GlobalWithReactActEnvironment;
-  }
-  if (typeof window !== 'undefined') {
-    return window;
-  }
-  if (typeof global !== 'undefined') {
-    return global;
-  }
-
-  throw new Error('unable to locate global object');
+// See https://github.com/reactwg/react-18/discussions/102 for more context on global.IS_REACT_ACT_ENVIRONMENT
+declare global {
+  var IS_REACT_ACT_ENVIRONMENT: boolean | undefined;
 }
 
 function setIsReactActEnvironment(isReactActEnvironment: boolean | undefined) {
-  getGlobalThis().IS_REACT_ACT_ENVIRONMENT = isReactActEnvironment;
+  globalThis.IS_REACT_ACT_ENVIRONMENT = isReactActEnvironment;
 }
 
 function getIsReactActEnvironment() {
-  return getGlobalThis().IS_REACT_ACT_ENVIRONMENT;
+  return globalThis.IS_REACT_ACT_ENVIRONMENT;
 }
 
 type Act = typeof reactTestRendererAct;
+
 function withGlobalActEnvironment(actImplementation: Act) {
   return (callback: Parameters<Act>[0]) => {
     const previousActEnvironment = getIsReactActEnvironment();
@@ -47,8 +36,9 @@ function withGlobalActEnvironment(actImplementation: Act) {
         if (
           result !== null &&
           typeof result === 'object' &&
+          // @ts-expect-error this should be a promise or thenable
           // eslint-disable-next-line promise/prefer-await-to-then
-          typeof (result as any).then === 'function'
+          typeof result.then === 'function'
         ) {
           callbackNeedsToBeAwaited = true;
         }
@@ -87,12 +77,16 @@ function withGlobalActEnvironment(actImplementation: Act) {
     }
   };
 }
+const getAct = () => {
+  if (!reactTestRendererAct) {
+    return actMock;
+  }
 
-const act = reactTestRendererAct
-  ? checkReactVersionAtLeast(18, 0)
+  return checkReactVersionAtLeast(18, 0)
     ? withGlobalActEnvironment(reactTestRendererAct)
-    : reactTestRendererAct
-  : actMock;
+    : reactTestRendererAct;
+};
+const act = getAct();
 
 export default act;
 export {

diff --git a/src/checkReactVersionAtLeast.ts → src/react-versions.ts b/src/checkReactVersionAtLeast.ts → src/react-versions.ts
diff --git a/src/waitFor.ts b/src/waitFor.ts
@@ -7,7 +7,7 @@ import {
   setImmediate,
   jestFakeTimersAreEnabled,
 } from './helpers/timers';
-import { checkReactVersionAtLeast } from './checkReactVersionAtLeast';
+import { checkReactVersionAtLeast } from './react-versions';
 
 const DEFAULT_TIMEOUT = 1000;
 const DEFAULT_INTERVAL = 50;
@@ -187,10 +187,6 @@ export default async function waitFor<T>(
   const stackTraceError = new ErrorWithStack('STACK_TRACE_ERROR', waitFor);
   const optionsWithStackTrace = { stackTraceError, ...options };
 
-  if (!checkReactVersionAtLeast(16, 9)) {
-    return waitForInternal(expectation, optionsWithStackTrace);
-  }
-
   if (checkReactVersionAtLeast(18, 0)) {
     const previousActEnvironment = getIsReactActEnvironment();
     setReactActEnvironment(false);
@@ -202,6 +198,10 @@ export default async function waitFor<T>(
     }
   }
 
+  if (!checkReactVersionAtLeast(16, 9)) {
+    return waitForInternal(expectation, optionsWithStackTrace);
+  }
+
   let result: T;
 
   await act(async () => {