Apply codemod to all

Author: eps1lon

src/__tests__/auto-cleanup-skip.js

@@ -9,8 +9,8 @@ beforeAll(() => {
 
 // This one verifies that if RTL_SKIP_AUTO_CLEANUP is set
 // then we DON'T auto-wire up the afterEach for folks
-test('first', () => {
-  render(<div>hi</div>)
+test('first', async () => {
+  await render(<div>hi</div>)
 })
 
 test('second', () => {

src/__tests__/auto-cleanup.js

@@ -4,8 +4,8 @@ import {render} from '../'
 // This just verifies that by importing RTL in an
 // environment which supports afterEach (like jest)
 // we'll get automatic cleanup between tests.
-test('first', () => {
-  render(<div>hi</div>)
+test('first', async () => {
+  await render(<div>hi</div>)
 })
 
 test('second', () => {

src/__tests__/cleanup.js

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import {render, cleanup} from '../'
 
-test('cleans up the document', () => {
+test('cleans up the document', async () => {
   const spy = jest.fn()
   const divId = 'my-div'
 
@@ -16,18 +16,18 @@ test('cleans up the document', () => {
     }
   }
 
-  render(<Test />)
-  cleanup()
+  await render(<Test />)
+  await cleanup()
   expect(document.body).toBeEmptyDOMElement()
   expect(spy).toHaveBeenCalledTimes(1)
 })
 
-test('cleanup does not error when an element is not a child', () => {
-  render(<div />, {container: document.createElement('div')})
-  cleanup()
+test('cleanup does not error when an element is not a child', async () => {
+  await render(<div />, {container: document.createElement('div')})
+  await cleanup()
 })
 
-test('cleanup runs effect cleanup functions', () => {
+test('cleanup runs effect cleanup functions', async () => {
   const spy = jest.fn()
 
   const Test = () => {
@@ -36,8 +36,8 @@ test('cleanup runs effect cleanup functions', () => {
     return null
   }
 
-  render(<Test />)
-  cleanup()
+  await render(<Test />)
+  await cleanup()
   expect(spy).toHaveBeenCalledTimes(1)
 })
 
@@ -55,7 +55,7 @@ describe('fake timers and missing act warnings', () => {
     jest.useRealTimers()
   })
 
-  test('cleanup does not flush microtasks', () => {
+  test('cleanup does not flush microtasks', async () => {
     const microTaskSpy = jest.fn()
     function Test() {
       const counter = 1
@@ -77,17 +77,17 @@ describe('fake timers and missing act warnings', () => {
 
       return null
     }
-    render(<Test />)
+    await render(<Test />)
 
-    cleanup()
+    await cleanup()
 
     expect(microTaskSpy).toHaveBeenCalledTimes(0)
     // console.error is mocked
     // eslint-disable-next-line no-console
     expect(console.error).toHaveBeenCalledTimes(0)
   })
 
-  test('cleanup does not swallow missing act warnings', () => {
+  test('cleanup does not swallow missing act warnings', async () => {
     const deferredStateUpdateSpy = jest.fn()
     function Test() {
       const counter = 1
@@ -109,10 +109,10 @@ describe('fake timers and missing act warnings', () => {
 
       return null
     }
-    render(<Test />)
+    await render(<Test />)
 
     jest.runAllTimers()
-    cleanup()
+    await cleanup()
 
     expect(deferredStateUpdateSpy).toHaveBeenCalledTimes(1)
     // console.error is mocked

src/__tests__/debug.js

@@ -9,24 +9,24 @@ afterEach(() => {
   console.log.mockRestore()
 })
 
-test('debug pretty prints the container', () => {
+test('debug pretty prints the container', async () => {
   const HelloWorld = () => <h1>Hello World</h1>
-  const {debug} = render(<HelloWorld />)
+  const {debug} = await render(<HelloWorld />)
   debug()
   expect(console.log).toHaveBeenCalledTimes(1)
   expect(console.log).toHaveBeenCalledWith(
     expect.stringContaining('Hello World'),
   )
 })
 
-test('debug pretty prints multiple containers', () => {
+test('debug pretty prints multiple containers', async () => {
   const HelloWorld = () => (
     <>
       <h1 data-testid="testId">Hello World</h1>
       <h1 data-testid="testId">Hello World</h1>
     </>
   )
-  const {debug} = render(<HelloWorld />)
+  const {debug} = await render(<HelloWorld />)
   const multipleElements = screen.getAllByTestId('testId')
   debug(multipleElements)
 
@@ -36,9 +36,9 @@ test('debug pretty prints multiple containers', () => {
   )
 })
 
-test('allows same arguments as prettyDOM', () => {
+test('allows same arguments as prettyDOM', async () => {
   const HelloWorld = () => <h1>Hello World</h1>
-  const {debug, container} = render(<HelloWorld />)
+  const {debug, container} = await render(<HelloWorld />)
   debug(container, 6, {highlight: false})
   expect(console.log).toHaveBeenCalledTimes(1)
   expect(console.log.mock.calls[0]).toMatchInlineSnapshot(`

src/__tests__/end-to-end.js

@@ -53,21 +53,21 @@ describe.each([
     }
 
     test('waitForElementToBeRemoved', async () => {
-      render(<ComponentWithMacrotaskLoader />)
+      await render(<ComponentWithMacrotaskLoader />)
       const loading = () => screen.getByText('Loading...')
       await waitForElementToBeRemoved(loading)
       expect(screen.getByTestId('message')).toHaveTextContent(/Hello World/)
     })
 
     test('waitFor', async () => {
-      render(<ComponentWithMacrotaskLoader />)
+      await render(<ComponentWithMacrotaskLoader />)
       await waitFor(() => screen.getByText(/Loading../))
       await waitFor(() => screen.getByText(/Loaded this message:/))
       expect(screen.getByTestId('message')).toHaveTextContent(/Hello World/)
     })
 
     test('findBy', async () => {
-      render(<ComponentWithMacrotaskLoader />)
+      await render(<ComponentWithMacrotaskLoader />)
       await expect(screen.findByTestId('message')).resolves.toHaveTextContent(
         /Hello World/,
       )
@@ -137,14 +137,14 @@ describe.each([
     }
 
     test('waitForElementToBeRemoved', async () => {
-      render(<ComponentWithMicrotaskLoader />)
+      await render(<ComponentWithMicrotaskLoader />)
       const loading = () => screen.getByText('Loading..')
       await waitForElementToBeRemoved(loading)
       expect(screen.getByTestId('message')).toHaveTextContent(/Hello World/)
     })
 
     test('waitFor', async () => {
-      render(<ComponentWithMicrotaskLoader />)
+      await render(<ComponentWithMicrotaskLoader />)
       await waitFor(() => {
         screen.getByText('Loading..')
       })
@@ -155,7 +155,7 @@ describe.each([
     })
 
     test('findBy', async () => {
-      render(<ComponentWithMicrotaskLoader />)
+      await render(<ComponentWithMicrotaskLoader />)
       await expect(screen.findByTestId('message')).resolves.toHaveTextContent(
         /Hello World/,
       )

src/__tests__/events.js

@@ -151,18 +151,16 @@ eventTypes.forEach(({type, events, elementType, init}) => {
         1,
       )}`
 
-      it(`triggers ${propName}`, () => {
+      it(`triggers ${propName}`, async () => {
         const ref = React.createRef()
         const spy = jest.fn()
 
-        render(
-          React.createElement(elementType, {
-            [propName]: spy,
-            ref,
-          }),
-        )
+        await render(React.createElement(elementType, {
+          [propName]: spy,
+          ref,
+        }))
 
-        fireEvent[eventName](ref.current, init)
+        await fireEvent[eventName](ref.current, init)
         expect(spy).toHaveBeenCalledTimes(1)
       })
     })
@@ -179,7 +177,7 @@ eventTypes.forEach(({type, events, elementType, init}) => {
         nativeEventName = 'dblclick'
       }
 
-      it(`triggers native ${nativeEventName}`, () => {
+      it(`triggers native ${nativeEventName}`, async () => {
         const ref = React.createRef()
         const spy = jest.fn()
         const Element = elementType
@@ -195,59 +193,54 @@ eventTypes.forEach(({type, events, elementType, init}) => {
           return <Element ref={ref} />
         }
 
-        render(<NativeEventElement />)
+        await render(<NativeEventElement />)
 
-        fireEvent[eventName](ref.current, init)
+        await fireEvent[eventName](ref.current, init)
         expect(spy).toHaveBeenCalledTimes(1)
       })
     })
   })
 })
 
-test('onChange works', () => {
+test('onChange works', async () => {
   const handleChange = jest.fn()
   const {
     container: {firstChild: input},
-  } = render(<input onChange={handleChange} />)
-  fireEvent.change(input, {target: {value: 'a'}})
+  } = await render(<input onChange={handleChange} />)
+  await fireEvent.change(input, {target: {value: 'a'}})
   expect(handleChange).toHaveBeenCalledTimes(1)
 })
 
-test('calling `fireEvent` directly works too', () => {
+test('calling `fireEvent` directly works too', async () => {
   const handleEvent = jest.fn()
   const {
     container: {firstChild: button},
-  } = render(<button onClick={handleEvent} />)
-  fireEvent(
-    button,
-    new Event('MouseEvent', {
-      bubbles: true,
-      cancelable: true,
-      button: 0,
-    }),
-  )
+  } = await render(<button onClick={handleEvent} />)
+  await fireEvent(button, new Event('MouseEvent', {
+    bubbles: true,
+    cancelable: true,
+    button: 0,
+  }))
 })
 
-test('blur/focus bubbles in react', () => {
+test('blur/focus bubbles in react', async () => {
   const handleBlur = jest.fn()
   const handleBubbledBlur = jest.fn()
   const handleFocus = jest.fn()
   const handleBubbledFocus = jest.fn()
-  const {container} = render(
-    <div onBlur={handleBubbledBlur} onFocus={handleBubbledFocus}>
-      <button onBlur={handleBlur} onFocus={handleFocus} />
-    </div>,
-  )
+  const {container} = await render(<div onBlur={handleBubbledBlur} onFocus={handleBubbledFocus}>
+    <button onBlur={handleBlur} onFocus={handleFocus} />
+  </div>)
   const button = container.firstChild.firstChild
 
-  fireEvent.focus(button)
+  await fireEvent.focus(button)
 
   expect(handleBlur).toHaveBeenCalledTimes(0)
   expect(handleBubbledBlur).toHaveBeenCalledTimes(0)
   expect(handleFocus).toHaveBeenCalledTimes(1)
   expect(handleBubbledFocus).toHaveBeenCalledTimes(1)
 
-  fireEvent.blur(button)
+  await fireEvent.blur(button)
 
   expect(handleBlur).toHaveBeenCalledTimes(1)
   expect(handleBubbledBlur).toHaveBeenCalledTimes(1)

src/__tests__/multi-base.js

@@ -15,11 +15,11 @@ afterAll(() => {
   treeB.parentNode.removeChild(treeB)
 })
 
-test('baseElement isolates trees from one another', () => {
-  const {getByText: getByTextInA} = render(<div>Jekyll</div>, {
+test('baseElement isolates trees from one another', async () => {
+  const {getByText: getByTextInA} = await render(<div>Jekyll</div>, {
     baseElement: treeA,
   })
-  const {getByText: getByTextInB} = render(<div>Hyde</div>, {
+  const {getByText: getByTextInB} = await render(<div>Hyde</div>, {
     baseElement: treeB,
   })