move useWithoutAct into disableActEnvironment, reduce api size

Author: phryneas

src/__tests__/renderToRenderStream.test.tsx

@@ -1,14 +1,9 @@
 /* eslint-disable @typescript-eslint/no-use-before-define */
 import {describe, test, expect} from '@jest/globals'
-import {
-  renderToRenderStream,
-  userEventWithoutAct,
-} from '@testing-library/react-render-stream'
-import {userEvent as baseUserEvent} from '@testing-library/user-event'
+import {renderToRenderStream} from '@testing-library/react-render-stream'
+import {userEvent} from '@testing-library/user-event'
 import * as React from 'react'
 
-const userEvent = userEventWithoutAct(baseUserEvent)
-
 function CounterForm({
   value,
   onIncrement,

src/disableActEnvironment.ts

@@ -1,10 +1,39 @@
+import {getConfig} from '@testing-library/dom'
+
 const dispose: typeof Symbol.dispose =
   // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
   Symbol.dispose ?? Symbol.for('nodejs.dispose')
 
+export interface DisableActEnvironmentOptions {
+  /**
+   * If `true`, all modifications of values set by `disableActEnvironment`
+   * will be prevented until `cleanup` is called.
+   *
+   * @default true
+   */
+  preventModification?: boolean
+
+  /**
+   * If `true`, will change the configuration of the testing library to
+   * prevent auto-wrapping e.g. `userEvent` calls in `act`.
+   *
+   * @default true
+   */
+  adjustTestingLibConfig?: boolean
+}
+
 /**
  * Helper to temporarily disable a React 18+ act environment.
  *
+ * By default, this also adjusts the configuration of @testing-library/dom
+ * to prevent auto-wrapping of user events in `act`, as well as preventing
+ * all modifications of values set by this method until `cleanup` is called
+ * or the returned `Disposable` is disposed of.
+ *
+ * Both of these behaviors can be disabled with the option, of the defaults
+ * can be changed for all calls to this method by modifying
+ * `disableActEnvironment.defaultOptions`.
+ *
  * 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.
  *
@@ -35,16 +64,95 @@ const dispose: typeof Symbol.dispose =
  * For more context on what `act` is and why you shouldn't use it in renderStream tests,
  * https://github.com/reactwg/react-18/discussions/102 is probably the best resource we have.
  */
-export function disableActEnvironment(): {cleanup: () => void} & Disposable {
-  const anyThis = globalThis as any as {IS_REACT_ACT_ENVIRONMENT?: boolean}
-  const prevActEnv = anyThis.IS_REACT_ACT_ENVIRONMENT
-  anyThis.IS_REACT_ACT_ENVIRONMENT = false
+export function disableActEnvironment({
+  preventModification = disableActEnvironment.defaultOptions
+    .preventModification,
+  adjustTestingLibConfig = disableActEnvironment.defaultOptions
+    .adjustTestingLibConfig,
+}: DisableActEnvironmentOptions = {}): {cleanup: () => void} & Disposable {
+  const typedGlobal = globalThis as any as {IS_REACT_ACT_ENVIRONMENT?: boolean}
+  const cleanupFns: Array<() => void> = []
+
+  // core functionality
+  {
+    const previous = typedGlobal.IS_REACT_ACT_ENVIRONMENT
+    cleanupFns.push(() => {
+      Object.defineProperty(typedGlobal, 'IS_REACT_ACT_ENVIRONMENT', {
+        value: previous,
+      })
+    })
+    Object.defineProperty(
+      typedGlobal,
+      'IS_REACT_ACT_ENVIRONMENT',
+      getNewPropertyDescriptor(false, preventModification),
+    )
+  }
+
+  if (adjustTestingLibConfig) {
+    const config = getConfig()
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    const {asyncWrapper, eventWrapper} = config
+    cleanupFns.push(() => {
+      Object.defineProperty(config, 'asyncWrapper', {value: asyncWrapper})
+      Object.defineProperty(config, 'eventWrapper', {value: eventWrapper})
+    })
+
+    Object.defineProperty(
+      config,
+      'asyncWrapper',
+      getNewPropertyDescriptor<typeof asyncWrapper>(
+        fn => fn(),
+        preventModification,
+      ),
+    )
+    Object.defineProperty(
+      config,
+      'eventWrapper',
+      getNewPropertyDescriptor<typeof eventWrapper>(
+        fn => fn(),
+        preventModification,
+      ),
+    )
+  }
 
   function cleanup() {
-    anyThis.IS_REACT_ACT_ENVIRONMENT = prevActEnv
+    while (cleanupFns.length > 0) {
+      cleanupFns.pop()!()
+    }
   }
   return {
     cleanup,
     [dispose]: cleanup,
   }
 }
+
+/**
+ * Default options for `disableActEnvironment`.
+ *
+ * This can be modified to change the default options for all calls to `disableActEnvironment`.
+ */
+disableActEnvironment.defaultOptions = {
+  preventModification: true,
+  adjustTestingLibConfig: true,
+} satisfies Required<DisableActEnvironmentOptions> as Required<DisableActEnvironmentOptions>
+
+function getNewPropertyDescriptor<T>(
+  value: T,
+  preventModification: boolean,
+): PropertyDescriptor {
+  return preventModification
+    ? {
+        configurable: true,
+        enumerable: true,
+        get() {
+          return value
+        },
+        set() {},
+      }
+    : {
+        configurable: true,
+        enumerable: true,
+        writable: true,
+        value,
+      }
+}

src/pure.ts

@@ -24,6 +24,7 @@ export {
   cleanup,
   type RenderWithoutActAsync,
 } from './renderWithoutAct.js'
-export {userEventWithoutAct} from './useWithoutAct.js'
-export {disableActEnvironment} from './disableActEnvironment.js'
-export {withDisabledActEnvironment} from './withDisabledActEnvironment.js'
+export {
+  disableActEnvironment,
+  type DisableActEnvironmentOptions,
+} from './disableActEnvironment.js'

src/renderStream/__tests__/createRenderStream.test.tsx

@@ -1,16 +1,11 @@
 /* eslint-disable @typescript-eslint/no-use-before-define */
 import {jest, describe, test, expect} from '@jest/globals'
-import {
-  createRenderStream,
-  userEventWithoutAct,
-} from '@testing-library/react-render-stream'
-import {userEvent as baseUserEvent} from '@testing-library/user-event'
+import {createRenderStream} from '@testing-library/react-render-stream'
 import * as React from 'react'
 import {ErrorBoundary} from 'react-error-boundary'
+import {userEvent} from '@testing-library/user-event'
 import {getExpectErrorMessage} from '../../__testHelpers__/getCleanedErrorMessage.js'
 
-const userEvent = userEventWithoutAct(baseUserEvent)
-
 function CounterForm({
   value,
   onIncrement,

src/renderWithoutAct.tsx

@@ -11,7 +11,10 @@ import {
 } from '@testing-library/dom'
 import React from 'react'
 import {SyncQueries} from './renderStream/syncQueries.js'
-import {withDisabledActEnvironment} from './withDisabledActEnvironment.js'
+import {
+  disableActEnvironment,
+  DisableActEnvironmentOptions,
+} from './disableActEnvironment.js'
 
 // Ideally we'd just use a WeakMap where containers are keys and roots are values.
 // We use two variables so that we can bail out in constant time when we render with a new container (most common use case)
@@ -209,7 +212,12 @@ export function cleanup() {
   // 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(() => {
+
+  const disabledAct = disableActEnvironment({
+    preventModification: false,
+    adjustTestingLibConfig: false,
+  } satisfies /* ensure that all possible options are passed here in case we add more in the future */ Required<DisableActEnvironmentOptions>)
+  try {
     mountedRootEntries.forEach(({root, container}) => {
       root.unmount()
 
@@ -219,5 +227,7 @@ export function cleanup() {
     })
     mountedRootEntries.length = 0
     mountedContainers.clear()
-  })
+  } finally {
+    disabledAct.cleanup()
+  }
 }