TypeError: environment.setup is not a function in React Testing
Solution 1
Jest is included with react-scripts. The error is due to a conflict that arose when you installed Jest in a project started with react-scripts. The "Getting started with Jest" guide expects a 'clean' project.
Simply remove Jest from your (dev)dependencies and it should work.
If you want to use Jest for testing React components (which you probably do), you need to modify your test script in package.json
to react-scripts test --env=jsdom
, as it was.
Solution 2
Based on this github issue: @jest-environment node not working in v22,
I updated the sum.test.js
as:
/**
* @jest-environment node
*/
const sum = require('./sum');
test('adding sum function', () => {
expect(sum(234,4)).toBe(238);
})
Now I got rid of the TypeError: environment.setup is not a function
.
Output:
PASS src/sum.test.js
✓ adding sum function (2ms)
Test Suites: 1 passed, 1 total
Tests: 1 passed, 1 total
Snapshots: 0 total
Time: 0.438s
Ran all test suites.
Updated
Reading several answers, today I recreated the scenario.
Step 1:
I created a new project using create-react-app
.
The command: create-react-app demo-app
package.json
file:
{
"name": "demo-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.2",
"react-dom": "^16.3.2",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
This file shows that jest
is not included in the dependencies.
Step 2:
I included sum.js
and sum.test.js
files in src
folder as shown in the official getting started guide.
sum.js
:
function sum(a, b) {
return a + b;
}
module.exports = sum;
sum.test.js
:
const sum = require('./sum');
test('adds 1 + 2 to equal 3', () => {
expect(sum(1, 2)).toBe(3);
});
Step 3:
I ran yarn test
command without including jest
in package.json
file.
So, this test command uses react-scripts test --env=jsdom
as shown in package.json
.
Output of the test:
PASS src/sum.test.js
PASS src/App.test.js
Test Suites: 2 passed, 2 total
Tests: 2 passed, 2 total
Snapshots: 0 total
Time: 0.594s, estimated 1s
Ran all test suites related to changed files.
Step 4:
I updated the package.json
file to use jest
as test script:
{
"name": "demo-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.2",
"react-dom": "^16.3.2",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "jest",
"eject": "react-scripts eject"
}
}
Again I ran yarn test
and the output is:
$ jest
PASS src/sum.test.js
FAIL src/App.test.js
● Test suite failed to run
/<PATH>/demo-app/src/App.test.js: Unexpected token (7:18)
5 | it('renders without crashing', () => {
6 | const div = document.createElement('div');
> 7 | ReactDOM.render(<App />, div);
| ^
8 | ReactDOM.unmountComponentAtNode(div);
9 | });
10 |
Test Suites: 1 failed, 1 passed, 2 total
Tests: 1 passed, 1 total
Snapshots: 0 total
Time: 0.645s, estimated 1s
Ran all test suites.
Too Long; Did not Read (TL;DR)
- Do not add
jest
usingyarn add --dev jest
ornpm install --save-dev jest
if you usecreate-react-app
command.jest
is included innode-modules
of the project if you usecreate-react-app
.
From official Jest documentation:
Setup with Create React App
If you are just getting started with React, we recommend using Create React App. It is ready to use and ships with Jest! You don't need to do any extra steps for setup, and can head straight to the next section.
- Do not change the test script in
package.json
file { look at this issue }. Keep the default"test": "react-scripts test --env=jsdom",
in that.
Solution 3
Just remove jest
from your dev dependencies. To do so, run the following command:
npm remove --save-dev jest
Solution 4
My issue solve with this:
.
If you have both react-scripts and jest in your package.json, delete jest from it.
Then delete package-lock.json, yarn.lock and node_modules.
Then run npm install (or yarn if you use it). ~Dan Abramov~
.
issues #5119
.
Solution 5
Add
"jest": {
"testEnvironment": "node"
}
to your package.json file, your package.json would look like this:
{
"name": "jest-demo-test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-scripts": "1.0.17"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "jest",
"eject": "react-scripts eject"
},
"devDependencies": {
"jest": "^22.0.4"
},
"jest": {
"testEnvironment": "node"
}
}
UPDATE
for the people using create app and having this problem, there are two solutions.
1- update test
command (or add new one) in package.json to jest
instead of react-scripts test
, because react-scripts test
will not allow jest options in package.json as @Xinyang_Li stated in comments.
2-if you don't want to change test command in package.json, and use default create-react-app test; remove jest options from packge.json (if exists)
"jest": {
"testEnvironment": "node"
}
then remove node_modules and then run npm install to install them all again, and after that your tests should run normally.
Related videos on Youtube
arsho
I believe in simplicity and peace. Enthusiast to use and to develop Free Open Source Software (FOSS). Trying to follow two rules: If it takes less than two minutes, then do it now. Always leave the campground cleaner than you found it.
Updated on September 10, 2022Comments
-
arsho over 1 year
I was trying to implement the example shown in Jest website: Getting started with Jest.
While running
npm test
on I was getting the following error:FAIL src/sum.test.js ● Test suite failed to run TypeError: environment.setup is not a function at node_modules/jest-runner/build/run_test.js:112:23
sum.js
:function sum(a, b){ return a+b; } module.exports = sum;
sum.test.js
:const sum = require('./sum'); test('adding sum function', () => { expect(sum(234,4)).toBe(238); })
sum.js
andsum.test.js
are an exact copy of the example shown in Getting started with Jest.package.json
:{ "name": "jest-demo-test", "version": "0.1.0", "private": true, "dependencies": { "react": "^16.2.0", "react-dom": "^16.2.0", "react-scripts": "1.0.17" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "jest", "eject": "react-scripts eject" }, "devDependencies": { "jest": "^22.0.4" } }
So, how can I get rid of
TypeError: environment.setup is not a function
error? -
episodeyang over 6 yearsthis answer is very incomplete. Should add the relevant explanation to the answer instead of just redirecting to the issue.
-
arsho over 6 years@episodeyang, I am still looking to get a better answer. Can you lend a hand?
-
Farzad Yousefzadeh over 6 yearsThis worked for me. is there any reason behind this?
-
arsho about 6 yearsDowngrading is not a proper solution.
-
FDisk about 6 yearsSo - do the magic by youself - it's incompatible with newer versions :D
-
X.Creates about 6 yearsthis won't work if your project is bootstrapped using
create-react-app
unless you eject it. -
xor about 6 years@arsho I believe you can fix it by uninstalling jest. I explained in the answer below.
-
XML about 6 yearsThis error can occur even on jest v20.0.4. While downgrading may solve for some people, it's at best a workaround.
-
arsho about 6 yearsThank you for answering. I have updated the answer, please take a look.
-
arsho about 6 yearsThank you for answering. I have updated the answer, please take a look.
-
arsho about 6 years@FDisk, please take a look at my updated answer and tell if it does the magic. :D
-
Atav32 about 6 yearsstraight from the horse's mouth: github.com/facebook/jest/issues/5119#issuecomment-357676403
-
Mhmdrz_A almost 6 years@XinyangLi thats true if you use default test command, but here we are using "jest" in test command and it works fine
-
gabrielAnzaldo over 5 yearsBut what happen if I am not using create react app?
-
gabrielAnzaldo over 5 yearsI have the same issue, but I am not using create react app