The title pretty much explains what I'm facing. I'm trying to test a React component that has some state, and I attempt to provide my store to the component in order to get what it needs. When I run the test of the component using Jest, I get the following error:
ReferenceError: regeneratorRuntime is not defined
I've determined through some reading that this is caused by babel-polyfill or regenerator-runtime not being applied correctly to Jest. However, I've tried installing both of those packages and re-running with no change in results. After reading the Jest Github issues page (Remove auto-inclusion of babel-polyfill #2755), I found out that babel-polyfill is not included automatically by Jest as of version 19. My manual installation of that package should have fixed the issue, but it did not. I've included some of the files that I think are relevant
.babelrc:
{
"presets": ["es2015", "react", "stage-2"],
"env": {
"development": {
"plugins": [
["react-transform", {
"transforms": [{
"transform": "react-transform-hmr",
"imports": ["react"],
"locals": ["module"]
}]
}]
]
}
}
}
jest.config:
{
"transform": {
"^.+\\.(js|jsx)$": "<rootDir>/node_modules/webpack-babel-jest",
".*\\.(vue)$": "<rootDir>/node_modules/jest-vue-preprocessor",
".*": "babel-jest"
},
"moduleNameMapper": {
"\\.(jpg|jpeg|css|scss|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__tests__/__mocks__/fileMock.js",
".*\\.(vue)$": "vue/dist/vue.js"
},
"testPathIgnorePatterns": ["type_parser.spec.js",
"<rootDir>/__tests__/__mocks__/",
"__tests__/unit/core/util/type_parser.js",
"__tests__/GitlabLoader.test.js"
]
}
package.json:
{
"name": "my_project",
"version": "0.2.0",
"description": "My Project",
"scripts": {
"clean:build": "node ./bin/clean.js createdir",
"build:html": "node ./bin/buildHtml.js",
"deployProduction": "node ./bin/deployProduction.js",
"start": "webpack-dev-server --config ./config/webpack.config.dev.js --hot --inline --progress",
"serve": "npm run deployProduction&& supervisor --watch ./production-copy src/js/server",
"prebuild": "npm run clean:build",
"postbuild": "node ./bin/postBuild.js",
"rebuild-win": "set BUILD_TYPE=preview& npm run prebuild & npm run build-win & npm run serve",
"build": "set BUILD_TYPE=final& npm run prebuild & npm run build-win",
"deploy": "npm run build & npm run serve",
"build-win": "set NODE_ENV=production & npm run element-build & npm run build-doc & npm run build:html & webpack -p --config ./config/webpack.config.prod.js --json > webpack.log.json & npm run postbuild",
"lint": "eslint config src/js/**/*.js",
"jscs": "jscs src/js/",
"test": "jest --no-cache --verbose --config=./__tests__/jest.config",
"test:watch": "npm run test -- --watch",
"element-init": "node node_modules/element-theme/bin/element-theme -i src/js/core/ui/element-theme.css",
"element-build": "node node_modules/element-theme/bin/element-theme -c src/js/core/ui/element-theme.css -o src/js/core/ui/element-theme ",
"build-doc": "node bin/buildDoc.js ",
"storybook": "start-storybook -p 9001 -c .storybook"
},
"repository": {
"type": "git",
"url": "my_url"
},
"license": "MIT",
"bugs": {
"url": "my_url"
},
"homepage": "my_homepage",
"dependencies": {
"autoprefixer": "^6.3.6",
"axios": "^0.11.1",
"babel-runtime": "^6.23.0",
"babel-standalone": "^6.10.3",
"bluebird": "^3.4.0",
"brace": "^0.8.0",
"browserify": "^13.0.1",
"chai": "^3.5.0",
"classnames": "2.2.3",
"cls-bluebird": "^1.0.1",
"codemirror": "^5.16.0",
"connect-history-api-fallback": "^1.3.0",
"continuation-local-storage": "^3.1.7",
"dateformat": "^1.0.12",
"diff": "^3.0.1",
"element-theme": "^0.4.0",
"element-ui": "^1.1.5",
"express-history-api-fallback": "^2.0.0",
"filedrop": "^2.0.0",
"fs-extra": "^0.30.0",
"history": "^2.0.2",
"humps": "^1.0.0",
"immutability-helper": "^2.1.1",
"isomorphic-fetch": "^2.2.1",
"json-loader": "^0.5.4",
"jszip": "^3.0.0",
"jszip-utils": "0.0.2",
"material-ui": "^0.16.7",
"materialize-css": "^0.97.6",
"mocha": "^2.5.3",
"moment": "^2.17.1",
"normalizr": "^1.0.0",
"raven-js": "^3.9.1",
"react": "^15.0.1",
"react-ace": "^3.5.0",
"react-addons-update": "^15.4.2",
"react-dom": "^15.0.1",
"react-redux": "^4.4.5",
"react-router": "^2.3.0",
"react-router-redux": "^4.0.2",
"redux": "^3.4.0",
"redux-logger": "^2.6.1",
"redux-saga": "^0.9.5",
"request": "^2.72.0",
"request-promise": "^3.0.0",
"reselect": "^2.5.4",
"save-as": "^0.1.7",
"showdown": "^1.4.2",
"three": "^0.79.0",
"url-pattern": "^1.0.3",
"vue": "^2.0.5",
"vue-easy-slider": "^1.4.0",
"vue-loader": "^9.8.1",
"vue-router": "^2.0.1",
"vue-slider-component": "^2.0.4",
"walk": "^2.3.9"
},
"devDependencies": {
"@kadira/storybook": "^2.35.3",
"babel-core": "^6.7.6",
"babel-eslint": "^6.1.0",
"babel-jest": "^18.0.0",
"babel-loader": "^6.0.2",
"babel-plugin-react-transform": "^2.0.2",
"babel-polyfill": "^6.23.0",
"babel-preset-es2015": "^6.22.0",
"babel-preset-es2016": "^6.22.0",
"babel-preset-react": "^6.23.0",
"babel-preset-stage-2": "^6.5.0",
"babel-register": "^6.7.2",
"chai": "3.5.0",
"chai-jquery": "2.0.0",
"cheerio": "0.20.0",
"colors": "1.1.2",
"concurrently": "^2.0.0",
"copy-webpack-plugin": "2.1.1",
"css-loader": "0.23.1",
"element-theme-default": "^1.1.5",
"enzyme": "^2.7.1",
"eslint": "^2.13.1",
"eslint-config-airbnb": "^9.0.1",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^4.0.0",
"eslint-plugin-react": "^5.2.2",
"express": "^4.13.4",
"extract-text-webpack-plugin": "1.0.1",
"file-loader": "0.8.5",
"identity-obj-proxy": "^3.0.0",
"jest": "^19.0.2",
"jest-cli": "^18.1.0",
"jest-css-modules": "^1.1.0",
"jest-enzyme": "^2.1.2",
"jest-vue-preprocessor": "^0.1.2",
"jquery": "2.2.3",
"jscs": "3.0.3",
"jsdoc-to-markdown": "^2.0.0",
"jsdom": "8.4.0",
"json-loader": "^0.5.4",
"mocha": "^2.4.5",
"ncp": "^2.0.0",
"node-sass": "3.7.0",
"postcss-loader": "0.8.2",
"react-addons-test-utils": "^15.4.2",
"react-hot-loader": "1.3.0",
"react-test-renderer": "^15.4.2",
"react-transform-hmr": "^1.0.4",
"redux-devtools": "^3.3.1",
"redux-devtools-dock-monitor": "^1.1.1",
"redux-devtools-log-monitor": "^1.0.11",
"regenerator-runtime": "^0.10.3",
"remotedev": "^0.1.2",
"rimraf": "^2.5.2",
"sass-loader": "3.2.0",
"storybook-addon-material-ui": "^0.7.6",
"style-loader": "0.13.1",
"url-loader": "0.5.7",
"vueify": "^9.4.0",
"webpack": "^1.13.0",
"webpack-babel-jest": "^1.0.4",
"webpack-dev-middleware": "^1.6.1",
"webpack-dev-server": "^1.16.3",
"webpack-hot-middleware": "^2.10.0"
}
}
I used import "babel-polyfill" and it solved my problem.
Update 2020:
This answer is outdated, babel-polyfill is deprecated. Look into the docs and the answer by Jero.