So recently, I migrated from React 15.4.2 to React 16.0.0. Here are my current versions in project:
{
"jest":{
"verbose":true,
"automock":false,
"testRegex":"\\.test\\.js$",
"moduleNameMapper":{
"config":"<rootDir>/src/config/test.js",
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"<rootDir>/src/__tests__/__mocks__/fileMock.js",
"\\.(css|less|scss)$":"<rootDir>/src/__tests__/__mocks__/styleMock.js",
"\\Api.(js)$":"<rootDir>/src/__tests__/__mocks__/apiMock.js"
},
"coveragePathIgnorePatterns":[
"<rootDir>/src/utils/svgVisualization.js"
],
"unmockedModulePathPatterns":[
"react"
],
"moduleFileExtensions":[
"js",
"json"
],
"modulePathIgnorePatterns":[
"/node_modules/"
],
"testPathIgnorePatterns":[
"/node_modules/"
],
"setupFiles":[
"<rootDir>/src/__tests__/__mocks__/storageMock.js"
]
},
"main":"src/index.js",
"scripts":{
"clean":"rimraf dist/*",
"copy":"copyfiles -f ./src/index.html ./dist",
"dist":"npm run clean && npm run copy && webpack --progress --bail --env dist -p",
"dev":"npm run clean && npm run copy && webpack --progress --bail --env dev -p",
"lint":"esw webpack.config.* src tools --color",
"lint:watch":"npm run lint -- --watch",
"release:major":"npm version prerelease && git push --follow-tags && npm publish --tag beta",
"release:minor":"npm version prerelease && git push --follow-tags && npm publish --tag beta",
"release:patch":"npm version prerelease && git push --follow-tags && npm publish --tag beta",
"serve:dev":"webpack-dev-server --open --env dev",
"serve:dist":"webpack-dev-server --open --env dist -p --progress",
"open:src":"npm run serve:dev",
"start":"npm-run-all --parallel open:src lint:watch",
"test":"jest --coverage"
},
"devDependencies":{
"babel-core":"^6.7.6",
"babel-eslint":"^7.1.0",
"babel-jest":"^20.0.3",
"babel-loader":"^6.2.4",
"babel-plugin-istanbul":"^3.0.0",
"babel-plugin-transform-class-properties":"^6.24.1",
"babel-plugin-transform-decorators-legacy":"^1.3.4",
"babel-plugin-transform-object-rest-spread":"^6.8.0",
"babel-polyfill":"^6.9.0",
"babel-preset-airbnb":"^2.0.0",
"babel-preset-es2015":"^6.24.1",
"babel-preset-es2015-native-modules":"^6.6.0",
"babel-preset-react":"^6.24.1",
"chai":"^4.1.2",
"copyfiles":"^1.0.0",
"css-loader":"^0.28.7",
"enzyme":"^3.1.0",
"enzyme-adapter-react-16":"^1.0.1",
"eslint":"^4.1.1",
"eslint-config-airbnb":"^15.1.0",
"eslint-loader":"^1.3.0",
"eslint-plugin-import":"^2.2.0",
"eslint-plugin-jsx-a11y":"^5.1.1",
"eslint-plugin-react":"^7.1.0",
"file-loader":"^1.1.4",
"jest":"^21.2.1",
"jest-enzyme":"^4.0.0",
"karma":"^1.0.0",
"karma-chai":"^0.1.0",
"karma-chrome-launcher":"^2.1.1",
"karma-coverage":"^1.0.0",
"karma-junit-reporter":"^1.0.0",
"karma-mocha":"^1.0.1",
"karma-mocha-reporter":"^2.0.3",
"karma-phantomjs-launcher":"^1.0.0",
"karma-sinon":"^1.0.5",
"karma-sourcemap-loader":"^0.3.7",
"karma-webpack":"^2.0.4",
"mocha":"^3.0.0",
"node-sass":"^4.5.3",
"npm-run-all":"^4.0.2",
"null-loader":"^0.1.1",
"phantomjs-prebuilt":"^2.1.7",
"postcss":"^6.0.12",
"postcss-loader":"^2.0.6",
"react-addons-test-utils":"^15.0.1",
"react-test-renderer":"^16.0.0",
"rimraf":"^2.5.2",
"sass-loader":"^6.0.6",
"sinon":"^4.0.0",
"style-loader":"^0.18.2",
"url-loader":"^0.5.7",
"webpack":"^3.6.0",
"webpack-bundle-size-analyzer":"^2.7.0",
"webpack-dev-server":"^2.1.0-beta"
},
"dependencies":{
"@types/react":"^16.0.2",
"babel-plugin-import":"^1.2.1",
"babel-polyfill":"^6.23.0",
"cross-env":"^5.0.5",
"es6-tween":"^3.3.0",
"eslint-watch":"^3.0.0",
"image-webpack-loader":"^3.2.0",
"immutable":"^3.8.1",
"jwt-decode":"^2.1.0",
"lodash":"^4.17.4",
"material-ui":"0.19.3",
"moment":"^2.18.1",
"nock":"^9.0.13",
"prop-types":"^15.5.8",
"react":"^16.0.0",
"react-addons-css-transition-group":"^15.4.2",
"react-addons-shallow-compare":"^15.5.2",
"react-bootstrap":"^0.31.3",
"react-breadcrumbs":"^1.5.2",
"react-dnd":"^2.4.0",
"react-dnd-html5-backend":"^2.4.1",
"react-dom":"^16.0.0",
"react-ga":"^2.2.0",
"react-helmet":"^5.0.0-beta",
"react-hot-loader":"^3.0.0-beta.6",
"react-redux":"^5.0.3",
"react-router":"^3.0.0",
"react-tap-event-plugin":"^3.0.2",
"react-tooltip":"^3.3.0",
"reactour":"^1.0.1",
"redux":"^3.6.0",
"redux-form":"^7.0.4",
"redux-logger":"^3.0.6",
"redux-mock-store":"^1.2.3",
"redux-thunk":"^2.2.0",
"styled-components":"^2.1.1",
"superagent":"^3.5.0",
"svg.js":"^2.6.2",
"three":"^0.87.1",
"throttle-debounce":"^1.0.1",
"universal-cookie":"^2.0.8",
"webpack":"^3.6.0",
"whatwg-fetch":"^2.0.2"
}
}
Along with React, I migrated to Enzyme 3.6.0 and started using enzyme-adapter-react, so in my entry file to tests (src/config.test.js) I did this:
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
Enzyme.configure({ adapter: new Adapter() });
When I try to run tests with jest as I would usually, I get the error as in the title.
Also, if I try to use jest-enzyme and add this to my jest configuration:
"setupTestFrameworkScriptFile": "./node_modules/jest-enzyme/lib/index.js",
I get another error :
TypeError: Super expression must either be null or a function, not undefined.
So I am kinda stuck, whatever I try, I cannot make my tests work. Any help is appreciated.
What helped me is the following: Rename alias from 'config' to something else e.g. 'my-config'. in moduleNameMapper:{ "my-config":"/src/config/test.js" ...}
and of course change imports in your js code. And should work.
It must have ben some name conflicts in enzyme or other dependencies.