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 requires install 'jest-cli' and after installation gives an error:

TypeError: environment.teardown is not a function

You shouldn't need to install jest-cli yourself, it should come out of the box. Do this: delete package-lock.json, yarn.lock, node_modules, remove jest from the dependencies in package.json, then do npm install and yarn install. — MstrQKN, Jun 05 '18 at 09:08
@MstrQKN oooh thank you man, i could not figure it out for 2 days, very grateful to you — , Jun 05 '18 at 09:20
I'll add my comment as an answer, please confirm the answer so the question gets closed :) — MstrQKN, Jun 05 '18 at 09:30

score 19 · Accepted Answer · edited Oct 13 '20 at 19:17

19

You shouldn't need to install jest-cli yourself. It should come out of the box.

Try the following:

Delete package-lock.json, yarn.lock and node_modules
Remove jest from the dependencies in package.json
Then do npm install or yarn install.

edited Oct 13 '20 at 19:17

Peter Mortensen

30,738
21
105
131

answered Jun 05 '18 at 09:32

MstrQKN

836
10
28

then how to test a single file? npm test? – Weijing Jay Lin Jun 07 '18 at 00:03
Not really sure Weijing, but I think your answer should be here: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#running-tests – MstrQKN Jun 08 '18 at 07:22
@WeijingJayLin , jest test files based on patterns to match files. If you want to test a single file, you should specify an specific pattern for its file name. `yarn run test /specificfolder/otherspecific/file.spec.js` If that pattern only matches one file. Then you will test only a single file. the one you want! – Wilber Hinojosa Jun 20 '18 at 17:18
1

if you used ```create-react-app``` make sure ```"test": "react-scripts test --env=jsdom"``` is your test script. – Ryan Walker Aug 18 '18 at 02:15

score 8 · Answer 2 · edited Oct 13 '20 at 19:20

8

Add a fresh version of "jest-environment-jsdom" to file "package.json".

edited Oct 13 '20 at 19:20

Peter Mortensen

30,738
21
105
131

answered Aug 31 '18 at 15:13

denisx

89
2
3

2

Hello,Try to avoid comment in answer unless you have "specific detail" answer. Please use comment box below and Once you have sufficient reputation you will be able to comment on any post. :) – Rucha Bhatt Joshi Aug 31 '18 at 15:35
This inspired me and worked, `npm i -D jest-environment-jsdom@24` – pzrq Nov 13 '19 at 08:11

score 2 · Answer 3 · edited Oct 13 '20 at 19:33

2

If you have not used create-react-app for the project:

Just remove jest, jest-cli, jest-environment-jsdom from package.json.
Delete folder node-modules, file package-lock.json and file yarn.lock.
Use npm --save i or yarn add to install all of them so that each of them have same version.

This should work!

In my case I was missing the jest-environment-jsdom package.

edited Oct 13 '20 at 19:33

Peter Mortensen

30,738
21
105
131

answered Aug 26 '19 at 14:35

Abhishek Ranjan

99
1
4

score 1 · Answer 4 · edited Oct 13 '20 at 19:20

1

In my case it throws this error because I create my React project using create-react-app and install jest. In certain way it conflicts.

I solve it by removing jest from my project and using the create-react-app test script.

edited Oct 13 '20 at 19:20

Peter Mortensen

30,738
21
105
131

answered Jul 12 '18 at 09:49

Raul F. de Melo

61
5

score 1 · Answer 5 · edited Oct 13 '20 at 19:29

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.

score 0 · Answer 6 · edited Oct 13 '20 at 19:31

0

For me, it was the module import binding. Basically, for me, it was the module export/import binding.

Basically if it was exported using module.export, you should import using require. If it was exported using export or export default, you should import using import.

No mixing is allowed here.

edited Oct 13 '20 at 19:31

Peter Mortensen

30,738
21
105
131

answered Feb 28 '19 at 23:26

somenickname

539
7
19

`module.export`? Not `module.exports`? – Peter Mortensen Oct 13 '20 at 19:32

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

6 Answers6

Linked