Get UI unit tests working again w latest enzyme pkg

For whatever reason, the latest version of Enzyme requires an `Adapter` to be configured. We also run the linting before the unit tests since linting can actually catch errors in the code before they cause the unit tests to fail.
distributed-system-analysis · Nov 7, 2019 · 1fd4ee7 · 1fd4ee7
1 parent 1eea138
commit 1fd4ee7
Show file tree

Hide file tree

Showing 13 changed files with 45 additions and 22 deletions.
diff --git a/web-server/v0.4/package.json b/web-server/v0.4/package.json
@@ -31,6 +31,7 @@
     "dva": "^2.4.1",
     "dva-core": "^1.1.0",
     "enquire-js": "^0.2.1",
+    "enzyme-adapter-react-16": "^1.15.1",
     "html2canvas": "^1.0.0-alpha.12",
     "jschart": "^1.0.7",
     "jspdf": "^1.5.3",
@@ -60,7 +61,7 @@
     "babel-eslint": "9.x",
     "cross-env": "^5.1.1",
     "cross-port-killer": "^1.0.1",
-    "enzyme": "^3.1.0",
+    "enzyme": "3.10.0",
     "eslint": "^5.0.0",
     "eslint-config-airbnb": "^17.0.0",
     "eslint-config-prettier": "^6.0.0",

diff --git a/web-server/v0.4/src/components/Button/index.test.js b/web-server/v0.4/src/components/Button/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import Button from './index';
 
 const mockProps = {
@@ -10,6 +11,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Button dispatch={mockDispatch} {...mockProps} />);
 
 describe('test rendering of Button component', () => {

diff --git a/web-server/v0.4/src/components/RowSelection/index.test.js b/web-server/v0.4/src/components/RowSelection/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import RowSelection from './index';
 import Button from '../Button';
 
@@ -11,6 +12,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<RowSelection dispatch={mockDispatch} {...mockProps} />, {
   lifecycleExperimental: true,
 });

diff --git a/web-server/v0.4/src/components/Table/index.test.js b/web-server/v0.4/src/components/Table/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import Table from './index';
 
 const mockProps = {
@@ -9,6 +10,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Table dispatch={mockDispatch} {...mockProps} />);
 
 describe('test rendering of Table component', () => {

diff --git a/web-server/v0.4/src/components/TableFilterSelection/index.test.js b/web-server/v0.4/src/components/TableFilterSelection/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import TableFilterSelection from './index';
 import Button from '../Button';
 
@@ -18,6 +19,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<TableFilterSelection dispatch={mockDispatch} {...mockProps} />, {
   lifecycleExperimental: true,
 });

diff --git a/web-server/v0.4/src/components/TimeseriesGraph/index.test.js b/web-server/v0.4/src/components/TimeseriesGraph/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow, mount } from 'enzyme';
+import { shallow, mount, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import TimeseriesGraph from './index';
 
 const mockProps = {
@@ -22,6 +23,7 @@ jest.mock('jschart', () => ({
     return 'true';
   }),
 }));
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<TimeseriesGraph dispatch={mockDispatch} {...mockProps} />, {
   lifecycleExperimental: true,
 });

diff --git a/web-server/v0.4/src/pages/ComparisonSelect/index.test.js b/web-server/v0.4/src/pages/ComparisonSelect/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 
 import ComparisonSelect from './index';
 import PageHeaderLayout from '../../layouts/PageHeaderLayout';
@@ -12,6 +13,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(
   <ComparisonSelect.WrappedComponent dispatch={mockDispatch} {...mockProps} />,
   { disableLifecycleMethods: true }

diff --git a/web-server/v0.4/src/pages/Controllers/index.test.js b/web-server/v0.4/src/pages/Controllers/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import Controllers from './index';
 
 import Table from '@/components/Table';
@@ -13,6 +14,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Controllers.WrappedComponent dispatch={mockDispatch} {...mockProps} />, {
   disableLifecycleMethods: true,
 });

diff --git a/web-server/v0.4/src/pages/Results/index.test.js b/web-server/v0.4/src/pages/Results/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import Results from './index';
 
 import Table from '@/components/Table';
@@ -11,6 +12,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Results.WrappedComponent dispatch={mockDispatch} {...mockProps} />, {
   disableLifecycleMethods: true,
 });

diff --git a/web-server/v0.4/src/pages/RunComparison/index.test.js b/web-server/v0.4/src/pages/RunComparison/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import 'jest-canvas-mock';
 
 import RunComparison from './index';
@@ -31,6 +32,7 @@ clusterLabels.sample_metric = ['sample-1'];
 const selectedConfig = ['benchmark-sample-1'];
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(
   <RunComparison.WrappedComponent dispatch={mockDispatch} location={mockLocation} {...mockProps} />,
   { disableLifecycleMethods: true }

diff --git a/web-server/v0.4/src/pages/Search/index.test.js b/web-server/v0.4/src/pages/Search/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 
 import Search from './index';
 
@@ -16,6 +17,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Search.WrappedComponent dispatch={mockDispatch} {...mockProps} />, {
   disableLifecycleMethods: true,
 });

diff --git a/web-server/v0.4/src/pages/Summary/index.test.js b/web-server/v0.4/src/pages/Summary/index.test.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 
 import Summary from './index';
 
@@ -15,6 +16,7 @@ const mockProps = {
 };
 
 const mockDispatch = jest.fn();
+configure({ adapter: new Adapter() });
 const wrapper = shallow(<Summary.WrappedComponent dispatch={mockDispatch} {...mockProps} />, {
   disableLifecycleMethods: true,
 });

diff --git a/web-server/v0.4/unittests b/web-server/v0.4/unittests
@@ -1,19 +1,19 @@
 #!/bin/bash
 
-cd $(dirname $0)
-yarn --network-timeout 1000000
-if [[ $? -ne 0 ]]; then
-  echo "yarn failed!" >&2
-  exit 1
-fi
-yarn test
-if [[ $? -ne 0 ]]; then
-  echo "yarn unit tests failed!" >&2
+cd $(dirname ${0})
+yarn install --network-timeout 1000000
+if [[ ${?} -ne 0 ]]; then
+  echo "yarn install failed!" >&2
   exit 1
 fi
 yarn lint
-if [[ $? -ne 0 ]]; then
+if [[ ${?} -ne 0 ]]; then
   echo "yarn lint failed!" >&2
   exit 1
 fi
+yarn test
+if [[ ${?} -ne 0 ]]; then
+  echo "yarn unit tests failed!" >&2
+  exit 1
+fi
 exit 0