Account tests

and remove unused import in settings

3 files changed, 35 insertions, 22 deletions

diff --git a/app/components/Account.js b/app/components/Account.js
index abced9b70d..1241d1f724 100644
--- a/app/components/Account.js
+++ b/app/components/Account.js
@@ -7,7 +7,6 @@ import { Layout, Container } from './Layout';
 import styles from './AccountStyles';
 import Img from './Img';
 import { formatAccount } from '../lib/formatters';
-import ExternalLinkSVG from '../assets/images/icon-extLink.svg';
 
 import type { AccountReduxState } from '../redux/account/reducers';
 
@@ -31,7 +30,9 @@ export default class Account extends Component {
       <Layout>
         <Container>
           <View style={styles.account}>
-            <Button style={styles.account__close} onPress={ this.props.onClose }>
+            <Button style={styles.account__close}
+              onPress={ this.props.onClose }
+              testName='account__close'>
               <Img style={styles.account__close_icon} source="icon-back" />
               <Text style={styles.account__close_title}>Settings</Text>
             </Button>
@@ -52,7 +53,7 @@ export default class Account extends Component {
                   <View style={styles.account__row}>
                     <Text style={styles.account__row_label}>Paid until</Text>
                     { isOutOfTime ?
-                      <Text style={styles.account__out_of_time}>OUT OF TIME</Text>
+                      <Text style={styles.account__out_of_time} testName='account__out_of_time'>OUT OF TIME</Text>
                       :
                       <Text style={styles.account__row_value}>{ formattedExpiry }</Text>
                     }
@@ -65,11 +66,13 @@ export default class Account extends Component {
                       text='Buy more credit'
                       icon='icon-extLink'
                       iconStyle={styles.account__buymore_icon}
-                      tintColor='currentColor'/>
+                      tintColor='currentColor'
+                      testName='account__buymore'/>
                     <AppButton style={styles.account__logout}
                       hoverStyle={styles.account__logout_hover}
                       onPress={ this.props.onLogout }
-                      text='Log out'/>
+                      text='Log out'
+                      testName='account__logout'/>
                   </View>
 
                 </View>
diff --git a/app/components/Settings.js b/app/components/Settings.js
index d854b51d7d..f992429811 100644
--- a/app/components/Settings.js
+++ b/app/components/Settings.js
@@ -3,7 +3,7 @@ import moment from 'moment';
 import React from 'react';
 import { Component, Text, View } from 'reactxp';
 import { Button, CellButton, AppButton } from './styled';
-import { Layout, Container, Header } from './Layout';
+import { Layout, Container } from './Layout';
 import CustomScrollbars from './CustomScrollbars';
 import styles from './SettingsStyles';
 import Img from './Img';
diff --git a/test/components/Account.spec.js b/test/components/Account.spec.js
index a8b8e3d501..ccdb1d2117 100644
--- a/test/components/Account.spec.js
+++ b/test/components/Account.spec.js
@@ -2,7 +2,8 @@
 
 import { expect } from 'chai';
 import React from 'react';
-import ReactTestUtils, { Simulate } from 'react-dom/test-utils';
+import { shallow } from 'enzyme';
+require('../setup/enzyme');
 import Account from '../../app/components/Account';
 
 import type { AccountReduxState } from '../../app/redux/account/reducers';
@@ -27,34 +28,28 @@ describe('components/Account', () => {
     return Object.assign({}, defaultProps, mergeProps);
   };
 
-  const render = (props: AccountProps): Account => {
-    return ReactTestUtils.renderIntoDocument(
-      <Account { ...props } />
-    );
-  };
-
   it('should call close callback', (done) => {
     const props = makeProps(state, {
       onClose: () => done()
     });
-    const domNode = ReactTestUtils.findRenderedDOMComponentWithClass(render(props), 'account__close');
-    Simulate.click(domNode);
+    const component = getComponent(render(props), 'account__close');
+    click(component);
   });
 
   it('should call logout callback', (done) => {
     const props = makeProps(state, {
       onLogout: () => done()
     });
-    const domNode = ReactTestUtils.findRenderedDOMComponentWithClass(render(props), 'account__logout');
-    Simulate.click(domNode);
+    const component = getComponent(render(props), 'account__logout');
+    click(component);
   });
 
   it('should call "buy more" callback', (done) => {
     const props = makeProps(state, {
       onBuyMore: () => done()
     });
-    const domNode = ReactTestUtils.findRenderedDOMComponentWithClass(render(props), 'account__buymore');
-    Simulate.click(domNode);
+    const component = getComponent(render(props), 'account__buymore');
+    click(component);
   });
 
   it('should display "out of time" message when account expired', () => {
@@ -66,13 +61,28 @@ describe('components/Account', () => {
       error: null
     };
     const props = makeProps(expiredState, {});
-    ReactTestUtils.findRenderedDOMComponentWithClass(render(props), 'account__out-of-time');
+    const component = getComponent(render(props), 'account__out_of_time');
+    expect(component).to.have.length(1);
   });
 
   it('should not display "out of time" message when account is active', () => {
     const props = makeProps(state, {});
-    const domNodes = ReactTestUtils.scryRenderedDOMComponentsWithClass(render(props), 'account__out-of-time');
-    expect(domNodes.length).to.be.equal(0);
+    const component = getComponent(render(props), 'account__out_of_time');
+    expect(component).to.have.length(0);
   });
 
 });
+
+function render(props) {
+  return shallow(
+    <Account {...props} />
+  );
+}
+
+function getComponent(container, testName) {
+  return container.findWhere( n => n.prop('testName') === testName);
+}
+
+function click(component) {
+  component.prop('onPress')();
+}