davidkpiano / react-redux-form

Create forms easily in React with Redux.
https://davidkpiano.github.io/react-redux-form
MIT License
2.07k stars 251 forks source link

forms-reducer contains trailing comma after rest property, preventing transpiling for Jest #1199

Open electricsam opened 5 years ago

electricsam commented 5 years ago

The Problem

Running Jest tests with my project requires transpiling react-redux-form. In doing so with Babel 7.2.2 with @babel/plugin-proposal-object-rest-spread 7.3.1, an error is thrown:

SyntaxError: /Users/....../frontend/node_modules/react-redux-form/src/reducers/forms-reducer.js: > A trailing comma is not permitted after the rest property (39:20)

 37 |       key,
 38 |       plugins,
39 |       ...formOptions,
    |                     ^
 40 |     } = optionsWithDefaults;
41 | 
 42 |     formKeys.forEach((formKey) => {

 at Object.raise (node_modules/@babel/parser/lib/index.js:3834:17)
 at Object.raiseCommaAfterRest (node_modules/@babel/parser/lib/index.js:5548:10)
 at Object.checkCommaAfterRest (node_modules/@babel/parser/lib/index.js:5534:14)
 at Object.parseObj (node_modules/@babel/parser/lib/index.js:6623:16)
 at Object.parseBindingAtom (node_modules/@babel/parser/lib/index.js:5396:21)
 at Object.parseVarHead (node_modules/@babel/parser/lib/index.js:7848:20)
 at Object.parseVar (node_modules/@babel/parser/lib/index.js:7824:12)
 at Object.parseVarStatement (node_modules/@babel/parser/lib/index.js:7656:10)
 at Object.parseStatementContent (node_modules/@babel/parser/lib/index.js:7253:21)
 at Object.parseStatement (node_modules/@babel/parser/lib/index.js:7199:17)

According to the spec, trailing commas are not allowed after the rest property.

Steps to Reproduce

Transpile with Babel 7.2.2 and @babel/plugin-proposal-object-rest-spread 7.3.1

Here is my relevant Jest config:

jest.config.js

module.exports = {

  // Automatically clear mock calls and instances between every test
  clearMocks: true,

  // A map from regular expressions to module names that allow to stub out resources with a single module
  moduleNameMapper: {
    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/__mocks__/fileMock.js',
    '\\.(css|less)$': '<rootDir>/__mocks__/styleMock.js',
  },

  // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
  transformIgnorePatterns: [
    '/node_modules/(?!(react-redux-form)/)',
]
};

package.json

{
  "name": "idb",
  "version": "1.0.0",
  "description": "",
  "license": "",
  "private": true,
  "dependencies": {
    "@babel/polyfill": "7.2.5",
    "@ckeditor/ckeditor5-build-classic": "11.2.0",
    "@ckeditor/ckeditor5-engine": "12.0.0",
    "@ckeditor/ckeditor5-react": "1.1.0",
    "@ckeditor/ckeditor5-utils": "11.1.0",
    "@fortawesome/fontawesome-svg-core": "1.2.13",
    "@fortawesome/free-brands-svg-icons": "5.7.0",
    "@fortawesome/free-solid-svg-icons": "5.7.0",
    "@fortawesome/react-fontawesome": "0.1.4",
    "axios": "0.18.0",
    "bootstrap": "4.2.1",
    "classnames": "2.2.6",
    "file-saver": "2.0.0",
    "history": "4.7.2",
    "immutable": "3.8.2",
    "json2csv": "4.3.3",
    "moment": "2.24.0",
    "prop-types": "15.6.2",
    "qs": "6.6.0",
    "react": "16.7.0",
    "react-dom": "16.7.0",
    "react-popper": "1.3.3",
    "react-redux": "6.0.0",
    "react-redux-form": "1.16.12",
    "react-router": "4.3.1",
    "react-router-dom": "4.3.1",
    "react-transition-group": "2.5.3",
    "react-virtualized": "9.21.0",
    "reactstrap": "7.1.0",
    "redux": "4.0.1",
    "redux-immutable": "4.0.0",
    "redux-logger": "3.0.6",
    "redux-saga": "0.16.2",
    "throttle-debounce": "2.0.1",
    "uuid": "3.3.2"
  },
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-object-rest-spread": "7.3.1",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "autoprefixer": "9.4.7",
    "babel-core": "^6.26.3",
    "babel-jest": "^24.0.0",
    "babel-loader": "8.0.5",
    "babel-plugin-transform-object-rest-spread": "6.26.0",
    "babel-polyfill": "6.26.0",
    "clean-webpack-plugin": "1.0.1",
    "css-loader": "2.1.0",
    "enzyme": "^3.8.0",
    "enzyme-adapter-react-16": "^1.8.0",
    "eslint": "5.12.1",
    "eslint-config-airbnb": "17.1.0",
    "eslint-formatter-friendly": "6.0.0",
    "eslint-loader": "2.1.0",
    "eslint-plugin-import": "2.16.0",
    "eslint-plugin-jsx-a11y": "6.2.0",
    "eslint-plugin-react": "7.12.4",
    "file-loader": "3.0.1",
    "html-webpack-plugin": "3.2.0",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^24.0.0",
    "mini-css-extract-plugin": "0.5.0",
    "node-sass": "4.11.0",
    "optimize-css-assets-webpack-plugin": "5.0.1",
    "postcss-import": "12.0.1",
    "postcss-loader": "3.0.0",
    "postcss-nested": "4.1.1",
    "react-test-renderer": "^16.7.0",
    "redux-devtools": "3.5.0",
    "redux-mock-store": "^1.5.3",
    "resolve-url-loader": "3.0.0",
    "sass-loader": "7.1.0",
    "style-loader": "0.23.1",
    "terser-webpack-plugin": "1.2.1",
    "webpack": "4.29.0",
    "webpack-cli": "3.2.1",
    "webpack-dev-server": "3.1.14",
    "webpack-merge": "4.2.1"
  },
  "scripts": {
    "start": "NODE_ENV=development webpack-dev-server --open --config webpack.dev.js",
    "build": "NODE_ENV=production webpack --config webpack.prod.js",
    "lint": "eslint --fix src",
    "test": "jest --no-cache"
  }
}

babel.config.js

module.exports = {
  presets: [
    '@babel/preset-env',
    '@babel/preset-react',
  ],
  plugins: [
    '@babel/plugin-proposal-object-rest-spread',
  ],
};

Expected Behavior

Transpile is successful

Actual Behavior

Error is thrown

davidkpiano commented 5 years ago

Please provide a PR to fix this.