Merge pull request #25 from Thinkei/ft/upgrade-react-17

[FC-21]-[FC-48]: Upgraded react & react-dom from 16.9.0 to 17.0.2; Configure to switch react versions when running tests; Fix vulnerabilities

jest.config.js

@@ -0,0 +1,18 @@
+const isReact16 = process.env.IS_REACT_16;
+
+const baseConfig = {
+  testRegex:
+    '((/__tests__/.*|\\.(test|spec))\\.(js|jsx)$|app/react/.*\\-test\\.(js|jsx)$)',
+  snapshotSerializers: ['enzyme-to-json/serializer'],
+};
+
+if (isReact16) {
+  module.exports = Object.assign({}, baseConfig, {
+    moduleNameMapper: {
+      '^react($|\\/.+)': 'react16$1',
+      '^react-dom($|\\/.+)': 'react16-dom$1',
+    },
+  });
+} else {
+  module.exports = baseConfig;
+}

package.json

@@ -7,6 +7,7 @@
     "prepare": "npm run build",
     "lint": "./node_modules/eslint/bin/eslint.js ./src --fix",
     "test": "./node_modules/jest/bin/jest.js",
+    "test:react16": "IS_REACT_16=true ./node_modules/jest/bin/jest.js",
     "update-test": "npm run test -- -u",
     "clean": "rm -rf dist",
     "build": "npm run clean && mkdir dist && ./node_modules/babel-cli/bin/babel.js ./src/index.js --out-file ./dist/index.js",
@@ -30,6 +31,7 @@
   },
   "homepage": "https://github.com/kovndr/braintree-dropin-react#readme",
   "devDependencies": {
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
     "babel-cli": "^6.26.0",
     "babel-eslint": "^8.1.2",
     "babel-loader": "^7.1.2",
@@ -41,7 +43,7 @@
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.1",
     "enzyme-to-json": "^3.3.0",
-    "eslint": "^4.14.0",
+    "eslint": "^4.18.2",
     "eslint-config-babel": "^7.0.2",
     "eslint-config-standard": "^11.0.0-beta.0",
     "eslint-config-standard-jsx": "^4.0.2",
@@ -52,14 +54,18 @@
     "eslint-plugin-react": "^7.5.1",
     "eslint-plugin-standard": "^3.0.1",
     "jest": "^22.0.4",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "react16": "npm:[email protected]",
+    "react16-dom": "npm:[email protected]",
+    "prop-types": "^15.8.1",
     "react-addons-test-utils": "^15.6.2",
     "react-test-renderer": "^16.2.0",
     "webpack": "^3.10.0",
-    "webpack-dev-server": "^2.9.7"
+    "webpack-dev-server": "^2.11.4"
   },
-  "dependencies": {
-    "prop-types": "^15.6.0",
-    "react": "^16.5.2",
-    "react-dom": "^16.5.2"
+  "peerDependencies": {
+    "react": "16.9.0 || 17.0.2",
+    "react-dom": "16.9.0 || 17.0.2"
   }
 }

src/index.spec.js

@@ -1,12 +1,23 @@
 /* eslint-disable */
 import 'babel-polyfill'
-import React from 'react'
 import Enzyme, { shallow, mount } from 'enzyme'
-import Adapter from 'enzyme-adapter-react-16';
 import { shallowToJson } from 'enzyme-to-json'
 import braintree from 'braintree-web-drop-in'
 import BraintreeDropin from '../dist'
 
+const isReact16 = process.env.IS_REACT_16;
+
+let Adapter = null;
+let React = null;
+
+if (isReact16) {
+  Adapter = require('enzyme-adapter-react-16');
+  React = require('react16');
+} else {
+  Adapter = require('@wojtekmaj/enzyme-adapter-react-17');
+  React = require('react');
+}
+
 Enzyme.configure({ adapter: new Adapter() });
 
 describe('<BraintreeDropin />', () => {