Merge pull request #13 from shinxi/MAX-5172

MAX-5172 CRA unable to run tests after install

Author: Josh Sylvester

packages/react-scripts/config/paths.js

@@ -58,7 +58,7 @@ module.exports = {
   appPackageJson: resolveApp('package.json'),
   appSrc: resolveApp('src'),
   yarnLockFile: resolveApp('yarn.lock'),
-  testsSetup: resolveApp('src/setupTests.js'),
+  testsSetup: resolveApp('src/test/jest-setup.js'),
   appNodeModules: resolveApp('node_modules'),
   publicUrl: getPublicUrl(resolveApp('package.json')),
   servedPath: getServedPath(resolveApp('package.json')),
@@ -78,7 +78,7 @@ module.exports = {
   appPackageJson: resolveApp('package.json'),
   appSrc: resolveApp('src'),
   yarnLockFile: resolveApp('yarn.lock'),
-  testsSetup: resolveApp('src/setupTests.js'),
+  testsSetup: resolveApp('src/test/jest-setup.js'),
   appNodeModules: resolveApp('node_modules'),
   publicUrl: getPublicUrl(resolveApp('package.json')),
   servedPath: getServedPath(resolveApp('package.json')),
@@ -108,7 +108,7 @@ if (
     appPackageJson: resolveOwn('package.json'),
     appSrc: resolveOwn('template/src'),
     yarnLockFile: resolveOwn('template/yarn.lock'),
-    testsSetup: resolveOwn('template/src/setupTests.js'),
+    testsSetup: resolveOwn('template/src/test/jest-setup.js'),
     appNodeModules: resolveOwn('node_modules'),
     publicUrl: getPublicUrl(resolveOwn('package.json')),
     servedPath: getServedPath(resolveOwn('package.json')),

packages/react-scripts/config/webpack.config.dev.js

@@ -11,6 +11,7 @@
 'use strict';
 
 const autoprefixer = require('autoprefixer');
+const fs = require('fs');
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -33,6 +34,8 @@ const publicUrl = '';
 // Get environment variables to inject into our app.
 const env = getClientEnvironment(publicUrl);
 
+const containUIComponents = fs.existsSync(path.resolve(paths.appNodeModules, "@svmx/ui-components-predix/bower_components"));
+
 // This is the development configuration.
 // It is focused on developer experience and fast rebuilds.
 // The production configuration is different and lives in a separate file.
@@ -259,7 +262,8 @@ module.exports = {
     new InterpolateHtmlPlugin(env.raw),
     // Generates an `index.html` file with the <script> injected.
     new HtmlWebpackPlugin({
-      inject: false,
+      inject: !containUIComponents,
+      containUIComponents: containUIComponents,
       template: paths.appHtml,
     }),
     // Add module names to factory functions so they appear in browser profiler.
@@ -286,7 +290,8 @@ module.exports = {
     new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),    
     new CopyWebpackPlugin([
       {
-        from: 'node_modules/@svmx/ui-components-predix/bower_components',
+        context: path.resolve(paths.appNodeModules, "@svmx/ui-components-predix/bower_components"),
+        from: '**/*',
         to: 'bower_components',
       },
     ])

packages/react-scripts/config/webpack.config.prod.js

@@ -11,6 +11,7 @@
 'use strict';
 
 const autoprefixer = require('autoprefixer');
+const fs = require('fs');
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -39,6 +40,8 @@ const publicUrl = publicPath.slice(0, -1);
 // Get environment variables to inject into our app.
 const env = getClientEnvironment(publicUrl);
 
+const containUIComponents = fs.existsSync(path.resolve(paths.appNodeModules, "@svmx/ui-components-predix/bower_components"));
+
 // Assert this just to be safe.
 // Development builds of React are slow and not intended for production.
 if (env.stringified['process.env'].NODE_ENV !== '"production"') {
@@ -279,8 +282,8 @@ module.exports = {
     new InterpolateHtmlPlugin(env.raw),
     // Generates an `index.html` file with the <script> injected.
     new HtmlWebpackPlugin({
-      inject: false,
-      template: paths.appHtml,
+      inject: !containUIComponents,
+      containUIComponents: containUIComponents,
       minify: {
         removeComments: true,
         collapseWhitespace: true,
@@ -365,7 +368,8 @@ module.exports = {
     new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
     new CopyWebpackPlugin([
       {
-        from: 'node_modules/@svmx/ui-components-predix/bower_components',
+        context: path.resolve(paths.appNodeModules, "@svmx/ui-components-predix/bower_components"),
+        from: '**/*',
         to: 'bower_components',
       },
     ])

packages/react-scripts/package.json

@@ -39,7 +39,8 @@
     "copy-webpack-plugin": "^4.2.0",
     "css-loader": "0.28.4",
     "dotenv": "4.0.0",
-    "enzyme": "2.9.0",
+    "enzyme": "^3.1.0",
+    "enzyme-adapter-react-16": "^1.0.2",
     "eslint": "~4.7.1",
     "eslint-config-airbnb": "^15.1.0",
     "eslint-config-react-app": "2.0.0",
@@ -66,7 +67,7 @@
     "react-error-overlay": "1.0.6",
     "react-router": "^4.2.0",
     "react-router-dom": "^4.2.2",
-    "react-test-renderer": "15.6.1",
+    "react-test-renderer": "16.0.0",
     "sass-loader": "6.0.6",
     "style-loader": "0.18.2",
     "sw-precache-webpack-plugin": "0.11.4",

packages/react-scripts/scripts/utils/createJestConfig.js

@@ -17,7 +17,7 @@ module.exports = (resolve, rootDir, isEjecting) => {
   // Use this instead of `paths.testsSetup` to avoid putting
   // an absolute filename into configuration after ejecting.
   const setupTestsFile = fs.existsSync(paths.testsSetup)
-    ? '<rootDir>/src/setupTests.js'
+    ? '<rootDir>/src/test/jest-setup.js'
     : undefined;
 
   // TODO: I don't know if it's safe or not to just use / as path separator

packages/react-scripts/template/.eslintrc.json

@@ -15,6 +15,7 @@
     "sourceType": "module"
   },
   "rules": {
+    "arrow-parens": "off", // Incompatible with prettier
     "no-unused-vars": "warn",
     "no-debugger": "warn",
     "no-console": "warn",
@@ -23,7 +24,6 @@
     "import/first": "off",
     "react/jsx-filename-extension": "off",
     "react/prefer-stateless-function": "off",
-    "react/jsx-closing-bracket-location": [1, "props-aligned"],
     "react/require-default-props": "off"
   },
   "settings": {

packages/react-scripts/template/.template.dependencies.json

@@ -2,10 +2,11 @@
   "dependencies": {
     "lodash": "4.17.4",
     "prop-types": "15.5.10",
-    "react-redux": "5.0.5",
-    "react-router": "4.1.1",
-    "react-router-dom": "4.1.1",
-    "redux": "3.6.0",
+    "react": "16.0.0",
+    "react-redux": "5.0.6",
+    "react-router": "4.2.0",
+    "react-router-dom": "4.2.2",
+    "redux": "3.7.2",
     "redux-mock-store": "1.2.3",
     "redux-promise": "0.5.3",
     "redux-thunk": "2.2.0"