remove setTimeout hack for testing api.login Login.jsx handlers

__tests__/tests/LoginPage.test.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { mount, shallow } from 'enzyme';
+import { asyncFlush } from '../../jest.setup';
 import LoginPage from '../../src/pages/Login';
 import api from '../../src/api';
 
@@ -75,88 +76,58 @@ describe('<LoginPage />', () => {
     expect(loginPage.state().error).toBe('');
   });
 
-  test('submit calls api.login successfully', (done) => {
+  test('api.login not called when loading', () => {
-    api.login = jest.fn().mockImplementation(() => {
+    api.login = jest.fn().mockImplementation(() => Promise.resolve({}));
-      const loginPromise = Promise.resolve({});
-
-      setTimeout(() => {
-        loginPromise.finally(() => {
-          expect(loginPage.state().loading).toBe(false);
-          done();
-        });
-      }, 1);
-
-      return loginPromise;
-    });
     expect(loginPage.state().loading).toBe(false);
-    loginPage.setState({ username: 'unamee', password: 'pwordd', loading: true });
+    loginPage.setState({ loading: true });
     submitButton.simulate('submit');
     expect(api.login).toHaveBeenCalledTimes(0);
-    loginPage.setState({ loading: false });
-    submitButton.simulate('submit');
-    expect(api.login).toHaveBeenCalledTimes(1);
-    expect(api.login).toHaveBeenCalledWith('unamee', 'pwordd');
-    expect(loginPage.state().loading).toBe(true);
   });
 
-  test('submit calls api.login handles 401 error', (done) => {
+  test('submit calls api.login successfully', async () => {
-    api.login = jest.fn().mockImplementation(() => {
+    api.login = jest.fn().mockImplementation(() => Promise.resolve({}));
-      const err = {
-        response: { status: 401, message: 'problem' },
-      };
-      const loginPromise = Promise.reject(err);
-
-      setTimeout(() => {
-        loginPromise.catch(() => {
-          expect(loginPage.state().error).toBe(LOGIN_ERROR_MESSAGE);
-        }).finally(() => {
-          expect(loginPage.state().loading).toBe(false);
-          done();
-        });
-      }, 1);
-
-      return loginPromise;
-    });
     expect(loginPage.state().loading).toBe(false);
-    loginPage.setState({ username: 'unamee', password: 'pwordd', loading: true });
+    loginPage.setState({ username: 'unamee', password: 'pwordd' });
-    submitButton.simulate('submit');
-    expect(api.login).toHaveBeenCalledTimes(0);
-    loginPage.setState({ loading: false });
-    expect(loginPage.state().error).toBe('');
     submitButton.simulate('submit');
     expect(api.login).toHaveBeenCalledTimes(1);
     expect(api.login).toHaveBeenCalledWith('unamee', 'pwordd');
     expect(loginPage.state().loading).toBe(true);
+    await asyncFlush();
+    expect(loginPage.state().loading).toBe(false);
   });
 
-  test('submit calls api.login handles non-401 error', (done) => {
+  test('submit calls api.login handles 401 error', async () => {
     api.login = jest.fn().mockImplementation(() => {
-      const err = {
+      const err = new Error('401 error');
-        response: { status: 500, message: 'problem' },
+      err.response = { status: 401, message: 'problem' };
-      };
+      return Promise.reject(err);
-      const loginPromise = Promise.reject(err);
-
-      setTimeout(() => {
-        loginPromise.catch(() => {
-          expect(loginPage.state().error).toBe('');
-        }).finally(() => {
-          expect(loginPage.state().loading).toBe(false);
-          done();
-        });
-      }, 1);
-
-      return loginPromise;
     });
     expect(loginPage.state().loading).toBe(false);
-    loginPage.setState({ username: 'unamee', password: 'pwordd', loading: true });
+    loginPage.setState({ username: 'unamee', password: 'pwordd' });
-    submitButton.simulate('submit');
-    expect(api.login).toHaveBeenCalledTimes(0);
-    loginPage.setState({ loading: false });
-    expect(loginPage.state().error).toBe('');
     submitButton.simulate('submit');
     expect(api.login).toHaveBeenCalledTimes(1);
     expect(api.login).toHaveBeenCalledWith('unamee', 'pwordd');
     expect(loginPage.state().loading).toBe(true);
+    await asyncFlush();
+    expect(loginPage.state().error).toBe(LOGIN_ERROR_MESSAGE);
+    expect(loginPage.state().loading).toBe(false);
+  });
+
+  test('submit calls api.login handles non-401 error', async () => {
+    api.login = jest.fn().mockImplementation(() => {
+      const err = new Error('500 error');
+      err.response = { status: 500, message: 'problem' };
+      return Promise.reject(err);
+    });
+    expect(loginPage.state().loading).toBe(false);
+    loginPage.setState({ username: 'unamee', password: 'pwordd' });
+    submitButton.simulate('submit');
+    expect(api.login).toHaveBeenCalledTimes(1);
+    expect(api.login).toHaveBeenCalledWith('unamee', 'pwordd');
+    expect(loginPage.state().loading).toBe(true);
+    await asyncFlush();
+    expect(loginPage.state().error).toBe('');
+    expect(loginPage.state().loading).toBe(false);
   });
 
   test('render Redirect to / when already authenticated', () => {

jest.setup.js

@@ -1,5 +1,8 @@
 require('@babel/polyfill');
 
+// eslint-disable-next-line import/prefer-default-export
+export const asyncFlush = () => new Promise((resolve) => setImmediate(resolve));
+
 const enzyme = require('enzyme');
 const Adapter = require('enzyme-adapter-react-16');