Reputation: 1479
I am trying to use enzyme for testing react components, but cant get started even with the most basic example.
import React from 'react'
import { shallow,render,mount,configure } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16';
import {LoginPage} from '../../../app/components/login/LoginPage'
configure({ adapter: new Adapter() });
test('should say hello',() => {
const loginPage = shallow(<LoginPage />)
expect(loginPage.contains('Hello').toBe(true))
})
when running this, I get the following error:-
Test suite failed to run
D:/code/github/metallica2/metallica/client/src/app/__tests__/components/login/LoginPage.test.js: Unexpected token (9
:30)
7 |
8 | test('should say hello',() => {
> 9 | const loginPage = shallow(<LoginPage />)
| ^
10 | expect(loginPage.contains('Hello').toBe(true))
11 | })
What am I doing wrong here ?
Thanks,
Amar
Upvotes: 16
Views: 11862
Reputation: 10912
This is an issue with Jest not understanding JSX export.
You can solve this issue by adding the following lines to .babelrc
file:
"env": {
"test": {
"presets": ["@babel/preset-env", "@babel/preset-react"],
"plugins": ["transform-export-extensions"],
"only": [
"./**/*.js",
"node_modules/jest-runtime"
]
}
},
And then installing babel-plugin-transform-export-extensions
.
Upvotes: 7
Reputation: 1479
I was able to solve this issue by introducing the below in the .babelrc
{
"env": {
"test": {
"presets": ["env", "react", "stage-2"],
"plugins": ["transform-export-extensions"],
"only": [
"./**/*.js",
"node_modules/jest-runtime"
]
}
}
}
and installing the following dev dependencies:-
"babel-plugin-transform-export-extensions"
"enzyme-adapter-react-16"
"jest-cli"
"react-test-renderer"
Upvotes: 8
Reputation: 13549
It looks like you don't have a jsx support. I see you have babel-jest
installed but do you have .babelrc
file at the root folder
{
"presets": ["es2015", "react"]
}
Upvotes: 1