This PR:

- exports a new top level function cleanupAsync
- that awaits an `act(async () => {})` before unmounting containers
- and uses it in cleanup-after-each

Some possible Q&A:
- why not do the same in sync cleanup()?: if peeps are using react-testing-library already, it's suuuper unlikely they'll have hanging sync effects/updates. Decided not to add code without a good reason.
- why have a new export? why not make `cleanup()` return a promise?: that would be a breaking change, especially for people already using `cleanup()` in their tests. You could consider it for a next major.
- where are the docs for `cleanupAsync`?: I recommend not exposing this as a publicly supported api. let its usage be via cleanup-after-each. gives a little breathing room without exposing the api surface.

(bonus: fixes a lint violation in act-compat.js)

Author: threepointone

cleanup-after-each.js

@@ -1 +1 @@
-afterEach(require('./dist').cleanup)
+afterEach(() => require('./dist').cleanupAsync())

src/__tests__/render.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
-import {render, cleanup} from '../'
+import {render, cleanup, cleanupAsync} from '../'
 
 test('renders div into document', () => {
   const ref = React.createRef()
@@ -90,6 +90,27 @@ it('supports fragments', () => {
   expect(document.body.innerHTML).toBe('')
 })
 
+it('cleanupAsync does not leave any hanging microtasks', async () => {
+  const log = []
+  let ctr = 0
+  function App() {
+    async function somethingAsync() {
+      await null
+      log.push(ctr++)
+    }
+    React.useEffect(() => {
+      somethingAsync()
+    }, [])
+    return 123
+  }
+  render(<App />)
+  expect(document.body.textContent).toBe('123')
+  expect(log).toEqual([])
+  await cleanupAsync()
+  expect(log).toEqual([0])
+  expect(document.body.innerHTML).toBe('')
+})
+
 test('renders options.wrapper around node', () => {
   const WrapperComponent = ({children}) => (
     <div data-testid="wrapper">{children}</div>

src/act-compat.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
-import {reactDomSixteenPointNineIsReleased} from './react-dom-16.9.0-is-released'
 import * as testUtils from 'react-dom/test-utils'
+import {reactDomSixteenPointNineIsReleased} from './react-dom-16.9.0-is-released'
 
 const reactAct = testUtils.act
 const actSupported = reactAct !== undefined

src/index.js

@@ -88,6 +88,11 @@ function cleanup() {
   mountedContainers.forEach(cleanupAtContainer)
 }
 
+async function cleanupAsync() {
+  await asyncAct(async () => {})
+  cleanup()
+}
+
 // maybe one day we'll expose this (perhaps even as a utility returned by render).
 // but let's wait until someone asks for it.
 function cleanupAtContainer(container) {
@@ -144,7 +149,7 @@ fireEvent.select = (node, init) => {
 
 // just re-export everything from dom-testing-library
 export * from '@testing-library/dom'
-export {render, cleanup, fireEvent, act}
+export {render, cleanup, cleanupAsync, fireEvent, act}
 
 // NOTE: we're not going to export asyncAct because that's our own compatibility
 // thing for people using [email protected]. Anyone else doesn't need it and