Merge branch 'main' into improve-render-options-jsdocs

Author: eps1lon

.all-contributorsrc

@@ -1252,6 +1252,33 @@
       "contributions": [
         "test"
       ]
+    },
+    {
+      "login": "jhnns",
+      "name": "Johannes Ewald",
+      "avatar_url": "https://avatars.githubusercontent.com/u/781746?v=4",
+      "profile": "https://github.com/jhnns",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "anpaopao",
+      "name": "Angus J. Pope",
+      "avatar_url": "https://avatars.githubusercontent.com/u/44686792?v=4",
+      "profile": "https://github.com/anpaopao",
+      "contributions": [
+        "doc"
+      ]
+    },
+    {
+      "login": "leschdom",
+      "name": "Dominik Lesch",
+      "avatar_url": "https://avatars.githubusercontent.com/u/62334278?v=4",
+      "profile": "https://github.com/leschdom",
+      "contributions": [
+        "doc"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.codesandbox/ci.json

@@ -1,3 +1,4 @@
 {
-  "sandboxes": ["new", "github/kentcdodds/react-testing-library-examples"]
+  "sandboxes": ["new", "github/kentcdodds/react-testing-library-examples"],
+  "node": "12"
 }

.github/PULL_REQUEST_TEMPLATE.md

@@ -37,7 +37,7 @@ merge of your pull request!
 - [ ] Documentation added to the
       [docs site](https://github.com/testing-library/testing-library-docs)
 - [ ] Tests
-- [ ] Typescript definitions updated
+- [ ] TypeScript definitions updated
 - [ ] Ready to be merged
       <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->
 

.github/workflows/validate.yml

@@ -17,7 +17,7 @@ jobs:
     if: ${{ !contains(github.head_ref, 'all-contributors') }}
     strategy:
       matrix:
-        node: [10.13, 12, 14, 15, 16]
+        node: [12, 14, 16]
         react: [latest, next, experimental]
     runs-on: ubuntu-latest
     steps:

CONTRIBUTING.md

@@ -35,11 +35,11 @@ sure to include those changes (if they exist) in your commit.
 ### Update Typings
 
 If your PR introduced some changes in the API, you are more than welcome to
-modify the Typescript type definition to reflect those changes. Just modify the
-`/types/index.d.ts` file accordingly. If you have never seen Typescript
+modify the TypeScript type definition to reflect those changes. Just modify the
+`/types/index.d.ts` file accordingly. If you have never seen TypeScript
 definitions before, you can read more about it in its
 [documentation pages](https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html).
-Though this library itself is not written in Typescript we use
+Though this library itself is not written in TypeScript we use
 [dtslint](https://github.com/microsoft/dtslint) to lint our typings.
 
 ## Help needed
@@ -50,6 +50,5 @@ Also, please watch the repo and respond to questions/bug reports/feature
 requests! Thanks!
 
 [egghead]:
-  https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github
-[all-contributors]: https://github.com/all-contributors/all-contributors
+  https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github
 [issues]: https://github.com/testing-library/react-testing-library/issues

README.md

@@ -607,6 +607,9 @@ Thanks goes to these people ([emoji key][emojis]):
     <td align="center"><a href="https://github.com/sanchit121"><img src="https://avatars2.githubusercontent.com/u/30828115?v=4?s=100" width="100px;" alt=""/><br /><sub><b>sanchit121</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Asanchit121" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=sanchit121" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/solufa"><img src="https://avatars.githubusercontent.com/u/9402912?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Solufa</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Asolufa" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=solufa" title="Code">💻</a></td>
     <td align="center"><a href="https://codepen.io/ariperkkio/"><img src="https://avatars.githubusercontent.com/u/14806298?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Ari Perkkiö</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=AriPerkkio" title="Tests">⚠️</a></td>
+    <td align="center"><a href="https://github.com/jhnns"><img src="https://avatars.githubusercontent.com/u/781746?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Johannes Ewald</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jhnns" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/anpaopao"><img src="https://avatars.githubusercontent.com/u/44686792?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Angus J. Pope</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=anpaopao" title="Documentation">📖</a></td>
+    <td align="center"><a href="https://github.com/leschdom"><img src="https://avatars.githubusercontent.com/u/62334278?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Dominik Lesch</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=leschdom" title="Documentation">📖</a></td>
   </tr>
 </table>
 

package.json

@@ -6,7 +6,7 @@
   "types": "types/index.d.ts",
   "module": "dist/@testing-library/react.esm.js",
   "engines": {
-    "node": ">=10"
+    "node": ">=12"
   },
   "scripts": {
     "prebuild": "rimraf dist",
@@ -44,13 +44,13 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.12.5",
-    "@testing-library/dom": "^7.28.1"
+    "@testing-library/dom": "^8.0.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.11.6",
     "@types/react-dom": "^17.0.0",
     "dotenv-cli": "^4.0.0",
-    "kcd-scripts": "^7.5.1",
+    "kcd-scripts": "^11.1.0",
     "npm-run-all": "^4.1.5",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
@@ -68,7 +68,10 @@
       "react/no-adjacent-inline-elements": "off",
       "import/no-unassigned-import": "off",
       "import/named": "off",
-      "testing-library/no-dom-import": "off"
+      "testing-library/no-container": "off",
+      "testing-library/no-dom-import": "off",
+      "testing-library/no-unnecessary-act": "off",
+      "testing-library/prefer-user-event": "off"
     }
   },
   "eslintIgnore": [

src/__tests__/cleanup.js

@@ -54,15 +54,16 @@ describe('fake timers and missing act warnings', () => {
     jest.useRealTimers()
   })
 
-  test('cleanup does not flush immediates', () => {
+  test('cleanup does not flush microtasks', () => {
     const microTaskSpy = jest.fn()
     function Test() {
       const counter = 1
       const [, setDeferredCounter] = React.useState(null)
       React.useEffect(() => {
         let cancelled = false
-        setImmediate(() => {
+        Promise.resolve().then(() => {
           microTaskSpy()
+          // eslint-disable-next-line jest/no-if -- false positive
           if (!cancelled) {
             setDeferredCounter(counter)
           }
@@ -82,7 +83,10 @@ describe('fake timers and missing act warnings', () => {
     expect(microTaskSpy).toHaveBeenCalledTimes(0)
     // console.error is mocked
     // eslint-disable-next-line no-console
-    expect(console.error).toHaveBeenCalledTimes(0)
+    expect(console.error).toHaveBeenCalledTimes(
+      // ReactDOM.render is deprecated in React 18
+      React.version.startsWith('18') ? 1 : 0,
+    )
   })
 
   test('cleanup does not swallow missing act warnings', () => {
@@ -92,12 +96,12 @@ describe('fake timers and missing act warnings', () => {
       const [, setDeferredCounter] = React.useState(null)
       React.useEffect(() => {
         let cancelled = false
-        setImmediate(() => {
+        setTimeout(() => {
           deferredStateUpdateSpy()
           if (!cancelled) {
             setDeferredCounter(counter)
           }
-        })
+        }, 0)
 
         return () => {
           cancelled = true
@@ -108,16 +112,22 @@ describe('fake timers and missing act warnings', () => {
     }
     render(<Test />)
 
-    jest.runAllImmediates()
+    jest.runAllTimers()
     cleanup()
 
     expect(deferredStateUpdateSpy).toHaveBeenCalledTimes(1)
     // console.error is mocked
     // eslint-disable-next-line no-console
-    expect(console.error).toHaveBeenCalledTimes(1)
-    // eslint-disable-next-line no-console
-    expect(console.error.mock.calls[0][0]).toMatch(
-      'a test was not wrapped in act(...)',
+    expect(console.error).toHaveBeenCalledTimes(
+      // ReactDOM.render is deprecated in React 18
+      React.version.startsWith('18') ? 2 : 1,
     )
+    // eslint-disable-next-line no-console
+    expect(
+      console.error.mock.calls[
+        // ReactDOM.render is deprecated in React 18
+        React.version.startsWith('18') ? 1 : 0
+      ][0],
+    ).toMatch('a test was not wrapped in act(...)')
   })
 })

src/__tests__/debug.js

@@ -43,8 +43,8 @@ test('allows same arguments as prettyDOM', () => {
   expect(console.log).toHaveBeenCalledTimes(1)
   expect(console.log.mock.calls[0]).toMatchInlineSnapshot(`
     Array [
-      "<div>
-    ...",
+      <div>
+    ...,
     ]
   `)
 })

src/__tests__/new-act.js

@@ -1,4 +1,4 @@
-let asyncAct
+let asyncAct, consoleErrorMock
 
 jest.mock('react-dom/test-utils', () => ({
   act: cb => {
@@ -9,11 +9,11 @@ jest.mock('react-dom/test-utils', () => ({
 beforeEach(() => {
   jest.resetModules()
   asyncAct = require('../act-compat').asyncAct
-  jest.spyOn(console, 'error').mockImplementation(() => {})
+  consoleErrorMock = jest.spyOn(console, 'error').mockImplementation(() => {})
 })
 
 afterEach(() => {
-  console.error.mockRestore()
+  consoleErrorMock.mockRestore()
 })
 
 test('async act works when it does not exist (older versions of react)', async () => {
@@ -49,7 +49,7 @@ test('async act recovers from errors', async () => {
   expect(console.error.mock.calls).toMatchInlineSnapshot(`
     Array [
       Array [
-        "call console.error",
+        call console.error,
       ],
     ]
   `)
@@ -67,7 +67,7 @@ test('async act recovers from sync errors', async () => {
   expect(console.error.mock.calls).toMatchInlineSnapshot(`
     Array [
       Array [
-        "call console.error",
+        call console.error,
       ],
     ]
   `)

src/__tests__/no-act.js

@@ -1,14 +1,15 @@
-let act, asyncAct
+let act, asyncAct, React, consoleErrorMock
 
 beforeEach(() => {
   jest.resetModules()
-  act = require('..').act
+  act = require('../pure').act
   asyncAct = require('../act-compat').asyncAct
-  jest.spyOn(console, 'error').mockImplementation(() => {})
+  React = require('react')
+  consoleErrorMock = jest.spyOn(console, 'error').mockImplementation(() => {})
 })
 
 afterEach(() => {
-  console.error.mockRestore()
+  consoleErrorMock.mockRestore()
 })
 
 jest.mock('react-dom/test-utils', () => ({}))
@@ -17,7 +18,10 @@ test('act works even when there is no act from test utils', () => {
   const callback = jest.fn()
   act(callback)
   expect(callback).toHaveBeenCalledTimes(1)
-  expect(console.error).toHaveBeenCalledTimes(0)
+  expect(console.error).toHaveBeenCalledTimes(
+    // ReactDOM.render is deprecated in React 18
+    React.version.startsWith('18') ? 1 : 0,
+  )
 })
 
 test('async act works when it does not exist (older versions of react)', async () => {
@@ -26,7 +30,10 @@ test('async act works when it does not exist (older versions of react)', async (
     await Promise.resolve()
     await callback()
   })
-  expect(console.error).toHaveBeenCalledTimes(0)
+  expect(console.error).toHaveBeenCalledTimes(
+    // ReactDOM.render is deprecated in React 18
+    React.version.startsWith('18') ? 2 : 0,
+  )
   expect(callback).toHaveBeenCalledTimes(1)
 
   callback.mockClear()
@@ -36,7 +43,10 @@ test('async act works when it does not exist (older versions of react)', async (
     await Promise.resolve()
     await callback()
   })
-  expect(console.error).toHaveBeenCalledTimes(0)
+  expect(console.error).toHaveBeenCalledTimes(
+    // ReactDOM.render is deprecated in React 18
+    React.version.startsWith('18') ? 2 : 0,
+  )
   expect(callback).toHaveBeenCalledTimes(1)
 })
 
@@ -49,14 +59,16 @@ test('async act recovers from errors', async () => {
   } catch (err) {
     console.error('call console.error')
   }
-  expect(console.error).toHaveBeenCalledTimes(1)
-  expect(console.error.mock.calls).toMatchInlineSnapshot(`
-    Array [
-      Array [
-        "call console.error",
-      ],
-    ]
-  `)
+  expect(console.error).toHaveBeenCalledTimes(
+    // ReactDOM.render is deprecated in React 18
+    React.version.startsWith('18') ? 2 : 1,
+  )
+  expect(
+    console.error.mock.calls[
+      // ReactDOM.render is deprecated in React 18
+      React.version.startsWith('18') ? 1 : 0
+    ][0],
+  ).toMatch('call console.error')
 })
 
 test('async act recovers from sync errors', async () => {
@@ -71,7 +83,7 @@ test('async act recovers from sync errors', async () => {
   expect(console.error.mock.calls).toMatchInlineSnapshot(`
     Array [
       Array [
-        "call console.error",
+        call console.error,
       ],
     ]
   `)