WIP upgrade to create-react-app v2.1.2

Requires changes from PR #346 which are published as
react-app-rewired@2.0.2-next.0

timarney/react-app-rewired#346

.eslintrc

@@ -49,14 +49,6 @@
     /* import */
     "import/prefer-default-export": 1,
     "import/no-named-default": 0,
-    "import/extensions": 0,
-
-    "new-cap": [2, {
-      "capIsNewExceptions": [
-        "Immutable.Map",
-        "Immutable.List",
-        "Immutable.Set"
-      ]
-    }]
+    "import/extensions": 0
   }
 }

package.json

@@ -2,8 +2,8 @@
   "private": true,
   "license": "Apache-2.0",
   "devDependencies": {
-    "babel-eslint": "^7.2.3",
-    "eslint": "^4.5.0",
+    "babel-eslint": "9.x.x",
+    "eslint": "5.6.0",
     "eslint-config-airbnb": "^15.1.0",
     "eslint-config-prettier": "^2.3.0",
     "eslint-config-react-app": "^2.0.0",
@@ -16,7 +16,8 @@
     "husky": "^0.14.3",
     "lerna": "^2.10.2",
     "lint-staged": "^7.0.4",
-    "prettier": "^1.10.2"
+    "prettier": "^1.10.2",
+    "rxjs-compat": "6.3.3"
   },
   "workspaces": ["packages/*"],
   "scripts": {

packages/jaeger-ui/config-overrides.js

@@ -13,27 +13,38 @@
 // limitations under the License.
 
 /* eslint-disable import/no-extraneous-dependencies */
-
-const path = require('path');
 const fs = require('fs');
 const { injectBabelPlugin } = require('react-app-rewired');
 const rewireLess = require('react-app-rewire-less');
 const lessToJs = require('less-vars-to-js');
-const rewireBabelLoader = require('react-app-rewire-babel-loader');
-
-const appDirectory = fs.realpathSync(process.cwd());
-const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
 
-// Read the less file in as string
+// Convert less vars to JS
 const loadedVarOverrides = fs.readFileSync('config-overrides-antd-vars.less', 'utf8');
-
-// Pass in file contents
 const modifyVars = lessToJs(loadedVarOverrides);
 
-module.exports = function override(_config, env) {
+function webpack(_config, env) {
   let config = _config;
-  config = injectBabelPlugin(['import', { libraryName: 'antd', style: true }], config);
-  config = rewireLess.withLoaderOptions({ modifyVars })(config, env);
-  config = rewireBabelLoader.include(config, resolveApp('../../node_modules/drange'));
+  config = rewireLess.withLoaderOptions({
+    modifyVars,
+    javascriptEnabled: true,
+  })(config, env);
+  config = injectBabelPlugin(
+    ['import', { libraryName: 'antd', style: true, libraryDirectory: 'lib' }],
+    config
+  );
   return config;
-};
+}
+
+// Don't use react-app-rewired/scripts/utils/babelTransform.js for the jest
+// transform - it has an issue with automatically loading decorators.
+function jest(config) {
+  const _config = config;
+  Object.keys(_config.transform).forEach(key => {
+    if (_config.transform[key].endsWith('babelTransform.js')) {
+      _config.transform[key] = require.resolve('./jest-babel-transform.js');
+    }
+  });
+  return config;
+}
+
+module.exports = { jest, webpack };

packages/jaeger-ui/jest-babel-transform.js

@@ -0,0 +1,23 @@
+// Copyright (c) 2019 Uber Technologies, Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+// eslint-disable-next-line import/no-extraneous-dependencies
+const babelJest = require('babel-jest');
+
+// Derived from react-app-rewired/scripts/utils/babelTransform.js
+module.exports = babelJest.createTransformer({
+  presets: [require.resolve('babel-preset-react-app')],
+  plugins: [],
+  babelrc: true,
+});

packages/jaeger-ui/package.json

@@ -4,28 +4,19 @@
   "version": "0.0.1",
   "main": "src/index.js",
   "license": "Apache-2.0",
-  "proxy": {
-    "/api": {
-      "target": "http://localhost:16686",
-      "logLevel": "silent",
-      "secure": false,
-      "changeOrigin": true,
-      "ws": true,
-      "xfwd": true
-    }
-  },
   "homepage": ".",
   "devDependencies": {
-    "babel-plugin-import": "^1.6.3",
+    "babel-plugin-import": "1.11.0",
     "bluebird": "^3.5.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "enzyme-to-json": "^3.3.0",
+    "http-proxy-middleware": "^0.19.1",
     "less-vars-to-js": "^1.2.1",
     "react-app-rewire-babel-loader": "^0.1.1",
-    "react-app-rewire-less": "^2.1.0",
-    "react-app-rewired": "^1.4.0",
-    "react-scripts": "^1.0.11",
+    "react-app-rewire-less": "2.1.3",
+    "react-app-rewired": "2.0.2-next.0",
+    "react-scripts": "2.1.2",
     "react-test-renderer": "^15.6.1",
     "sinon": "^3.2.1",
     "source-map-explorer": "^1.6.0"
@@ -47,7 +38,6 @@
     "history": "^4.6.3",
     "is-promise": "^2.1.0",
     "isomorphic-fetch": "^2.2.1",
-    "jest": "^21.2.1",
     "json-markup": "^1.1.0",
     "lodash": "^4.17.4",
     "logfmt": "^1.2.0",
@@ -96,5 +86,6 @@
       "!src/utils/test/**/*.js",
       "!src/demo/**/*.js"
     ]
-  }
+  },
+  "browserslist": [">0.2%", "not dead", "not ie <= 11", "not op_mini all"]
 }

packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/ListView/index.test.js

@@ -13,7 +13,6 @@
 // limitations under the License.
 
 import React from 'react';
-import Bluebird from 'bluebird';
 import { mount, shallow } from 'enzyme';
 
 import ListView from './index';
@@ -205,14 +204,16 @@ describe('<ListView>', () => {
         expect(eventListeners.scroll).toEqual([instance._onScroll]);
       });
 
-      it('calls _positionList when the document is scrolled', async () => {
+      it('calls _positionList when the document is scrolled', done => {
         const event = new Event('scroll');
         const fn = jest.spyOn(instance, '_positionList');
         expect(instance._isScrolledOrResized).toBe(false);
         window.dispatchEvent(event);
         expect(instance._isScrolledOrResized).toBe(true);
-        await Bluebird.resolve().delay(0);
-        expect(fn).toHaveBeenCalled();
+        window.requestAnimationFrame(() => {
+          expect(fn).toHaveBeenCalled();
+          done();
+        });
       });
 
       it('uses the root HTML element to determine if the view has changed', () => {

packages/jaeger-ui/src/setupProxy.js

@@ -0,0 +1,29 @@
+// Copyright (c) 2019 Uber Technologies, Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+// eslint-disable-next-line import/no-extraneous-dependencies
+const proxy = require('http-proxy-middleware');
+
+module.exports = function setupProxy(app) {
+  app.use(
+    proxy('/api', {
+      target: 'http://localhost:16686',
+      logLevel: 'silent',
+      secure: false,
+      changeOrigin: true,
+      ws: true,
+      xfwd: true,
+    })
+  );
+};

packages/jaeger-ui/src/utils/number.test.js

@@ -27,9 +27,10 @@ it('toFloatPrecision() should work for greater-than-0 numbers', () => {
 
 it('toFloatPrecision() should work for less-than-0 numbers', () => {
   expect(numberUtils.toFloatPrecision(0.24, 1)).toBe(0.2);
-  expect(numberUtils.toFloatPrecision(-0.026, 1)).toBe(0);
   expect(numberUtils.toFloatPrecision(0.51, 1)).toBe(0.5);
   expect(numberUtils.toFloatPrecision(-0.307, 2)).toBe(-0.31);
+  // Had an issue with expect(-0).toBe(0) failing
+  expect(numberUtils.toFloatPrecision(-0.026, 1)).toBeCloseTo(0);
 });
 
 it('toFloatPrecision() should work for e-notation numbers', () => {

packages/plexus/nwb.config.js

@@ -42,9 +42,6 @@ module.exports = function nwbConfig() {
     },
     devServer: { hot: false },
     webpack: {
-      extractText: {
-        filename: process.env.NODE_ENV === 'production' ? `plexus.[contenthash:8].css` : 'plexus.css',
-      },
       extra: {
         devtool: 'source-map',
         module: {
@@ -54,7 +51,11 @@ module.exports = function nwbConfig() {
               use: [
                 {
                   loader: require.resolve('worker-loader'),
-                  options: { inline: true, fallback: false, name: '[name].[hash:8].js' },
+                  options: {
+                    inline: true,
+                    fallback: false,
+                    name: '[name].[hash:8].js',
+                  },
                 },
               ],
             },

packages/plexus/package.json

@@ -22,7 +22,7 @@
     "react": "16.x"
   },
   "devDependencies": {
-    "nwb": "0.21.x",
+    "nwb": "0.23.0",
     "react": "^16.3.2",
     "react-dom": "^16.3.2",
     "worker-loader": "^1.1.1"