I'm newish to React and React Testing. I've been taking an Udemy course that is a few years old and some things are out of date. I got things updated with a lot of work. I can build, I can start the app. However, my once working tests now fail with this error:
Test suite failed to run
ReferenceError: global is not defined
at Object.<anonymous> (node_modules/graceful-fs/graceful-fs.js:92:1)
at Object.<anonymous> (node_modules/expect/build/toThrowMatchers.js:10:24)
at Object.<anonymous> (node_modules/expect/build/index.js:35:48)
I ran a command I found in github about this issue:
$ npm list jest
react-testing@0.1.0 C:\Users\636309\Notes\React\ReactTesting\Udemy2HourCourseReactTesting\react-testingCopy
├─┬ react-scripts@5.0.1
│ ├─┬ jest-watch-typeahead@1.1.0
│ │ └── jest@27.5.1 deduped invalid: "^29.0.0" from node_modules/ts-jest
│ └── jest@27.5.1 invalid: "^29.0.0" from node_modules/ts-jest
└─┬ ts-jest@29.2.4
└── jest@27.5.1 deduped invalid: "^29.0.0" from node_modules/ts-jest
npm error code ELSPROBLEMS
npm error invalid: jest@27.5.1 C:\Users\steve\Notes\React\ReactTesting\Udemy2HourCourseReactTesting\react-testingCopy\node_modules\jest
npm error A complete log of this run can be found in: C:\development\npmCache\_logs\2024-08-10T03_18_02_069Z-debug-0.log
Here is a copy of my package.json:
{
"name": "react-testing",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/dom": "^10.4.0",
"@types/node": "^22.1.0",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"axios": "^1.7.3",
"invariant": "^2.2.4",
"levenary": "^1.1.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-scripts": "5.0.1"
},
"devDependencies": {
"@testing-library/jest-dom": "^6.4.8",
"@testing-library/react": "^16.0.0",
"@testing-library/user-event": "^14.5.2",
"@types/jest": "^29.5.12",
"ts-jest": "^29.2.4",
"typescript": "~5.5.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jest-environment-jsdom",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"jest": {
"collectCoverageFrom": [
"src/**/*.{ts,tsx,js,jsx}",
"!src/serviceWorker.ts",
"!src/index.tsx",
"!src/**/*.d.ts"
]
}
}
Any clues?
Jest v26 and later ship with JSDOM@16, so there's no reason to use this package anymore.
You are using 27 version of Jest, so you no longer need the jest-environment-jsdom-sixteen
package.
If you replace your package.json
file with this below and then run yarn install
or npm install
, everything should work. I've also tested it. ( after runing npm test
the ReferenceError: global is not defined
error disappeared )
for resolving the error regarding npm list jest
:
it because your jest version is outdated ( 27.5.1 ) for current ts-jest, so you need to update package.json
and add "jest": "^29.7.0",
to the devDependencies
or run yarn add --dev jest
on the project directory
I've try with the second solution and it works
macbook@Macbooks-MacBook-Air react-testing % npm list jest
react-testing@0.1.0 /Users/macbook/Desktop/test/react-testing
├── jest@29.7.0
├─┬ react-scripts@5.0.1
│ ├─┬ jest-watch-typeahead@1.1.0
│ │ └── jest@27.5.1
│ └── jest@27.5.1
└─┬ ts-jest@29.2.4
└── jest@29.7.0 deduped
package.json
{
"name": "react-testing",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/dom": "^10.4.0",
"@types/node": "^22.1.0",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"axios": "^1.7.3",
"invariant": "^2.2.4",
"levenary": "^1.1.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-scripts": "5.0.1"
},
"devDependencies": {
"@testing-library/jest-dom": "^6.4.8",
"@testing-library/react": "^16.0.0",
"@testing-library/user-event": "^14.5.2",
"@types/jest": "^29.5.12",
"jest": "^29.7.0",
"ts-jest": "^29.2.4",
"typescript": "~5.5.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jest-environment-jsdom",
"coverage": "yarn test --coverage --watchAll=false",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"jest": {
"collectCoverageFrom": [
"src/**/*.{ts,tsx,js,jsx}",
"!src/serviceWorker.ts",
"!src/index.tsx",
"!src/**/*.d.ts"
]
}
}