loading tests: wait for login component

Rather than a fixed delay, use matrix-react-test-utils to wait for the login
component to appear. Hopefully this will deflakify some tests.

package.json

@@ -121,6 +121,7 @@
     "karma-mocha": "^0.2.2",
     "karma-webpack": "^1.7.0",
     "matrix-mock-request": "^1.0.0",
+    "matrix-react-test-utils": "^0.2.0",
     "minimist": "^1.2.0",
     "mkdirp": "^0.5.1",
     "mocha": "^2.4.5",

test/app-tests/loading.js

@@ -23,6 +23,7 @@ import ReactDOM from 'react-dom';
 import ReactTestUtils from 'react-addons-test-utils';
 import expect from 'expect';
 import q from 'q';
+import MatrixReactTestUtils from 'matrix-react-test-utils';
 
 import jssdk from 'matrix-js-sdk';
 
@@ -183,11 +184,8 @@ describe('loading:', function () {
                 return httpBackend.flush();
             }).then(() => {
                 // Wait for another trip around the event loop for the UI to update
-                return q.delay(10);
+                return awaitLoginComponent(matrixChat);
             }).then(() => {
-                // we expect a single <Login> component following session load
-                ReactTestUtils.findRenderedComponentWithType(
-                    matrixChat, sdk.getComponent('structures.login.Login'));
                 expect(windowLocation.hash).toEqual("#/login");
             }).done(done, done);
         });
@@ -232,7 +230,7 @@ describe('loading:', function () {
                 uriFragment: "#/login",
             });
 
-            return q.delay(100).then(() => {
+            return awaitLoginComponent(matrixChat).then(() => {
                 // we expect a single <Login> component
                 ReactTestUtils.findRenderedComponentWithType(
                     matrixChat, sdk.getComponent('structures.login.Login'));
@@ -366,7 +364,7 @@ describe('loading:', function () {
                 });
 
                 // give the UI a chance to display
-                return q.delay(50);
+                return awaitLoginComponent(matrixChat);
             });
 
             it('shows a login view', function() {
@@ -530,7 +528,7 @@ describe('loading:', function () {
 
                     dis.dispatch({ action: 'start_login' });
 
-                    return q.delay(1);
+                    return awaitLoginComponent(matrixChat);
                 });
             });
 
@@ -607,7 +605,6 @@ describe('loading:', function () {
         });
     });
 
-
     // check that we have a Login component, send a 'user:pass' login,
     // and await the HTTP requests.
     function completeLogin(matrixChat) {
@@ -723,3 +720,9 @@ function awaitRoomView(matrixChat, retryLimit, retryCount) {
         matrixChat, sdk.getComponent('structures.RoomView'));
     return q();
 }
+
+function awaitLoginComponent(matrixChat, attempts) {
+    return MatrixReactTestUtils.waitForRenderedComponentWithType(
+        matrixChat, sdk.getComponent('structures.login.Login'), attempts,
+    );
+}