[#923] Create integration test for the validation of backup account

with @FrailWords

2 files changed, 36 insertions, 1 deletions

diff --git a/web-ui/src/backup_account/page.js b/web-ui/src/backup_account/page.js
index e8c353e1..07a36283 100644
--- a/web-ui/src/backup_account/page.js
+++ b/web-ui/src/backup_account/page.js
@@ -40,7 +40,7 @@ export class Page extends React.Component {
     const validEmail = validator.isEmail(event.target.value);
     const emptyEmail = validator.isEmpty(event.target.value);
     this.setState({
-      error: !emptyEmail && !validEmail  ? 'Your email is invalid' : '',
+      error: !emptyEmail && !validEmail ? 'Your email is invalid' : '',
       submitButtonDisabled: !validEmail || emptyEmail
     });
   }
diff --git a/web-ui/test/integration/backup_account.spec.js b/web-ui/test/integration/backup_account.spec.js
new file mode 100644
index 00000000..2a37442e
--- /dev/null
+++ b/web-ui/test/integration/backup_account.spec.js
@@ -0,0 +1,35 @@
+import { mount } from 'enzyme';
+import expect from 'expect';
+import React from 'react';
+import App from 'src/common/app';
+import BackupAccountPage from 'src/backup_account/page';
+import testI18n from './i18n';
+
+describe('Backup account email validation', () => {
+  context('Backup Account Page', () => {
+    let app, backupAccountPage;
+
+    beforeEach(() => {
+      app = mount(<App i18n={testI18n} child={<BackupAccountPage />} />);
+      backupAccountPage = app.find('Page');
+    });
+
+    it('shows no error and enables submit button when a valid email is entered', () => {
+      backupAccountPage.find('input').simulate('change', {target: {value: 'test@test.com'}});
+      expect(backupAccountPage.find('InputField').props().errorText).toEqual('');
+      expect(backupAccountPage.find('SubmitButton').props().disabled).toEqual(false);
+    });
+
+    it('shows error and disables submit button on invalid email', () => {
+      backupAccountPage.find('input').simulate('change', {target: {value: 'test'}});
+      expect(backupAccountPage.find('InputField').props().errorText).toEqual('Your email is invalid');
+      expect(backupAccountPage.find('SubmitButton').props().disabled).toEqual(true);
+    });
+
+    it('shows no error and disables submit button when email is empty', () => {
+      backupAccountPage.find('input').simulate('change', {target: {value: ''}});
+      expect(backupAccountPage.find('InputField').props().errorText).toEqual('');
+      expect(backupAccountPage.find('SubmitButton').props().disabled).toEqual(true);
+    });
+  });
+});