don't auto-disable act, throw error instead

Author: phryneas

src/disableActEnvironment.ts

@@ -3,9 +3,34 @@ const dispose: typeof Symbol.dispose =
   Symbol.dispose ?? Symbol.for('nodejs.dispose')
 
 /**
- * Temporarily disable act warnings.
+ * Helper to temporarily disable a React 18+ act environment.
  *
- * https://github.com/reactwg/react-18/discussions/102
+ * This returns a disposable and can be used in combination with `using` to
+ * automatically restore the state from before this method call after your test.
+ *
+ * @example
+ * ```ts
+ * test("my test", () => {
+ *   using _disabledAct = disableActEnvironment();
+ *
+ *   // your test code here
+ *
+ *   // as soon as this scope is left, the environment will be cleaned up
+ * })
+ * ```
+ *
+ * If you can not use the explicit resouce management keyword `using`,
+ * you can also manually call `cleanup`:
+ *
+ * @example
+ * ```ts
+ * test("my test", () => {
+ *   const { cleanup } = disableActEnvironment();
+ *
+ *   // your test code here
+ *
+ *   cleanup();
+ * })
  */
 export function disableActEnvironment(): {cleanup: () => void} & Disposable {
   const anyThis = globalThis as any as {IS_REACT_ACT_ENVIRONMENT?: boolean}

src/renderStream/createRenderStream.tsx

@@ -296,11 +296,6 @@ export function createRenderStream<
     takeRender: markAssertable(async function takeRender(
       options: NextRenderOptions = {},
     ) {
-      // In many cases we do not control the resolution of the suspended
-      // promise which results in noisy tests when the profiler due to
-      // repeated act warnings.
-      const disabledAct = disableActEnvironment()
-
       let error: unknown
 
       try {
@@ -317,7 +312,6 @@ export function createRenderStream<
         if (!(error && error instanceof WaitForRenderTimeoutError)) {
           iteratorPosition++
         }
-        disabledAct.cleanup()
       }
     }, stream),
     getCurrentRender() {

src/renderWithoutAct.tsx

@@ -173,41 +173,49 @@ export function renderWithoutAct(
 function createLegacyRoot(container: ReactDOMClient.Container) {
   return {
     render(element: React.ReactNode) {
-      withDisabledActEnvironment(() =>
-        ReactDOM.render(element as unknown as React.ReactElement, container),
-      )
+      ReactDOM.render(element as unknown as React.ReactElement, container)
     },
     unmount() {
-      withDisabledActEnvironment(() =>
-        ReactDOM.unmountComponentAtNode(container),
-      )
+      ReactDOM.unmountComponentAtNode(container)
     },
   }
 }
 
 function createConcurrentRoot(container: ReactDOMClient.Container) {
-  const root = withDisabledActEnvironment(() =>
-    ReactDOMClient.createRoot(container),
-  )
+  const anyThis = globalThis as any as {IS_REACT_ACT_ENVIRONMENT?: boolean}
+  if (anyThis.IS_REACT_ACT_ENVIRONMENT) {
+    throw new Error(`Tried to create a React root for a render stream inside a React act environment.
+This is not supported. Please use \`disableActEnvironment\` to disable the act environment for this test.`)
+  }
+  const root = ReactDOMClient.createRoot(container)
 
   return {
     render(element: React.ReactNode) {
-      withDisabledActEnvironment(() => root.render(element))
+      if (anyThis.IS_REACT_ACT_ENVIRONMENT) {
+        throw new Error(`Tried to render a render stream inside a React act environment.
+    This is not supported. Please use \`disableActEnvironment\` to disable the act environment for this test.`)
+      }
+      root.render(element)
     },
     unmount() {
-      withDisabledActEnvironment(() => root.unmount())
+      root.unmount()
     },
   }
 }
 
 export function cleanup() {
-  mountedRootEntries.forEach(({root, container}) => {
-    root.unmount()
+  // there is a good chance this happens outside of a test, where the user
+  // has no control over enabling or disabling the React Act environment,
+  // so we do it for them here.
+  withDisabledActEnvironment(() => {
+    mountedRootEntries.forEach(({root, container}) => {
+      root.unmount()
 
-    if (container.parentNode === document.body) {
-      document.body.removeChild(container)
-    }
+      if (container.parentNode === document.body) {
+        document.body.removeChild(container)
+      }
+    })
+    mountedRootEntries.length = 0
+    mountedContainers.clear()
   })
-  mountedRootEntries.length = 0
-  mountedContainers.clear()
 }

src/withDisabledActEnvironment.ts

@@ -2,13 +2,13 @@ import {disableActEnvironment} from './disableActEnvironment.js'
 
 export function withDisabledActEnvironment<T>(cb: () => T): T {
   const disabledActWarnings = disableActEnvironment()
-  let result: T
+  let result: T | undefined
   try {
     result = cb()
-    return result instanceof Promise
-      ? (result.finally(disabledActWarnings.cleanup) as T)
-      : result
+    return result
   } finally {
-    disabledActWarnings.cleanup()
+    if (result != null && result instanceof Promise) {
+      void result.finally(disabledActWarnings.cleanup)
+    } else disabledActWarnings.cleanup()
   }
 }