Skip to content

Commit 7c1e4f4

Browse files
authored
Change default test environment to jsdom (facebook#5074)
1 parent 2fd8d83 commit 7c1e4f4

File tree

4 files changed

+12
-22
lines changed

4 files changed

+12
-22
lines changed

scripts/init.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ module.exports = function(
9494
appPackage.scripts = {
9595
start: 'react-scripts start',
9696
build: 'react-scripts build',
97-
test: 'react-scripts test --env=jsdom',
97+
test: 'react-scripts test',
9898
eject: 'react-scripts eject',
9999
};
100100

scripts/test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ function resolveJestDefaultEnvironment(name) {
8383
});
8484
}
8585
let cleanArgv = [];
86-
let env = 'node';
86+
let env = 'jsdom';
8787
let next;
8888
do {
8989
next = argv.shift();

scripts/utils/createJestConfig.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ module.exports = (resolve, rootDir, isEjecting) => {
2828
'<rootDir>/src/**/__tests__/**/*.{js,jsx}',
2929
'<rootDir>/src/**/?(*.)(spec|test).{js,jsx}',
3030
],
31-
testEnvironment: 'node',
31+
testEnvironment: 'jsdom',
3232
testURL: 'http://localhost',
3333
transform: {
3434
'^.+\\.(js|jsx)$': isEjecting

template/README.md

+9-19
Original file line numberDiff line numberDiff line change
@@ -623,7 +623,7 @@ Then in `package.json`, add the following lines to `scripts`:
623623
+ "watch-css": "node-sass-chokidar src/ -o src/ --watch",
624624
"start": "react-scripts start",
625625
"build": "react-scripts build",
626-
"test": "react-scripts test --env=jsdom",
626+
"test": "react-scripts test",
627627
```
628628

629629
>Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessor’s documentation.
@@ -672,7 +672,7 @@ Then we can change `start` and `build` scripts to include the CSS preprocessor c
672672
+ "start": "npm-run-all -p watch-css start-js",
673673
+ "build-js": "react-scripts build",
674674
+ "build": "npm-run-all build-css build-js",
675-
"test": "react-scripts test --env=jsdom",
675+
"test": "react-scripts test",
676676
"eject": "react-scripts eject"
677677
}
678678
```
@@ -1676,23 +1676,14 @@ The build command will check for linter warnings and fail if any are found.
16761676

16771677
### Disabling jsdom
16781678

1679-
By default, the `package.json` of the generated project looks like this:
1680-
1681-
```js
1682-
"scripts": {
1683-
"start": "react-scripts start",
1684-
"build": "react-scripts build",
1685-
"test": "react-scripts test --env=jsdom"
1686-
```
1687-
1688-
If you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster:
1679+
If you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely set `--env=node`, and your tests will run faster:
16891680

16901681
```diff
16911682
"scripts": {
16921683
"start": "react-scripts start",
16931684
"build": "react-scripts build",
1694-
- "test": "react-scripts test --env=jsdom"
1695-
+ "test": "react-scripts test"
1685+
- "test": "react-scripts test"
1686+
+ "test": "react-scripts test --env=node"
16961687
```
16971688

16981689
To help you make up your mind, here is a list of APIs that **need jsdom**:
@@ -1730,7 +1721,7 @@ There are various ways to setup a debugger for your Jest tests. We cover debuggi
17301721
Add the following to the `scripts` section in your project's `package.json`
17311722
```json
17321723
"scripts": {
1733-
"test:debug": "react-scripts --inspect-brk test --runInBand --env=jsdom"
1724+
"test:debug": "react-scripts --inspect-brk test --runInBand"
17341725
}
17351726
```
17361727
Place `debugger;` statements in any test and run:
@@ -1766,8 +1757,7 @@ Use the following [`launch.json`](https://code.visualstudio.com/docs/editor/debu
17661757
"args": [
17671758
"test",
17681759
"--runInBand",
1769-
"--no-cache",
1770-
"--env=jsdom"
1760+
"--no-cache"
17711761
],
17721762
"cwd": "${workspaceRoot}",
17731763
"protocol": "inspector",
@@ -2004,7 +1994,7 @@ Then in `package.json`, add the following line to `scripts`:
20041994
+ "analyze": "source-map-explorer build/static/js/main.*",
20051995
"start": "react-scripts start",
20061996
"build": "react-scripts build",
2007-
"test": "react-scripts test --env=jsdom",
1997+
"test": "react-scripts test",
20081998
```
20091999

20102000
Then to analyze the bundle run the production build then run the analyze
@@ -2493,7 +2483,7 @@ If none of these solutions help please leave a comment [in this thread](https://
24932483
24942484
### `npm test` hangs or crashes on macOS Sierra
24952485
2496-
If you run `npm test` and the console gets stuck after printing `react-scripts test --env=jsdom` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebook/create-react-app#713](https://github.com/facebook/create-react-app/issues/713).
2486+
If you run `npm test` and the console gets stuck after printing `react-scripts test` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebook/create-react-app#713](https://github.com/facebook/create-react-app/issues/713).
24972487
24982488
We recommend deleting `node_modules` in your project and running `npm install` (or `yarn` if you use it) first. If it doesn't help, you can try one of the numerous workarounds mentioned in these issues:
24992489

0 commit comments

Comments
 (0)