`"types": ["jest", "@testing-library/jest-dom"]` not working after v6 upgrade

[Tobbe Lundberg]

• @testing-library/jest-dom version: 6.1.5
• node version: 18.19.0
• jest (or vitest) version: jest 29.7.0
• npm (or yarn) version: yarn 3.7.0

Relevant code or config:

part of tsconfig

    "typeRoots": ["../node_modules/@types", "./node_modules/@types"],
    "types": ["jest", "@testing-library/jest-dom"],

And package.json

  "devDependencies": {
    "@testing-library/jest-dom": "^6.1.5",
  }

Also tried with adding "@types/jest": "^29.5.11", but no difference

What you did:

We upgraded from v5.17.0 to v6.1.5

What happened:

Get the following error

❯ yarn tsc --noEmit --skipLibCheck
error TS2688: Cannot find type definition file for '@testing-library/jest-dom'.
  The file is in the program because:
    Entry point of type library '@testing-library/jest-dom' specified in compilerOptions

  tsconfig.json:29:23
    29     "types": ["jest", "@testing-library/jest-dom"],
                             ~~~~~~~~~~~~~~~~~~~~~~~~~~~
    File is entry point of type library specified here.


Found 1 error.

Reproduction:

npx -y create-redwood-app@canary -y ~/tmp/rw-jest-dom
cd web
yarn tsc --noEmit --skipLibCheck

Problem description:

Or CI is failing, blocking more PRs getting merged.

Suggested solution:

Not a solution really, but more of a workaround.

Update tsconfig to remove "@testing-library/jest-dom"

    "typeRoots": ["../node_modules/@types", "./node_modules/@types"],
    "types": ["jest"],

Now I get

❯ yarn tsc --noEmit --skipLibCheck
src/lib/formatters.test.tsx:175:42 - error TS2339: Property 'toBeChecked' does not exist on type 'JestMatchers<any>'.

175     expect(screen.getByRole('checkbox')).toBeChecked()
                                             ~~~~~~~~~~~

But if I now go into the test file and add

import '@testing-library/jest-dom'

Then all works.
But we didn't have to do that before, so why do we need to now?

[Tobbe Lundberg]

Specifying a full path to @testling-library/jest-dom works. But obviously doesn't scale very well 😀

[Tobbe Lundberg]

Figured out how to configure it!

and as text for easier searching

"typeRoots": ["../node_modules/@types", "./node_modules/@types", "../node_modules/@testing-library"],
"types": ["jest-dom"],

Because @testling-library/jest-dom no longer uses a DefinitlyTyped type definition for its types it's not enough anymore to just look inside ../node_modules/@types, we now also have to look inside ../node_modules/@testing-library. And because we're telling TS to look inside the @testing-library/ directory, the type name should only be jest-dom.

I'm not sure if this should be classified as a regression. Or if some docs should be updated.
I'm happy with this solution, and for me this issue can be closed.
But I'll leave it open incase the maintainers of this library wants it open for tracking purposes. If not – feel free to close it! 🙂

[Zakaria Amine]

@Tobbe's answer was helpful. Thanks.