Revert @testing-library/jest-dom v6 upgrade (#9713)

This reverts #9673 and #9711. With v6 of `@testing-library/jest-dom`, `yarn rw type-check` fails in Redwood projects because it can't locate the types for `@testing-libary/jest-dom`. They absorbed the definitely types package (`@types/testing-library__jest-dom`) in this PR: testing-library/jest-dom#511. Here's an example of a failing run: https://github.com/redwoodjs/redwood/actions/runs/7213177056/job/19668365614?pr=9708. The logical thing to do is remove `@testing-libary/jest-dom` from the `types` array in `web/tsconfig.json`, but when we do that we get a different failure from TS saying that it doesn't understand the extended matchers provided by `testing-library/jest-dom` like `toBeInTheDocument`. @Tobbe filed an issue in their repo here testing-library/jest-dom#559. In the PR I linked to, the maintainer notes that... > But in my local testing with the changes in this PR, following the Readme was sufficient to get full auto-complete support even for JS-only users. As long as they have a jest-setup file that imports the bare export and add a dependency on @types/jest, recent versions of VS Code will figure it out. Users don't have jest setup files in their project (we just point to a jest preset) or `@types/jest` as an explicit dev dependency. I took a look at it but couldn't crack it today. Instead of holding up other PRs in CI, better to revert it for now and come back to later when we have more leads.
redwoodjs · Dec 15, 2023 · 0d1e09a · 0d1e09a
1 parent 08aae1f
commit 0d1e09a
Show file tree

Hide file tree

Showing 21 changed files with 58 additions and 48 deletions.
diff --git a/package.json b/package.json
@@ -66,7 +66,7 @@
     "@faker-js/faker": "8.0.2",
     "@npmcli/arborist": "7.2.2",
     "@playwright/test": "1.40.1",
-    "@testing-library/jest-dom": "6.1.5",
+    "@testing-library/jest-dom": "5.17.0",
     "@testing-library/react": "14.1.2",
     "@testing-library/user-event": "14.5.1",
     "@types/babel__generator": "7.6.7",

diff --git a/packages/auth/package.json b/packages/auth/package.json
@@ -29,7 +29,7 @@
   "devDependencies": {
     "@babel/cli": "7.23.4",
     "@babel/core": "^7.22.20",
-    "@testing-library/jest-dom": "6.1.5",
+    "@testing-library/jest-dom": "5.17.0",
     "@testing-library/react": "14.1.2",
     "jest": "29.7.0",
     "msw": "1.3.2",

diff --git a/packages/auth/src/__tests__/AuthProvider.test.tsx b/packages/auth/src/__tests__/AuthProvider.test.tsx
@@ -10,7 +10,7 @@ import {
   configure,
 } from '@testing-library/react'
 import { renderHook, act } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import { graphql } from 'msw'
 import { setupServer } from 'msw/node'
 

diff --git a/packages/forms/package.json b/packages/forms/package.json
@@ -31,12 +31,13 @@
     "@babel/cli": "7.23.4",
     "@babel/core": "^7.22.20",
     "@testing-library/dom": "9.3.3",
-    "@testing-library/jest-dom": "6.1.5",
+    "@testing-library/jest-dom": "5.17.0",
     "@testing-library/react": "14.1.2",
     "@testing-library/user-event": "14.5.1",
     "@types/pascalcase": "1.0.3",
     "@types/react": "18.2.37",
     "@types/react-dom": "18.2.15",
+    "@types/testing-library__jest-dom": "5.14.9",
     "graphql": "16.8.1",
     "jest": "29.7.0",
     "nodemon": "3.0.2",

diff --git a/packages/router/src/__tests__/location.test.tsx b/packages/router/src/__tests__/location.test.tsx
@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { LocationProvider, useLocation } from '../location'
 

diff --git a/packages/router/src/__tests__/nestedSets.test.tsx b/packages/router/src/__tests__/nestedSets.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import type { ReactNode } from 'react'
 
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import { act, render } from '@testing-library/react'
 
 import { navigate, Route, Router } from '../'

diff --git a/packages/router/src/__tests__/route-announcer.test.tsx b/packages/router/src/__tests__/route-announcer.test.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
 import { render, waitFor, act } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { getAnnouncement } from '../a11yUtils'
 import { navigate } from '../history'

diff --git a/packages/router/src/__tests__/route-focus.test.tsx b/packages/router/src/__tests__/route-focus.test.tsx
@@ -1,5 +1,5 @@
 import { render, waitFor } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { getFocus } from '../a11yUtils'
 import RouteFocus from '../route-focus'

diff --git a/packages/router/src/__tests__/routeScrollReset.test.tsx b/packages/router/src/__tests__/routeScrollReset.test.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import { act, cleanup, render, screen } from '@testing-library/react'
 
 import { navigate } from '../history'

diff --git a/packages/router/src/__tests__/router.test.tsx b/packages/router/src/__tests__/router.test.tsx
@@ -20,7 +20,7 @@ jest.mock('../util', () => {
 
 import React, { useEffect, useState } from 'react'
 
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import {
   act,
   configure,

diff --git a/packages/router/src/__tests__/set.test.tsx b/packages/router/src/__tests__/set.test.tsx
@@ -2,7 +2,7 @@ import * as React from 'react'
 import type { ReactNode } from 'react'
 
 import { act, render, waitFor } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { navigate } from '../history'
 import { Route, Router } from '../router'

diff --git a/packages/router/src/__tests__/setContextReuse.test.tsx b/packages/router/src/__tests__/setContextReuse.test.tsx
@@ -5,7 +5,7 @@ import { act, render, waitFor } from '@testing-library/react'
 import { Route, Router, navigate } from '../'
 import { Set } from '../Set'
 
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 const HomePage = () => {
   return <p>Home Page</p>

diff --git a/packages/testing/jest.setup.ts b/packages/testing/jest.setup.ts
@@ -1,4 +1,4 @@
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import '@testing-library/jest-dom'
 
 import { startMSW } from './src/web/mockRequests'

diff --git a/packages/testing/package.json b/packages/testing/package.json
@@ -34,7 +34,7 @@
     "@redwoodjs/project-config": "6.0.7",
     "@redwoodjs/router": "6.0.7",
     "@redwoodjs/web": "6.0.7",
-    "@testing-library/jest-dom": "6.1.5",
+    "@testing-library/jest-dom": "5.17.0",
     "@testing-library/react": "14.1.2",
     "@testing-library/user-event": "14.5.1",
     "@types/aws-lambda": "8.10.126",

diff --git a/packages/web/package.json b/packages/web/package.json
@@ -52,10 +52,11 @@
     "@apollo/experimental-nextjs-app-support": "0.5.1",
     "@babel/cli": "7.23.4",
     "@babel/core": "^7.22.20",
-    "@testing-library/jest-dom": "6.1.5",
+    "@testing-library/jest-dom": "5.17.0",
     "@testing-library/react": "14.1.2",
     "@types/react": "18.2.37",
     "@types/react-dom": "18.2.15",
+    "@types/testing-library__jest-dom": "5.14.9",
     "jest": "29.7.0",
     "nodemon": "3.0.2",
     "react": "0.0.0-experimental-e5205658f-20230913",

diff --git a/packages/web/src/components/FetchConfigProvider.test.tsx b/packages/web/src/components/FetchConfigProvider.test.tsx
@@ -7,7 +7,7 @@ import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 
 import type { AuthContextInterface } from '@redwoodjs/auth'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 globalThis.RWJS_API_GRAPHQL_URL = 'https://api.example.com/graphql'
 

diff --git a/packages/web/src/components/GraphQLHooksProvider.test.tsx b/packages/web/src/components/GraphQLHooksProvider.test.tsx
@@ -3,7 +3,7 @@
  */
 
 import { render, screen, waitFor } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import {
   GraphQLHooksProvider,

diff --git a/packages/web/src/components/cell/createCell.test.tsx b/packages/web/src/components/cell/createCell.test.tsx
@@ -3,7 +3,7 @@
  */
 
 import { render, screen } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { GraphQLHooksProvider } from '../GraphQLHooksProvider'
 

diff --git a/packages/web/src/components/cell/createSuspendingCell.test.tsx b/packages/web/src/components/cell/createSuspendingCell.test.tsx
@@ -4,7 +4,7 @@
 import type { useReadQuery, useBackgroundQuery } from '@apollo/client'
 import { loadErrorMessages, loadDevMessages } from '@apollo/client/dev'
 import { render, screen } from '@testing-library/react'
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 
 import { GraphQLHooksProvider } from '../GraphQLHooksProvider'
 

diff --git a/packages/web/src/components/portalHead.test.tsx b/packages/web/src/components/portalHead.test.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import '@testing-library/jest-dom/jest-globals'
+import '@testing-library/jest-dom/extend-expect'
 import { render } from '@testing-library/react'
 
 import PortalHead from './PortalHead'

diff --git a/yarn.lock b/yarn.lock
@@ -86,10 +86,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@adobe/css-tools@npm:^4.3.1":
-  version: 4.3.2
-  resolution: "@adobe/css-tools@npm:4.3.2"
-  checksum: 296a03dd29f227c60500d2da8c7f64991fecf1d8b456ce2b4adb8cec7363d9c08b5b03f1463673fc8cbfe54b538745588e7a13c736d2dd14a80c01a20f127f39
+"@adobe/css-tools@npm:^4.0.1":
+  version: 4.3.1
+  resolution: "@adobe/css-tools@npm:4.3.1"
+  checksum: 05672719b544cc0c21ae3ed0eb6349bf458e9d09457578eeeb07cf0f696469ac6417e9c9be1b129e5d6a18098a061c1db55b2275591760ef30a79822436fcbfa
   languageName: node
   linkType: hard
 
@@ -8668,7 +8668,7 @@ __metadata:
     "@babel/cli": 7.23.4
     "@babel/core": ^7.22.20
     "@babel/runtime-corejs3": 7.23.5
-    "@testing-library/jest-dom": 6.1.5
+    "@testing-library/jest-dom": 5.17.0
     "@testing-library/react": 14.1.2
     core-js: 3.34.0
     jest: 29.7.0
@@ -9037,12 +9037,13 @@ __metadata:
     "@babel/core": ^7.22.20
     "@babel/runtime-corejs3": 7.23.5
     "@testing-library/dom": 9.3.3
-    "@testing-library/jest-dom": 6.1.5
+    "@testing-library/jest-dom": 5.17.0
     "@testing-library/react": 14.1.2
     "@testing-library/user-event": 14.5.1
     "@types/pascalcase": 1.0.3
     "@types/react": 18.2.37
     "@types/react-dom": 18.2.15
+    "@types/testing-library__jest-dom": 5.14.9
     core-js: 3.34.0
     graphql: 16.8.1
     jest: 29.7.0
@@ -9509,7 +9510,7 @@ __metadata:
     "@redwoodjs/project-config": 6.0.7
     "@redwoodjs/router": 6.0.7
     "@redwoodjs/web": 6.0.7
-    "@testing-library/jest-dom": 6.1.5
+    "@testing-library/jest-dom": 5.17.0
     "@testing-library/react": 14.1.2
     "@testing-library/user-event": 14.5.1
     "@types/aws-lambda": 8.10.126
@@ -9618,10 +9619,11 @@ __metadata:
     "@babel/core": ^7.22.20
     "@babel/runtime-corejs3": 7.23.5
     "@redwoodjs/auth": 6.0.7
-    "@testing-library/jest-dom": 6.1.5
+    "@testing-library/jest-dom": 5.17.0
     "@testing-library/react": 14.1.2
     "@types/react": 18.2.37
     "@types/react-dom": 18.2.15
+    "@types/testing-library__jest-dom": 5.14.9
     core-js: 3.34.0
     graphql: 16.8.1
     graphql-sse: 2.4.0
@@ -11170,33 +11172,20 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@testing-library/jest-dom@npm:6.1.5":
-  version: 6.1.5
-  resolution: "@testing-library/jest-dom@npm:6.1.5"
+"@testing-library/jest-dom@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@testing-library/jest-dom@npm:5.17.0"
   dependencies:
-    "@adobe/css-tools": ^4.3.1
+    "@adobe/css-tools": ^4.0.1
     "@babel/runtime": ^7.9.2
+    "@types/testing-library__jest-dom": ^5.9.1
     aria-query: ^5.0.0
     chalk: ^3.0.0
     css.escape: ^1.5.1
     dom-accessibility-api: ^0.5.6
     lodash: ^4.17.15
     redent: ^3.0.0
-  peerDependencies:
-    "@jest/globals": ">= 28"
-    "@types/jest": ">= 28"
-    jest: ">= 28"
-    vitest: ">= 0.32"
-  peerDependenciesMeta:
-    "@jest/globals":
-      optional: true
-    "@types/jest":
-      optional: true
-    jest:
-      optional: true
-    vitest:
-      optional: true
-  checksum: f3643a56fcd970b5c7e8fd10faf3c4817d8ab0e74fb1198d726643bdc5ac675ceaac3b0068c5b4fbad254470e8f98ed50028741de875a29ceaa2f854570979c9
+  checksum: 24e09c5779ea44644945ec26f2e4e5f48aecfe57d469decf2317a3253a5db28d865c55ad0ea4818d8d1df7572a6486c45daa06fa09644a833a7dd84563881939
   languageName: node
   linkType: hard
 
@@ -11981,6 +11970,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/jest@npm:*":
+  version: 29.5.11
+  resolution: "@types/jest@npm:29.5.11"
+  dependencies:
+    expect: ^29.0.0
+    pretty-format: ^29.0.0
+  checksum: 524a3394845214581278bf4d75055927261fbeac7e1a89cd621bd0636da37d265fe0a85eac58b5778758faad1cbd7c7c361dfc190c78ebde03a91cce33463261
+  languageName: node
+  linkType: hard
+
 "@types/jest@npm:29.5.8":
   version: 29.5.8
   resolution: "@types/jest@npm:29.5.8"
@@ -12579,6 +12578,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/testing-library__jest-dom@npm:5.14.9, @types/testing-library__jest-dom@npm:^5.9.1":
+  version: 5.14.9
+  resolution: "@types/testing-library__jest-dom@npm:5.14.9"
+  dependencies:
+    "@types/jest": "*"
+  checksum: 91f7b15e8813b515912c54da44464fb60ecf21162b7cae2272fcb3918074f4e1387dc2beca1f5041667e77b76b34253c39675ea4e0b3f28f102d8cc87fdba9fa
+  languageName: node
+  linkType: hard
+
 "@types/tough-cookie@npm:*":
   version: 4.0.2
   resolution: "@types/tough-cookie@npm:4.0.2"
@@ -31800,7 +31808,7 @@ __metadata:
     "@faker-js/faker": 8.0.2
     "@npmcli/arborist": 7.2.2
     "@playwright/test": 1.40.1
-    "@testing-library/jest-dom": 6.1.5
+    "@testing-library/jest-dom": 5.17.0
     "@testing-library/react": 14.1.2
     "@testing-library/user-event": 14.5.1
     "@types/babel__generator": 7.6.7