Add typescript support and fix tests after threads work (#19247)

* Typescriptify tests
* Fix tests after threads work
* Add proper types for jest

test/app-tests/joining-test.tsx

@@ -31,12 +31,12 @@ import {sleep} from "../test-utils";
 import * as test_utils from "../test-utils";
 import MockHttpBackend from "matrix-mock-request";
 import "fake-indexeddb/auto";
+import { RoomView as RoomViewClass } from 'matrix-react-sdk/src/components/structures/RoomView';
 
 
 const MatrixChat = sdk.getComponent('structures.MatrixChat');
 const RoomDirectory = sdk.getComponent('structures.RoomDirectory');
 const RoomPreviewBar = sdk.getComponent('rooms.RoomPreviewBar');
-const RoomView = sdk.getComponent('structures.RoomView');
 
 const HS_URL='http://localhost';
 const IS_URL='http://localhost';
@@ -50,7 +50,6 @@ describe('joining a room', function() {
         let matrixChat;
 
         beforeEach(function() {
-            test_utils.beforeEach(this);
             httpBackend = new MockHttpBackend();
             jssdk.request(httpBackend.requestFn);
             parentDiv = document.createElement('div');
@@ -148,7 +147,7 @@ describe('joining a room', function() {
 
                 // enter an alias in the input, and simulate enter
                 const input = ReactTestUtils.findRenderedDOMComponentWithTag(
-                    roomDir, 'input');
+                    roomDir, 'input') as HTMLInputElement;
                 input.value = ROOM_ALIAS;
                 ReactTestUtils.Simulate.change(input);
                 ReactTestUtils.Simulate.keyUp(input, {key: 'Enter'});
@@ -165,7 +164,7 @@ describe('joining a room', function() {
 
                 // we should now have a roomview
                 roomView = ReactTestUtils.findRenderedComponentWithType(
-                    matrixChat, RoomView);
+                    matrixChat, RoomViewClass);
 
                 // the preview bar may take a tick to be displayed
                 return sleep(1);
@@ -228,7 +227,7 @@ describe('joining a room', function() {
                 return httpBackend.flush();
             }).then(() => {
                 // now the room should have loaded
-                expect(roomView.state.room).toExist();
+                expect(roomView.state.room).toBeTruthy();
             });
         });
     });

test/app-tests/loading-test.tsx

@@ -39,6 +39,8 @@ import {sleep} from "../test-utils";
 import "fake-indexeddb/auto";
 import {cleanLocalstorage} from "../test-utils";
 import {IndexedDBCryptoStore} from "matrix-js-sdk/src/crypto/store/indexeddb-crypto-store";
+import { RoomView as RoomViewClass } from 'matrix-react-sdk/src/components/structures/RoomView';
+import LoginComponent from 'matrix-react-sdk/src/components/structures/auth/Login';
 
 const DEFAULT_HS_URL='http://my_server';
 const DEFAULT_IS_URL='http://my_is';
@@ -94,7 +96,7 @@ describe('loading:', function() {
      * TODO: it would be nice to factor some of this stuff out of index.js so
      * that we can test it rather than our own implementation of it.
      */
-    function loadApp(opts) {
+    function loadApp(opts?) {
         opts = opts || {};
         const queryString = opts.queryString || "";
         const uriFragment = opts.uriFragment || "";
@@ -164,7 +166,7 @@ describe('loading:', function() {
     // http requests until we do.
     //
     // returns a promise resolving to the received request
-    async function expectAndAwaitSync(opts) {
+    async function expectAndAwaitSync(opts?) {
         let syncRequest = null;
         const isGuest = opts && opts.isGuest;
         if (!isGuest) {
@@ -633,7 +635,7 @@ describe('loading:', function() {
     async function completeLogin(matrixChat) {
         // we expect a single <Login> component
         const login = ReactTestUtils.findRenderedComponentWithType(
-            matrixChat, sdk.getComponent('structures.auth.Login'));
+            matrixChat, LoginComponent);
 
         // When we switch to the login component, it'll hit the login endpoint
         // for proof of life and to get flows. We'll only give it one option.
@@ -673,7 +675,7 @@ describe('loading:', function() {
 
 // assert that we are on the loading page
 function assertAtLoadingSpinner(matrixChat) {
-    const domComponent = ReactDOM.findDOMNode(matrixChat);
+    const domComponent = ReactDOM.findDOMNode(matrixChat) as Element;
     expect(domComponent.className).toEqual("mx_MatrixChat_splash");
 
     // just the spinner
@@ -691,14 +693,14 @@ function awaitLoggedIn(matrixChat) {
             }
             console.log(Date.now() + ": Received on_logged_in action");
             dis.unregister(dispatcherRef);
-            resolve();
+            resolve(undefined);
         };
         const dispatcherRef = dis.register(onAction);
         console.log(Date.now() + ": Waiting for on_logged_in action");
     });
 }
 
-function awaitRoomView(matrixChat, retryLimit, retryCount) {
+function awaitRoomView(matrixChat, retryLimit?, retryCount?) {
     if (retryLimit === undefined) {
         retryLimit = 5;
     }
@@ -721,17 +723,17 @@ function awaitRoomView(matrixChat, retryLimit, retryCount) {
 
     // state looks good, check the rendered output
     ReactTestUtils.findRenderedComponentWithType(
-        matrixChat, sdk.getComponent('structures.RoomView'));
+        matrixChat, RoomViewClass);
     return Promise.resolve();
 }
 
-function awaitLoginComponent(matrixChat, attempts) {
+function awaitLoginComponent(matrixChat, attempts?) {
     return MatrixReactTestUtils.waitForRenderedComponentWithType(
         matrixChat, sdk.getComponent('structures.auth.Login'), attempts,
     );
 }
 
-function awaitWelcomeComponent(matrixChat, attempts) {
+function awaitWelcomeComponent(matrixChat, attempts?) {
     return MatrixReactTestUtils.waitForRenderedComponentWithType(
         matrixChat, sdk.getComponent('auth.Welcome'), attempts,
     );