fix: reduce console.error suppressions to only while acting

src/dom/__tests__/errorHook.test.ts

@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react'
-import { renderHook } from '..'
+import { renderHook, act } from '..'
 
 describe('error hook tests', () => {
   function useError(throwError?: boolean) {
@@ -142,4 +142,51 @@ describe('error hook tests', () => {
       expect(result.error).toBe(undefined)
     })
   })
+
+  describe('error output suppression', () => {
+    test('should allow console.error to be mocked', async () => {
+      const consoleError = console.error
+      console.error = jest.fn()
+
+      try {
+        const { rerender, unmount } = renderHook(
+          (stage) => {
+            useEffect(() => {
+              console.error(`expected in effect`)
+              return () => {
+                console.error(`expected in unmount`)
+              }
+            }, [])
+            console.error(`expected in ${stage}`)
+          },
+          {
+            initialProps: 'render'
+          }
+        )
+
+        act(() => {
+          console.error('expected in act')
+        })
+
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 100))
+          console.error('expected in async act')
+        })
+
+        rerender('rerender')
+
+        unmount()
+
+        expect(console.error).toBeCalledWith('expected in render')
+        expect(console.error).toBeCalledWith('expected in effect')
+        expect(console.error).toBeCalledWith('expected in act')
+        expect(console.error).toBeCalledWith('expected in async act')
+        expect(console.error).toBeCalledWith('expected in rerender')
+        expect(console.error).toBeCalledWith('expected in unmount')
+        expect(console.error).toBeCalledTimes(6)
+      } finally {
+        console.error = consoleError
+      }
+    })
+  })
 })

src/dom/pure.ts

@@ -1,11 +1,14 @@
 import ReactDOM from 'react-dom'
-import { act } from 'react-dom/test-utils'
+import { act as baseAct } from 'react-dom/test-utils'
 
-import { RendererProps, RendererOptions } from '../types/react'
+import { RendererProps, RendererOptions, Act } from '../types/react'
 
 import { createRenderHook } from '../core'
+import { createActWrapper } from '../helpers/act'
 import { createTestHarness } from '../helpers/createTestHarness'
 
+const act = createActWrapper(baseAct)
+
 function createDomRenderer<TProps, TResult>(
   rendererProps: RendererProps<TProps, TResult>,
   { wrapper }: RendererOptions<TProps>

src/helpers/act.ts

@@ -0,0 +1,28 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unsafe-assignment */
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+import { Act } from '../types/react'
+
+import { suppressErrorOutput } from './console'
+
+function createActWrapper(baseAct: Act) {
+  const act: Act = async (callback: () => any) => {
+    const restoreOutput = suppressErrorOutput()
+    try {
+      let awaitRequired = false
+      const actResult = (baseAct(() => {
+        const callbackResult = callback()
+        awaitRequired = callbackResult !== undefined && !!callbackResult.then
+        return callbackResult
+      }) as any) as PromiseLike<undefined>
+
+      return awaitRequired ? await actResult : undefined
+    } finally {
+      restoreOutput()
+    }
+  }
+
+  return act
+}
+
+export { createActWrapper }

src/helpers/console.ts

@@ -0,0 +1,22 @@
+import filterConsole from 'filter-console'
+
+function suppressErrorOutput() {
+  // The error output from error boundaries is notoriously difficult to suppress.  To save
+  // our users from having to work it out, we crudely suppress the output matching the patterns
+  // below.  For more information, see these issues:
+  //   - https://github.com/testing-library/react-hooks-testing-library/issues/50
+  //   - https://github.com/facebook/react/issues/11098#issuecomment-412682721
+  //   - https://github.com/facebook/react/issues/15520
+  //   - https://github.com/facebook/react/issues/18841
+  return filterConsole(
+    [
+      /^The above error occurred in the <TestComponent> component:/, // error boundary output
+      /^Error: Uncaught .+/ // jsdom output
+    ],
+    {
+      methods: ['error']
+    }
+  )
+}
+
+export { suppressErrorOutput }

src/helpers/createTestHarness.tsx

@@ -1,31 +1,8 @@
 import React, { Suspense } from 'react'
 import { ErrorBoundary, FallbackProps } from 'react-error-boundary'
-import filterConsole from 'filter-console'
-
-import { addCleanup } from '../core'
 
 import { RendererProps, WrapperComponent } from '../types/react'
 
-function suppressErrorOutput() {
-  // The error output from error boundaries is notoriously difficult to suppress.  To save
-  // out users from having to work it out, we crudely suppress the output matching the patterns
-  // below.  For more information, see these issues:
-  //   - https://github.com/testing-library/react-hooks-testing-library/issues/50
-  //   - https://github.com/facebook/react/issues/11098#issuecomment-412682721
-  //   - https://github.com/facebook/react/issues/15520
-  //   - https://github.com/facebook/react/issues/18841
-  const removeConsoleFilter = filterConsole(
-    [
-      /^The above error occurred in the <TestComponent> component:/, // error boundary output
-      /^Error: Uncaught .+/ // jsdom output
-    ],
-    {
-      methods: ['error']
-    }
-  )
-  addCleanup(removeConsoleFilter)
-}
-
 function createTestHarness<TProps, TResult>(
   { callback, setValue, setError }: RendererProps<TProps, TResult>,
   Wrapper?: WrapperComponent<TProps>,
@@ -47,8 +24,6 @@ function createTestHarness<TProps, TResult>(
     return null
   }
 
-  suppressErrorOutput()
-
   const testHarness = (props?: TProps) => {
     resetErrorBoundary()
 

src/native/__tests__/errorHook.test.ts

@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react'
-import { renderHook } from '..'
+import { renderHook, act } from '..'
 
 describe('error hook tests', () => {
   function useError(throwError?: boolean) {
@@ -142,4 +142,51 @@ describe('error hook tests', () => {
       expect(result.error).toBe(undefined)
     })
   })
+
+  describe('error output suppression', () => {
+    test('should allow console.error to be mocked', async () => {
+      const consoleError = console.error
+      console.error = jest.fn()
+
+      try {
+        const { rerender, unmount } = renderHook(
+          (stage) => {
+            useEffect(() => {
+              console.error(`expected in effect`)
+              return () => {
+                console.error(`expected in unmount`)
+              }
+            }, [])
+            console.error(`expected in ${stage}`)
+          },
+          {
+            initialProps: 'render'
+          }
+        )
+
+        act(() => {
+          console.error('expected in act')
+        })
+
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 100))
+          console.error('expected in async act')
+        })
+
+        rerender('rerender')
+
+        unmount()
+
+        expect(console.error).toBeCalledWith('expected in render')
+        expect(console.error).toBeCalledWith('expected in effect')
+        expect(console.error).toBeCalledWith('expected in act')
+        expect(console.error).toBeCalledWith('expected in async act')
+        expect(console.error).toBeCalledWith('expected in rerender')
+        expect(console.error).toBeCalledWith('expected in unmount')
+        expect(console.error).toBeCalledTimes(6)
+      } finally {
+        console.error = consoleError
+      }
+    })
+  })
 })

