Mock out modals

Author: Half-Shot

test/unit-tests/components/views/settings/encryption/ChangeRecoveryKey-test.tsx

@@ -14,6 +14,8 @@ import { mocked } from "jest-mock";
 import { ChangeRecoveryKey } from "../../../../../../src/components/views/settings/encryption/ChangeRecoveryKey";
 import { createTestClient, withClientContextRenderOptions } from "../../../../../test-utils";
 import { copyPlaintext } from "../../../../../../src/utils/strings";
+import Modal from "../../../../../../src/Modal";
+import ErrorDialog from "../../../../../../src/components/views/dialogs/ErrorDialog";
 
 jest.mock("../../../../../../src/utils/strings", () => ({
     copyPlaintext: jest.fn(),
@@ -120,22 +122,33 @@ describe("<ChangeRecoveryKey />", () => {
             mocked(matrixClient.getCrypto()!).bootstrapSecretStorage.mockRejectedValue(new Error("can't bootstrap"));
 
             const user = userEvent.setup();
-            renderComponent(false);
+            const { getByRole, getByText, getByTitle } = renderComponent(false);
 
             // Display the recovery key to save
-            await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
+            await waitFor(() => user.click(getByRole("button", { name: "Continue" })));
             // Display the form to confirm the recovery key
-            await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
+            await waitFor(() => user.click(getByRole("button", { name: "Continue" })));
 
-            await waitFor(() => expect(screen.getByText("Enter your recovery key to confirm")).toBeInTheDocument());
+            await waitFor(() => expect(getByText("Enter your recovery key to confirm")).toBeInTheDocument());
 
-            const finishButton = screen.getByRole("button", { name: "Finish set up" });
-            const input = screen.getByTitle("Enter recovery key");
+            const finishButton = getByRole("button", { name: "Finish set up" });
+            const input = getByTitle("Enter recovery key");
             await userEvent.type(input, "encoded private key");
+
+            await waitFor(() => {
+               expect(finishButton).not.toBeDisabled();
+            });
+
+            jest.spyOn(Modal, "createDialog");
+
             await user.click(finishButton);
 
-            await screen.findByText("Failed to set up secret storage");
-            await screen.findByText("Error: can't bootstrap");
+            expect(Modal.createDialog).toHaveBeenCalledWith(ErrorDialog, {
+                title: "Failed to set up secret storage",
+                description: "Error: can't bootstrap",
+            });
+            await waitFor(() => user.click(getByRole("button", { name: "OK" })));
+
             expect(consoleErrorSpy).toHaveBeenCalledWith(
                 "Failed to set up secret storage:",
                 new Error("can't bootstrap"),
@@ -149,22 +162,25 @@ describe("<ChangeRecoveryKey />", () => {
             });
 
             const user = userEvent.setup();
-            renderComponent(false);
+            const { getByRole, getByText, getByTitle } = renderComponent(false);
 
             // Display the recovery key to save
-            await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
+            await waitFor(() => user.click(getByRole("button", { name: "Continue" })));
             // Display the form to confirm the recovery key
-            await waitFor(() => user.click(screen.getByRole("button", { name: "Continue" })));
+            await waitFor(() => user.click(getByRole("button", { name: "Continue" })));
 
-            await waitFor(() => expect(screen.getByText("Enter your recovery key to confirm")).toBeInTheDocument());
+            await waitFor(() => expect(getByText("Enter your recovery key to confirm")).toBeInTheDocument());
 
-            const finishButton = screen.getByRole("button", { name: "Finish set up" });
-            const input = screen.getByTitle("Enter recovery key");
+            const finishButton = getByRole("button", { name: "Finish set up" });
+            const input = getByTitle("Enter recovery key");
             await userEvent.type(input, "encoded private key");
+
+            await waitFor(() => {
+                expect(finishButton.getAttribute("aria-disabled")).not.toEqual("true");
+            });
+
             await user.click(finishButton);
-            await user.click(finishButton);
-            await user.click(finishButton);
-            expect(mockFn).toHaveBeenCalledTimes(1);
+            await waitFor(() =>  expect(mockFn).toHaveBeenCalledTimes(1));
         });
     });