Use shallow-only rendering in all tests (#4087)

* Container/Title with shallow

* IdentityName with shallow

* IdentityIcon with shallow

* TypedInput to shallow

* DetailsStep to shallow

js/src/modals/ExecuteContract/DetailsStep/detailsStep.spec.js

@@ -14,15 +14,13 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import { mount } from 'enzyme';
+import { shallow } from 'enzyme';
 import React from 'react';
 import sinon from 'sinon';
 
-import { ContextProvider, muiTheme } from '~/ui';
-
 import DetailsStep from './';
 
-import { createApi, STORE, CONTRACT } from '../executeContract.test.js';
+import { CONTRACT } from '../executeContract.test.js';
 
 let component;
 let onAmountChange;
@@ -40,8 +38,7 @@ function render (props) {
   onGasEditClick = sinon.stub();
   onValueChange = sinon.stub();
 
-  component = mount(
-    <ContextProvider api={ createApi() } muiTheme={ muiTheme } store={ STORE }>
+  component = shallow(
     <DetailsStep
       { ...props }
       contract={ CONTRACT }
@@ -51,7 +48,6 @@ function render (props) {
       onFuncChange={ onFuncChange }
       onGasEditClick={ onGasEditClick }
       onValueChange={ onValueChange } />
-    </ContextProvider>
   );
 
   return component;
@@ -74,7 +70,7 @@ describe('modals/ExecuteContract/DetailsStep', () => {
 
     describe('bool parameters', () => {
       it('toggles from false to true', () => {
-        component.find('DropDownMenu').last().simulate('change', { target: { value: 'true' } });
+        component.find('TypedInput').last().shallow().simulate('change', { target: { value: 'true' } });
 
         expect(onValueChange).to.have.been.calledWith(null, 0, true);
       });

js/src/ui/Container/Title/title.spec.js

@@ -15,38 +15,32 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from 'react';
-import { mount, shallow } from 'enzyme';
+import { shallow } from 'enzyme';
 
 import Title from './title';
 
-function renderShallow (props) {
+function render (props) {
   return shallow(
     <Title { ...props } />
   );
 }
 
-function renderMount (props) {
-  return mount(
-    <Title { ...props } />
-  );
-}
-
 describe('ui/Container/Title', () => {
   describe('rendering', () => {
     it('renders defaults', () => {
-      expect(renderShallow()).to.be.ok;
+      expect(render()).to.be.ok;
     });
 
     it('renders with the specified className', () => {
-      expect(renderShallow({ className: 'testClass' })).to.have.className('testClass');
+      expect(render({ className: 'testClass' })).to.have.className('testClass');
     });
 
     it('renders the specified title', () => {
-      expect(renderMount({ title: 'titleText' })).to.contain.text('titleText');
+      expect(render({ title: 'titleText' })).to.contain.text('titleText');
     });
 
     it('renders the specified byline', () => {
-      expect(renderMount({ byline: 'bylineText' })).to.contain.text('bylineText');
+      expect(render({ byline: 'bylineText' })).to.contain.text('bylineText');
     });
   });
 });

js/src/ui/Form/TypedInput/typedInput.spec.js

@@ -14,27 +14,26 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import { mount } from 'enzyme';
+import { shallow } from 'enzyme';
 import React from 'react';
 import sinon from 'sinon';
 
-import { ContextProvider, muiTheme } from '~/ui';
 import { ABI_TYPES } from '~/util/abi';
 
 import TypedInput from './';
 
 let component;
+let select;
 let onChange;
 
 function render (props) {
   onChange = sinon.stub();
-  component = mount(
-    <ContextProvider api={ {} } muiTheme={ muiTheme } store={ {} }>
+  component = shallow(
     <TypedInput
       { ...props }
       onChange={ onChange } />
-    </ContextProvider>
   );
+  select = component.find('Select');
 
   return component;
 }
@@ -50,19 +49,19 @@ describe('ui/Form/TypedInput', () => {
     });
 
     it('calls onChange when value changes', () => {
-      component.find('DropDownMenu').simulate('change', { target: { value: 'true' } });
+      select.shallow().simulate('change', { target: { value: 'true' } });
 
       expect(onChange).to.have.been.called;
     });
 
     it("calls onChange(true) when value changes to 'true'", () => {
-      component.find('DropDownMenu').simulate('change', { target: { value: 'true' } });
+      select.shallow().simulate('change', { target: { value: 'true' } });
 
       expect(onChange).to.have.been.calledWith(true);
     });
 
     it("calls onChange(false) when value changes to 'false'", () => {
-      component.find('DropDownMenu').simulate('change', { target: { value: 'false' } });
+      select.shallow().simulate('change', { target: { value: 'false' } });
 
       expect(onChange).to.have.been.calledWith(false);
     });

js/src/ui/IdentityIcon/identityIcon.js

@@ -16,7 +16,6 @@
 
 import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
 
 import { createIdentityImg } from '~/api/util/identity';
 import { isNullAddress } from '~/util/validation';
@@ -145,11 +144,7 @@ function mapStateToProps (state) {
   return { images };
 }
 
-function mapDispatchToProps (dispatch) {
-  return bindActionCreators({}, dispatch);
-}
-
 export default connect(
   mapStateToProps,
-  mapDispatchToProps
+  null
 )(IdentityIcon);

js/src/ui/IdentityIcon/identityIcon.spec.js

@@ -14,12 +14,10 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import { mount } from 'enzyme';
-import React, { PropTypes } from 'react';
+import { shallow } from 'enzyme';
+import React from 'react';
 import sinon from 'sinon';
 
-import muiTheme from '../Theme';
-
 import IdentityIcon from './';
 
 const ADDRESS0 = '0x0000000000000000000000000000000000000000';
@@ -27,6 +25,7 @@ const ADDRESS1 = '0x0123456789012345678901234567890123456789';
 const ADDRESS2 = '0x9876543210987654321098765432109876543210';
 
 let component;
+let instance;
 
 function createApi () {
   return {
@@ -53,20 +52,13 @@ function render (props = {}) {
     props.address = ADDRESS1;
   }
 
-  component = mount(
+  component = shallow(
     <IdentityIcon { ...props } />,
-    {
-      childContextTypes: {
-        api: PropTypes.object,
-        muiTheme: PropTypes.object
-      },
-      context: {
-        api: createApi(),
-        muiTheme,
-        store: createRedux()
-      }
-    }
-  );
+    { context: { store: createRedux() } }
+  ).find('IdentityIcon').shallow({ context: { api: createApi() } });
+
+  instance = component.instance();
+  instance.componentDidMount();
 
   return component;
 }

js/src/ui/IdentityName/identityName.js

@@ -17,7 +17,6 @@
 import React, { Component, PropTypes } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
 
 import { isNullAddress } from '~/util/validation';
 import ShortenedHash from '../ShortenedHash';
@@ -85,11 +84,7 @@ function mapStateToProps (state) {
   };
 }
 
-function mapDispatchToProps (dispatch) {
-  return bindActionCreators({}, dispatch);
-}
-
 export default connect(
   mapStateToProps,
-  mapDispatchToProps
+  null
 )(IdentityName);

js/src/ui/IdentityName/identityName.spec.js

@@ -14,9 +14,8 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import { mount } from 'enzyme';
+import { shallow } from 'enzyme';
 import React from 'react';
-import { IntlProvider } from 'react-intl';
 
 import sinon from 'sinon';
 
@@ -45,13 +44,11 @@ const STORE = {
 };
 
 function render (props) {
-  return mount(
-    <IntlProvider locale='en'>
+  return shallow(
     <IdentityName
       store={ STORE }
       { ...props } />
-    </IntlProvider>
-  );
+  ).find('IdentityName').shallow();
 }
 
 describe('ui/IdentityName', () => {
@@ -62,23 +59,33 @@ describe('ui/IdentityName', () => {
 
     describe('account not found', () => {
       it('renders null with empty', () => {
-        expect(render({ address: ADDR_C, empty: true }).html()).to.be.null;
+        expect(
+          render({ address: ADDR_C, empty: true }).html()
+        ).to.be.null;
       });
 
       it('renders address without empty', () => {
-        expect(render({ address: ADDR_C }).text()).to.equal(ADDR_C);
+        expect(
+          render({ address: ADDR_C }).text()
+        ).to.equal(ADDR_C);
       });
 
       it('renders short address with shorten', () => {
-        expect(render({ address: ADDR_C, shorten: true }).text()).to.equal('123456…56789c');
+        expect(
+          render({ address: ADDR_C, shorten: true }).find('ShortenedHash').props().data
+        ).to.equal(ADDR_C);
       });
 
       it('renders unknown with flag', () => {
-        expect(render({ address: ADDR_C, unknown: true }).text()).to.equal('UNNAMED');
+        expect(
+          render({ address: ADDR_C, unknown: true }
+        ).find('FormattedMessage').props().id).to.equal('ui.identityName.unnamed');
       });
 
       it('renders 0x000...000 as null', () => {
-        expect(render({ address: ADDR_NULL }).text()).to.equal('NULL');
+        expect(
+          render({ address: ADDR_NULL }).find('FormattedMessage').props().id
+        ).to.equal('ui.identityName.null');
       });
     });
   });