How to solve TypeError: environment.teardown is not a function

Question

I can\'t test an application which was created with create-react-app.

All guides says that test is working by default, but when I try "yarn test", it requir

Answer 1

After an evening of banging my head on this issue, I think I've finally resolved it. First, let me describe the problem:

I was also getting:

TypeError: environment.teardown is not a function

Because I was trying to upgrade Jest to the latest version. When starting an app with Create-React-App, it installs an earlier version of Jest that does not include all of the features. I was interested in using the inlineSnapshots feature, which allows you to assert rendered components against HTML markup inside your test file.

There are a few things not included in the documentation of either Create-React-App or Jest which you should be aware of. If you want to use newer Jest features, like inlineSnapshots, then you need to do the following:

• yarn adds a fresh version of Jest and jest-environment-jsdom
• yarn add prettier --dev (This is to facilitate rewriting back into the source file.)
• Add a Jest env docblock to the very top of each test script.

A docblock is a JavaScript block comment with a pragma mark "@". For setting the Jest environment, you would add this to the top of every test file:

/**
 * @jest-environment jsdom
 */

This instructs jest to run the test in the jsdom environment, which should match what is passed in the test scripts section of your package.json file. Mine looks something like this (ignore the parts with react-app-rewired):

   "scripts": {
      "start": "yarn run flow && react-app-rewired start",
      "build": "yarn run flow && react-app-rewired build",
      "test": "react-scripts test --env=jsdom"
   }

After doing all of this, I was finally able to get inlineSnapshots to work.