DIG-29243: Updated to support React 16

SpareBank1 · Nov 2, 2017 · b49819d · b49819d
1 parent 14517af
commit b49819d
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 37 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,4 +1,8 @@
 # Changelog
+# v.7.10.1
+* Updated to support React 16. 
+* Upgraded npm dependencies. 
+
 # v.7.10.0
 * Show correct currency for accounts with currencyCodes other than NOK.
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ffe-account-selector-react",
-  "version": "7.10.0",
+  "version": "7.10.1",
   "main": "lib/index.js",
   "scripts": {
     "build": "babel -d lib/. --ignore=*.test.js src/.",
@@ -14,16 +14,17 @@
     "postpublish": "git tag ${npm_package_version} && git push --tags"
   },
   "devDependencies": {
-    "babel-cli": "^6.23.0",
-    "babel-core": "^6.23.1",
-    "babel-plugin-transform-object-rest-spread": "^6.23.0",
-    "babel-preset-es2015": "^6.22.0",
-    "babel-preset-react": "^6.23.0",
+    "babel-cli": "^6.26.0",
+    "babel-core": "^6.26.0",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
     "babel-register": "^6.23.0",
-    "babelify": "^7.3.0",
-    "budo": "^9.4.7",
-    "chai": "^3.5.0",
-    "enzyme": "^2.7.1",
+    "babelify": "^8.0.0",
+    "budo": "^10.0.4",
+    "chai": "^4.1.2",
+    "enzyme": "^3.1.0",
+    "enzyme-adapter-react-16": "^1.0.3",
     "eslint": "^3.16.1",
     "eslint-config-ffe": "^6.0.1",
     "eslint-plugin-import": "^2.2.0",
@@ -34,15 +35,14 @@
     "ffe-form": "^8.x",
     "ffe-icons": "^7.4.1",
     "ffe-spinner": "^2.0.1",
-    "jsdom": "^9.11.0",
-    "mocha": "^3.5.3",
-    "node-lessify": "^0.1.4",
-    "nsp": "^2.6.2",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-test-renderer": "^15.6.1",
-    "react-dom": "^15.4.2",
-    "sinon": "^1.17.7"
+    "jsdom": "^11.3.0",
+    "mocha": "^4.0.1",
+    "node-lessify": "^0.1.5",
+    "nsp": "^2.8.1",
+    "react": "^16.0.0",
+    "react-test-renderer": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "sinon": "^4.0.2"
   },
   "peerDependencies": {
     "ffe-form": "4.x - 8.x",
@@ -69,8 +69,8 @@
     "ffe-spinner-react": "^2.0.3",
     "lodash.isequal": "4.5.0",
     "nfe-amount-formatter": "2.0.1",
-    "prop-types": "15.5.9",
     "react-auto-bind": "^0.4.0",
-    "react-custom-scrollbars": "4.1.2"
+    "react-custom-scrollbars": "^4.2.1",
+    "prop-types": "^15.6.0"
   }
 }
diff --git a/src/selectors/account.selector.test.js b/src/selectors/account.selector.test.js
@@ -1,4 +1,5 @@
-import { mount } from 'enzyme';
+import Enzyme, { mount } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import { expect } from 'chai';
 import sinon from 'sinon';
 import React from 'react';
@@ -7,6 +8,8 @@ import SuggestionItem from '../suggestion/suggestion-item';
 import Input from './input-field';
 import '../suggestion/test/setup-dom';
 
