Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TypeError: _enzyme2.default.configure is not a function

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.

like image 412
Aleksandar Ogrizovic Avatar asked Oct 04 '17 18:10

Aleksandar Ogrizovic


3 Answers

I was getting the same error. I found out my mistake was.

import shallow from 'enzyme';

I changed it to

import {shallow} from 'enzyme';
like image 192
rbansal Avatar answered Nov 06 '22 04:11

rbansal


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.

like image 4
LukaszS Avatar answered Nov 06 '22 04:11

LukaszS


Ran into this as well. In my case the problem was a bad setup that was redirecting any module whose name contained the substring configuration to my local environment-specific config.

In my specific case, with Jest, the fix was changing the jest moduleNameWrapper setting in package.json so that the key that redirected to my config was ^config$ instead of just config.

like image 2
michael Avatar answered Nov 06 '22 06:11

michael