Not compatible with jest 27

[lukeapage]

• @testing-library/dom version: 7.31.0
• Testing Framework and version:
  Jest 27.0.1
• DOM Environment:
  jsdom: 16.6

What you did:

After upgrading to jest v27 I get an error:

  ● Test suite failed to run

    TypeError: Cannot destructure property 'DOMElement' of '_prettyFormat.default.plugins' as it is undefined.

      at Object.<anonymous> (node_modules/@testing-library/dom/dist/pretty-dom.js:33:3)
      at Object.<anonymous> (node_modules/@testing-library/dom/dist/config.js:11:18)

Problem description:

I believe jest's pretty-format package changed from exporting on "default" to exporting directly. Even though dom testing library requires a older version, jest requires the newer version, so when dom testing library requires it, it gets the newer version...

Suggested solution:

I can only think to publish a new major version which will not be compatible with jest 26 but will work with jest 27. I believe you just need to remove .default.

[timdeschryver]

This should be resolved with the v8 release. Could you try it out please?

[lukeapage]

I’ve been using it successfully on the v8 alpha releases so I assume v8 final is ok.

btw we still use legacy timers and things “seem to work” - I guess we are not exercising something that might break?

[andrevenancio]

It doesn't work for me. I'm running @testing-library/dom 8.1.0 and jest27.0.6`.

See multiple TypeError: Cannot destructure property 'AsymmetricMatcher' of '_prettyFormat.default.plugins' as it is undefined. warnings on my tests.

[lukeapage]

Some testing library packages aren’t upgraded to 8 so you might have an old one in your package Json tree - try checking your yarn.lock /package-lock.json

[nickserv]

You can also use npm ls @testing-library/dom or yarn why @testing-library/dom to see what version you have installed without opening your lockfile. If you're still having issues, please let us know your version. We're using Jest 27 now, so I have a feeling it's an issue with an older version.

[signal-intrusion]

@nickmccurdy @lukeapage

Sorry. I have the same problem as @andrevenancio and I'm definitely using testing-library/dom 8.1 and jest 27:

➜ npm ls @testing-library/dom
[email protected] /Users/blahblahblah
└─┬ @testing-library/[email protected]
  └── @testing-library/[email protected]
  
➜ npm ls jest
[email protected] /blahblahblah
└── [email protected]

I blew away my package-lock and node_modules for a clean install and that did not fix the issue.

[signal-intrusion]

I found a workaround: uninstall @types/jest, delete your package-lock.json, re-install.

The problem is that [email protected] uses an incompatible version of pretty-format. For some reason, @types/jest depends on [email protected] (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/jest/package.json#L4-L5). And for another reason, when you run jest with an npm script, jest uses jest-diff@26 from @types/jest which uses the old, incompatible pretty-format, even if you've installed pretty-format and jest-diff@27 as top level dependencies!

[jonioni]

This might be related to testing-library/eslint-plugin-jest-dom which specifies a dependency on "@testing-library/dom": "^7.28.1", forcing the download of @testing-library/[email protected] and resulting in the above error. Uninstalling testing-library/eslint-plugin-jest-dom for now might help until it is updated.

[AndriiScribe]

this helped in my case yarn upgrade @testing-library/react -L -> upgrade to lates version 11.x -> 12.x