react-testing-library: Cannot find module 'pretty-format'

This looks like a missing package dependency in @testing-library/react it doesn’t matter that @testing-library/dom already includes it, there is no guarantee that npm will hoist the dependency.

I my case I only see the error when running Storybook, but after digging a little bit into the code I see that the problem started to appear after an upgrade of Jest: it seems that Jest is using v26 now, so NPM stops hoisting the v25 inside @testing-library/dom to avoid conflicts with the v26 for Jest.

@samtsai I see that you closed the PR https://github.com/testing-library/react-testing-library/pull/705 because of the comment that the depdendency should come from @testing-library/dom… I think that the PR is correct, and if the concern is ensuring the same pretty-format version it should be a peerDependency, but in this case a simple dep is the right intention. @kentcdodds Can you re-consider that PR?

A dump of npm ls pretty-format in my project:

┬ @testing-library/jest-dom@5.10.1
│ ├─┬ jest-diff@25.5.0
│ │ └── pretty-format@25.5.0
│ └─┬ jest-matcher-utils@25.5.0
│   └── pretty-format@25.5.0
├─┬ @testing-library/react@10.3.0
│ └─┬ @testing-library/dom@7.16.2
│   └── pretty-format@25.5.0
├─┬ @types/jest@26.0.0
│ └── pretty-format@25.5.0
└─┬ jest@26.0.1
  ├─┬ @jest/core@26.0.1
  │ ├─┬ jest-config@26.0.1
  │ │ ├─┬ jest-jasmine2@26.0.1
  │ │ │ ├─┬ jest-each@26.0.1
  │ │ │ │ └── pretty-format@26.0.1
  │ │ │ ├─┬ jest-matcher-utils@26.0.1
  │ │ │ │ ├─┬ jest-diff@26.0.1
  │ │ │ │ │ └── pretty-format@26.0.1  deduped
  │ │ │ │ └── pretty-format@26.0.1  deduped
  │ │ │ └── pretty-format@26.0.1
  │ │ ├─┬ jest-validate@26.0.1
  │ │ │ └── pretty-format@26.0.1  deduped
  │ │ └── pretty-format@26.0.1
  │ ├─┬ jest-runner@26.0.1
  │ │ └─┬ jest-leak-detector@26.0.1
  │ │   └── pretty-format@26.0.1
  │ ├─┬ jest-runtime@26.0.1
  │ │ └─┬ jest-validate@26.0.1
  │ │   └── pretty-format@26.0.1
  │ ├─┬ jest-snapshot@26.0.1
  │ │ ├─┬ expect@26.0.1
  │ │ │ └─┬ jest-matcher-utils@26.0.1
  │ │ │   ├─┬ jest-diff@26.0.1
  │ │ │   │ └── pretty-format@26.0.1  deduped
  │ │ │   └── pretty-format@26.0.1
  │ │ ├─┬ jest-diff@26.0.1
  │ │ │ └── pretty-format@26.0.1  deduped
  │ │ ├─┬ jest-matcher-utils@26.0.1
  │ │ │ └── pretty-format@26.0.1  deduped
  │ │ └── pretty-format@26.0.1
  │ └─┬ jest-validate@26.0.1
  │   └── pretty-format@26.0.1
  └─┬ jest-cli@26.0.1
    └─┬ jest-validate@26.0.1
      └── pretty-format@26.0.1

In my case the workaround was to install pretty-format directly so @testing-library/react reads it from the parent, but it’s a hack.

I think a better solution would be to have DOM Testing Library re-export the types from pretty-format and import them from @testing-library/dom instead.

@jordisantamaria this is now resolved in version 5.5.2 of vue-testing-library.

So working with your repo, I was able to upgrade to 10.2.0 as is.

Steps:

1. Blow away node_modules and package-lock.json
2. Re-install node_modules
3. npx tsx --noEmit

I know that removing package-lock.json has its own risk but we’d like not to have to unnecessarily add dependencies to this project when @testing-library/dom already has it as a dependency.

cc @kentcdodds