I am trying to test a react typescript project using jest but it's giving a confusing error:
Here is my package.json:
"dependencies": {
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^12.1.5",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.4.1",
"@types/node": "^16.11.26",
"@types/react": "^17.0.43",
"@types/react-dom": "^17.0.14",
"jest": "^27.5.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.2.2",
"react-scripts": "5.0.0",
"ts-jest": "^27.1.4",
"typescript": "^4.6.3",
"web-vitals": "^2.1.4",
},
"devDependencies": {
"@types/react-test-renderer": "^18.0.0",
"react-test-renderer": "^18.1.0"
}
I wrote this basic test which gives the error:
import renderer from 'react-test-renderer'
import AddShipmentButton from './AddShipmentButton'
it('works', () => {
const tree = renderer.create(<AddShipmentButton />).toJSON()
expect(tree).toMatchSnapshot()
})
I had to install the dependencies using --legacy-peer-deps. What could be the issue? Thanks in advance.
CodePudding user response:
In my opinion your import is wrong , try with this way
import TestRenderer from 'react-test-renderer';
import AddShipmentButton from './AddShipmentButton'
it('works', () => {
const tree = TestRenderer.create(<AddShipmentButton />).toJSON()
expect(tree).toMatchSnapshot()
})
Read usage of TestRenderer here
CodePudding user response:
The problem was that I installed the latest version of react-test-renderer v18.0.1 when the React version is v17.0.2. Installing react-test-renderer version 17.0.2 solved this issue.