+Enzyme.configure({adapter: new Adapter()});
+
 const accounts = [
   {
     id: '1',

diff --git a/src/selectors/base-selector.test.js b/src/selectors/base-selector.test.js
@@ -1,4 +1,5 @@
-import { shallow, mount } from 'enzyme';
+import Enzyme, { shallow, mount } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import { assert } from 'chai';
 import sinon from 'sinon';
 import React from 'react';
@@ -8,6 +9,8 @@ import Input from './input-field';
 import { KeyCodes } from '../util/types';
 import '../suggestion/test/setup-dom';
 
+Enzyme.configure({adapter: new Adapter()});
+
 function suggestions() {
   return [
     { header: '1' },

diff --git a/src/suggestion/test/setup-dom.js b/src/suggestion/test/setup-dom.js
@@ -1,5 +1,5 @@
 import jsdom from 'jsdom';
-
-const doc = jsdom.jsdom('<!doctype html><html><body></body></html>');
-global.document = doc;
-global.window = doc.defaultView;
+const {JSDOM} = jsdom;
+const {document} = (new JSDOM('<!doctype html><html><body></body></html>')).window;
+global.document = document;
+global.window = document.defaultView;
diff --git a/src/suggestion/test/suggestion-item.test.js b/src/suggestion/test/suggestion-item.test.js
@@ -1,10 +1,13 @@
-import {mount} from 'enzyme';
+import Enzyme, {mount} from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import {assert} from 'chai';
 import React from 'react';
 import  SuggestionItem from '../suggestion-item';
 import sinon from 'sinon';
 import './setup-dom';
 
+Enzyme.configure({adapter: new Adapter()});
+
 function item() {
   return {header: 'header'};
 }
@@ -37,17 +40,17 @@ describe('<SuggestionItem />', () => {
     const refHighlightedSuggestionSpy = sinon.spy();
     const wrapper = renderSuggestionItem(true, refHighlightedSuggestionSpy);
 
-    assert.isTrue(wrapper.hasClass('ffe-account-suggestion--highlighted'));
-    assert.isTrue(wrapper.hasClass('ffe-account-suggestion'));
+    assert.isTrue(wrapper.children().hasClass('ffe-account-suggestion--highlighted'));
+    assert.isTrue(wrapper.children().hasClass('ffe-account-suggestion'));
     assert.isTrue(refHighlightedSuggestionSpy.calledOnce);
   });
 
   it('not Highlighted', () => {
     const refHighlightedSuggestionSpy = sinon.spy();
     const wrapper = renderSuggestionItem(false, refHighlightedSuggestionSpy);
 
-    assert.isFalse(wrapper.hasClass('ffe-account-suggestion--highlighted'));
-    assert.isTrue(wrapper.hasClass('ffe-account-suggestion'));
+    assert.isFalse(wrapper.children().hasClass('ffe-account-suggestion--highlighted'));
+    assert.isTrue(wrapper.children().hasClass('ffe-account-suggestion'));
     assert.isFalse(refHighlightedSuggestionSpy.called);
   });
 

diff --git a/src/suggestion/test/suggestion-list.test.js b/src/suggestion/test/suggestion-list.test.js
@@ -1,4 +1,5 @@
-import { shallow, mount } from 'enzyme';
+import Enzyme, { shallow, mount } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 import { assert } from 'chai';
 import sinon from 'sinon';
 import React from 'react';
@@ -7,6 +8,8 @@ import  SuggestionListContainer from '../suggestion-list-container';
 import './setup-dom';
 import Spinner from 'ffe-spinner-react';
 
+Enzyme.configure({adapter: new Adapter()});
+
 function suggestions() {
   return [
     {header: '1'},
@@ -88,7 +91,7 @@ describe('<SuggestionList />', () => {
 describe('<SuggestionListContainer />', () => {
 
   it('should set scrollPos to start', () => {
-    const component = mountSuggestionListContainer().component.getInstance();
+    const component = mountSuggestionListContainer().instance();
     const scrollSpy = sinon.spy(component.scrollbars, 'scrollTop');
 
     component.setScrollPosStart();
@@ -97,7 +100,7 @@ describe('<SuggestionListContainer />', () => {
   });
 
   it('should set scrollPos to end', () => {
-    const component = mountSuggestionListContainer().component.getInstance();
+    const component = mountSuggestionListContainer().instance();
     sinon.stub(component.scrollbars, 'getScrollHeight' ).returns(300);
     const scrollSpy = sinon.spy(component.scrollbars, 'scrollTop');
 
@@ -107,7 +110,7 @@ describe('<SuggestionListContainer />', () => {
   });
 
   it('should set scrollPos to next', () => {
-    const component = mountSuggestionListContainer().component.getInstance();
+    const component = mountSuggestionListContainer().instance();
     component.refHighlightedSuggestion({clientHeight : 50});
     const scrollSpy = sinon.spy(component.scrollbars, 'scrollTop');
 
@@ -116,7 +119,7 @@ describe('<SuggestionListContainer />', () => {
   });
 
   it('should set scrollPos to previous', () => {
-    const component = mountSuggestionListContainer().component.getInstance();
+    const component = mountSuggestionListContainer().instance();
     component.refHighlightedSuggestion({clientHeight : 50});
     const scrollSpy = sinon.spy(component.scrollbars, 'scrollTop');