src/native/pure.ts

@@ -1,10 +1,13 @@
-import { act, create, ReactTestRenderer } from 'react-test-renderer'
+import { act as baseAct, create, ReactTestRenderer } from 'react-test-renderer'
 
-import { RendererProps, RendererOptions } from '../types/react'
+import { RendererProps, RendererOptions, Act } from '../types/react'
 
 import { createRenderHook } from '../core'
+import { createActWrapper } from '../helpers/act'
 import { createTestHarness } from '../helpers/createTestHarness'
 
+const act = createActWrapper(baseAct)
+
 function createNativeRenderer<TProps, TResult>(
   rendererProps: RendererProps<TProps, TResult>,
   { wrapper }: RendererOptions<TProps>

src/server/__tests__/errorHook.test.ts

@@ -1,6 +1,6 @@
 import { useState, useEffect } from 'react'
 
-import { renderHook } from '..'
+import { renderHook, act } from '..'
 
 describe('error hook tests', () => {
   function useError(throwError?: boolean) {
@@ -163,4 +163,53 @@ describe('error hook tests', () => {
       expect(result.error).toBe(undefined)
     })
   })
+
+  describe('error output suppression', () => {
+    test('should allow console.error to be mocked', async () => {
+      const consoleError = console.error
+      console.error = jest.fn()
+
+      try {
+        const { hydrate, rerender, unmount } = renderHook(
+          (stage) => {
+            useEffect(() => {
+              console.error(`expected in effect`)
+              return () => {
+                console.error(`expected in unmount`)
+              }
+            }, [])
+            console.error(`expected in ${stage}`)
+          },
+          {
+            initialProps: 'render'
+          }
+        )
+
+        hydrate()
+
+        act(() => {
+          console.error('expected in act')
+        })
+
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 100))
+          console.error('expected in async act')
+        })
+
+        rerender('rerender')
+
+        unmount()
+
+        expect(console.error).toBeCalledWith('expected in render') // twice render/hydrate
+        expect(console.error).toBeCalledWith('expected in effect')
+        expect(console.error).toBeCalledWith('expected in act')
+        expect(console.error).toBeCalledWith('expected in async act')
+        expect(console.error).toBeCalledWith('expected in rerender')
+        expect(console.error).toBeCalledWith('expected in unmount')
+        expect(console.error).toBeCalledTimes(7)
+      } finally {
+        console.error = consoleError
+      }
+    })
+  })
 })

src/server/pure.ts

@@ -1,12 +1,15 @@
 import ReactDOMServer from 'react-dom/server'
 import ReactDOM from 'react-dom'
-import { act } from 'react-dom/test-utils'
+import { act as baseAct } from 'react-dom/test-utils'
 
-import { RendererProps, RendererOptions } from '../types/react'
+import { RendererProps, RendererOptions, Act } from '../types/react'
 
 import { createRenderHook } from '../core'
+import { createActWrapper } from '../helpers/act'
 import { createTestHarness } from '../helpers/createTestHarness'
 
+const act = createActWrapper(baseAct)
+
 function createServerRenderer<TProps, TResult>(
   rendererProps: RendererProps<TProps, TResult>,
   { wrapper }: RendererOptions<TProps>