Use new CrytoApi.restoreKeyBackup & CrytoApi.restoreKeyBackupFromPassphrase api (#28385)

* Use new `CrytoApi.restoreKeyBackup` & `CrytoApi.restoreKeyBackupFromPassprhase` api * Use new `CrytoApi.restoreKeyBackup` api in `SetupEncryptionStore` * Add tests to `RestoreKeyBackupDialog`
2024-11-13 11:32:06 +01:00 · 2024-11-13 11:32:06 +01:00 · c67e67af4e
commit c67e67af4e
parent 7b1e303328
5 changed files with 383 additions and 44 deletions
--- a/src/components/views/dialogs/security/RestoreKeyBackupDialog.tsx
+++ b/src/components/views/dialogs/security/RestoreKeyBackupDialog.tsx
@ -8,9 +8,8 @@ Please see LICENSE files in the repository root for full details.
 */

 import React, { ChangeEvent } from "react";
-import { MatrixClient, MatrixError, SecretStorage } from "matrix-js-sdk/src/matrix";
-import { decodeRecoveryKey, KeyBackupInfo } from "matrix-js-sdk/src/crypto-api";
-import { IKeyBackupRestoreResult } from "matrix-js-sdk/src/crypto/keybackup";
+import { MatrixClient, MatrixError } from "matrix-js-sdk/src/matrix";
+import { decodeRecoveryKey, KeyBackupInfo, KeyBackupRestoreResult } from "matrix-js-sdk/src/crypto-api";
 import { logger } from "matrix-js-sdk/src/logger";

 import { MatrixClientPeg } from "../../../../MatrixClientPeg";
@ -42,12 +41,11 @@ interface IProps {

 interface IState {
    backupInfo: KeyBackupInfo | null;
-    backupKeyStored: Record<string, SecretStorage.SecretStorageKeyDescription> | null;
    loading: boolean;
    loadError: boolean | null;
    restoreError: unknown | null;
    recoveryKey: string;
-    recoverInfo: IKeyBackupRestoreResult | null;
+    recoverInfo: KeyBackupRestoreResult | null;
    recoveryKeyValid: boolean;
    forceRecoveryKey: boolean;
    passPhrase: string;
@ -72,7 +70,6 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
        super(props);
        this.state = {
            backupInfo: null,
-            backupKeyStored: null,
            loading: false,
            loadError: null,
            restoreError: null,
@ -137,7 +134,8 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
    };

    private onPassPhraseNext = async (): Promise<void> => {
-        if (!this.state.backupInfo) return;
+        const crypto = MatrixClientPeg.safeGet().getCrypto();
+        if (!crypto) return;
        this.setState({
            loading: true,
            restoreError: null,
@ -146,13 +144,9 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
        try {
            // We do still restore the key backup: we must ensure that the key backup key
            // is the right one and restoring it is currently the only way we can do this.
-            const recoverInfo = await MatrixClientPeg.safeGet().restoreKeyBackupWithPassword(
-                this.state.passPhrase,
-                undefined,
-                undefined,
-                this.state.backupInfo,
-                { progressCallback: this.progressCallback },
-            );
+            const recoverInfo = await crypto.restoreKeyBackupWithPassphrase(this.state.passPhrase, {
+                progressCallback: this.progressCallback,
+            });

            if (!this.props.showSummary) {
                this.props.onFinished(true);
@ -172,7 +166,8 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
    };

    private onRecoveryKeyNext = async (): Promise<void> => {
-        if (!this.state.recoveryKeyValid || !this.state.backupInfo) return;
+        const crypto = MatrixClientPeg.safeGet().getCrypto();
+        if (!this.state.recoveryKeyValid || !this.state.backupInfo?.version || !crypto) return;

        this.setState({
            loading: true,
@ -180,13 +175,14 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
            restoreType: RestoreType.RecoveryKey,
        });
        try {
-            const recoverInfo = await MatrixClientPeg.safeGet().restoreKeyBackupWithRecoveryKey(
-                this.state.recoveryKey,
-                undefined,
-                undefined,
-                this.state.backupInfo,
-                { progressCallback: this.progressCallback },
+            await crypto.storeSessionBackupPrivateKey(
+                decodeRecoveryKey(this.state.recoveryKey),
+                this.state.backupInfo.version,
            );
+            const recoverInfo = await crypto.restoreKeyBackup({
+                progressCallback: this.progressCallback,
+            });
+
            if (!this.props.showSummary) {
                this.props.onFinished(true);
                return;
@ -210,44 +206,41 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
        });
    };

-    private async restoreWithSecretStorage(): Promise<void> {
+    private async restoreWithSecretStorage(): Promise<boolean> {
+        const crypto = MatrixClientPeg.safeGet().getCrypto();
+        if (!crypto) return false;
+
        this.setState({
-            loading: true,
            restoreError: null,
            restoreType: RestoreType.SecretStorage,
        });
        try {
+            let recoverInfo: KeyBackupRestoreResult | null = null;
            // `accessSecretStorage` may prompt for storage access as needed.
            await accessSecretStorage(async (): Promise<void> => {
-                if (!this.state.backupInfo) return;
-                await MatrixClientPeg.safeGet().restoreKeyBackupWithSecretStorage(
-                    this.state.backupInfo,
-                    undefined,
-                    undefined,
-                    { progressCallback: this.progressCallback },
-                );
+                await crypto.loadSessionBackupPrivateKeyFromSecretStorage();
+                recoverInfo = await crypto.restoreKeyBackup({ progressCallback: this.progressCallback });
            });
            this.setState({
                loading: false,
+                recoverInfo,
            });
+            return true;
        } catch (e) {
-            logger.log("Error restoring backup", e);
+            logger.log("restoreWithSecretStorage failed:", e);
            this.setState({
                restoreError: e,
                loading: false,
            });
+            return false;
        }
    }

    private async restoreWithCachedKey(backupInfo: KeyBackupInfo | null): Promise<boolean> {
-        if (!backupInfo) return false;
+        const crypto = MatrixClientPeg.safeGet().getCrypto();
+        if (!crypto) return false;
        try {
-            const recoverInfo = await MatrixClientPeg.safeGet().restoreKeyBackupWithCache(
-                undefined /* targetRoomId */,
-                undefined /* targetSessionId */,
-                backupInfo,
-                { progressCallback: this.progressCallback },
-            );
+            const recoverInfo = await crypto.restoreKeyBackup({ progressCallback: this.progressCallback });
            this.setState({
                recoverInfo,
            });
@ -270,7 +263,6 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
            const backupKeyStored = has4S ? await cli.isKeyBackupKeyStored() : null;
            this.setState({
                backupInfo,
-                backupKeyStored,
            });

            const gotCache = await this.restoreWithCachedKey(backupInfo);
@ -282,9 +274,13 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
                return;
            }

-            // If the backup key is stored, we can proceed directly to restore.
-            if (backupKeyStored) {
-                return this.restoreWithSecretStorage();
+            const hasBackupFromSS = backupKeyStored && (await this.restoreWithSecretStorage());
+            if (hasBackupFromSS) {
+                logger.log("RestoreKeyBackupDialog: found backup key in secret storage");
+                this.setState({
+                    loading: false,
+                });
+                return;
            }

            this.setState({
@ -398,6 +394,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,

                    <form className="mx_RestoreKeyBackupDialog_primaryContainer">
                        <input
+                            data-testid="passphraseInput"
                            type="password"
                            className="mx_RestoreKeyBackupDialog_passPhraseInput"
                            onChange={this.onPassPhraseChange}
--- a/src/stores/SetupEncryptionStore.ts
+++ b/src/stores/SetupEncryptionStore.ts
@ -151,7 +151,8 @@ export class SetupEncryptionStore extends EventEmitter {
                    await initialiseDehydration();

                    if (backupInfo) {
-                        await cli.restoreKeyBackupWithSecretStorage(backupInfo);
+                        await cli.getCrypto()?.loadSessionBackupPrivateKeyFromSecretStorage();
+                        await cli.getCrypto()?.restoreKeyBackup();
                    }
                }).catch(reject);
            });
--- a/test/test-utils/test-utils.ts
+++ b/test/test-utils/test-utils.ts
@ -131,6 +131,10 @@ export function createTestClient(): MatrixClient {
            createRecoveryKeyFromPassphrase: jest.fn().mockResolvedValue({}),
            bootstrapSecretStorage: jest.fn(),
            isDehydrationSupported: jest.fn().mockResolvedValue(false),
+            restoreKeyBackup: jest.fn(),
+            restoreKeyBackupWithPassphrase: jest.fn(),
+            loadSessionBackupPrivateKeyFromSecretStorage: jest.fn(),
+            storeSessionBackupPrivateKey: jest.fn(),
        }),

        getPushActionsForEvent: jest.fn(),
@ -275,6 +279,7 @@ export function createTestClient(): MatrixClient {
        sendStickerMessage: jest.fn(),
        getLocalAliases: jest.fn().mockReturnValue([]),
        uploadDeviceSigningKeys: jest.fn(),
+        isKeyBackupKeyStored: jest.fn().mockResolvedValue(null),
    } as unknown as MatrixClient;

    client.reEmitter = new ReEmitter(client);
--- a/test/unit-tests/components/views/dialogs/security/RestoreKeyBackupDialog-test.tsx
+++ b/test/unit-tests/components/views/dialogs/security/RestoreKeyBackupDialog-test.tsx
@ -9,6 +9,8 @@
 import React from "react";
 import { screen, render, waitFor } from "jest-matrix-react";
 import userEvent from "@testing-library/user-event";
+import { MatrixClient } from "matrix-js-sdk/src/matrix";
+import { KeyBackupInfo } from "matrix-js-sdk/src/crypto-api";
 // Needed to be able to mock decodeRecoveryKey
 // eslint-disable-next-line no-restricted-imports
 import * as recoveryKeyModule from "matrix-js-sdk/src/crypto-api/recovery-key";
@ -17,9 +19,16 @@ import RestoreKeyBackupDialog from "../../../../../../src/components/views/dialo
 import { stubClient } from "../../../../../test-utils";

 describe("<RestoreKeyBackupDialog />", () => {
+    const keyBackupRestoreResult = {
+        total: 2,
+        imported: 1,
+    };
+
+    let matrixClient: MatrixClient;
    beforeEach(() => {
-        stubClient();
+        matrixClient = stubClient();
        jest.spyOn(recoveryKeyModule, "decodeRecoveryKey").mockReturnValue(new Uint8Array(32));
+        jest.spyOn(matrixClient, "getKeyBackupVersion").mockResolvedValue({ version: "1" } as KeyBackupInfo);
    });

    it("should render", async () => {
@ -48,4 +57,71 @@ describe("<RestoreKeyBackupDialog />", () => {
        await waitFor(() => expect(screen.getByText("👍 This looks like a valid Security Key!")).toBeInTheDocument());
        expect(asFragment()).toMatchSnapshot();
    });
+
+    it("should restore key backup when the key is cached", async () => {
+        jest.spyOn(matrixClient.getCrypto()!, "restoreKeyBackup").mockResolvedValue(keyBackupRestoreResult);
+
+        const { asFragment } = render(<RestoreKeyBackupDialog onFinished={jest.fn()} />);
+        await waitFor(() => expect(screen.getByText("Successfully restored 1 keys")).toBeInTheDocument());
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    it("should restore key backup when the key is in secret storage", async () => {
+        jest.spyOn(matrixClient.getCrypto()!, "restoreKeyBackup")
+            // Reject when trying to restore from cache
+            .mockRejectedValueOnce(new Error("key backup not found"))
+            // Resolve when trying to restore from secret storage
+            .mockResolvedValue(keyBackupRestoreResult);
+        jest.spyOn(matrixClient.secretStorage, "hasKey").mockResolvedValue(true);
+        jest.spyOn(matrixClient, "isKeyBackupKeyStored").mockResolvedValue({});
+
+        const { asFragment } = render(<RestoreKeyBackupDialog onFinished={jest.fn()} />);
+        await waitFor(() => expect(screen.getByText("Successfully restored 1 keys")).toBeInTheDocument());
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    it("should restore key backup when security key is filled by user", async () => {
+        jest.spyOn(matrixClient.getCrypto()!, "restoreKeyBackup")
+            // Reject when trying to restore from cache
+            .mockRejectedValueOnce(new Error("key backup not found"))
+            // Resolve when trying to restore from recovery key
+            .mockResolvedValue(keyBackupRestoreResult);
+
+        const { asFragment } = render(<RestoreKeyBackupDialog onFinished={jest.fn()} />);
+        await waitFor(() => expect(screen.getByText("Enter Security Key")).toBeInTheDocument());
+
+        await userEvent.type(screen.getByRole("textbox"), "my security key");
+        await userEvent.click(screen.getByRole("button", { name: "Next" }));
+
+        await waitFor(() => expect(screen.getByText("Successfully restored 1 keys")).toBeInTheDocument());
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    test("should restore key backup when passphrase is filled", async () => {
+        // Determine that the passphrase is required
+        jest.spyOn(matrixClient, "getKeyBackupVersion").mockResolvedValue({
+            version: "1",
+            auth_data: {
+                private_key_salt: "salt",
+                private_key_iterations: 1,
+            },
+        } as KeyBackupInfo);
+
+        jest.spyOn(matrixClient.getCrypto()!, "restoreKeyBackup")
+            // Reject when trying to restore from cache
+            .mockRejectedValue(new Error("key backup not found"));
+
+        jest.spyOn(matrixClient.getCrypto()!, "restoreKeyBackupWithPassphrase").mockResolvedValue(
+            keyBackupRestoreResult,
+        );
+
+        const { asFragment } = render(<RestoreKeyBackupDialog onFinished={jest.fn()} />);
+        await waitFor(() => expect(screen.getByText("Enter Security Phrase")).toBeInTheDocument());
+        // Not role for password https://github.com/w3c/aria/issues/935
+        await userEvent.type(screen.getByTestId("passphraseInput"), "my passphrase");
+        await userEvent.click(screen.getByRole("button", { name: "Next" }));
+
+        await waitFor(() => expect(screen.getByText("Successfully restored 1 keys")).toBeInTheDocument());
+        expect(asFragment()).toMatchSnapshot();
+    });
 });
--- a/test/unit-tests/components/views/dialogs/security/snapshots/RestoreKeyBackupDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/security/snapshots/RestoreKeyBackupDialog-test.tsx.snap
@ -296,3 +296,263 @@ exports[`<RestoreKeyBackupDialog /> should render 1`] = `
  />
 </DocumentFragment>
 `;
+
+exports[`<RestoreKeyBackupDialog /> should restore key backup when passphrase is filled 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_RestoreKeyBackupDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        Keys restored
+      </h1>
+    </div>
+    <div
+      class="mx_RestoreKeyBackupDialog_content"
+    >
+      <div>
+        <p>
+          Successfully restored 1 keys
+        </p>
+        <p>
+          Failed to decrypt 1 sessions!
+        </p>
+        <div
+          class="mx_Dialog_buttons"
+        >
+          <span
+            class="mx_Dialog_buttons_row"
+          >
+            <button
+              class="mx_Dialog_primary"
+              data-testid="dialog-primary-button"
+              type="button"
+            >
+              OK
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;
+
+exports[`<RestoreKeyBackupDialog /> should restore key backup when security key is filled by user 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_RestoreKeyBackupDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        Keys restored
+      </h1>
+    </div>
+    <div
+      class="mx_RestoreKeyBackupDialog_content"
+    >
+      <div>
+        <p>
+          Successfully restored 1 keys
+        </p>
+        <p>
+          Failed to decrypt 1 sessions!
+        </p>
+        <div
+          class="mx_Dialog_buttons"
+        >
+          <span
+            class="mx_Dialog_buttons_row"
+          >
+            <button
+              class="mx_Dialog_primary"
+              data-testid="dialog-primary-button"
+              type="button"
+            >
+              OK
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;
+
+exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is cached 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_RestoreKeyBackupDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        Keys restored
+      </h1>
+    </div>
+    <div
+      class="mx_RestoreKeyBackupDialog_content"
+    >
+      <div>
+        <p>
+          Successfully restored 1 keys
+        </p>
+        <p>
+          Failed to decrypt 1 sessions!
+        </p>
+        <div
+          class="mx_Dialog_buttons"
+        >
+          <span
+            class="mx_Dialog_buttons_row"
+          >
+            <button
+              class="mx_Dialog_primary"
+              data-testid="dialog-primary-button"
+              type="button"
+            >
+              OK
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;
+
+exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is in secret storage 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_RestoreKeyBackupDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        Keys restored
+      </h1>
+    </div>
+    <div
+      class="mx_RestoreKeyBackupDialog_content"
+    >
+      <div>
+        <p>
+          Successfully restored 1 keys
+        </p>
+        <p>
+          Failed to decrypt 1 sessions!
+        </p>
+        <div
+          class="mx_Dialog_buttons"
+        >
+          <span
+            class="mx_Dialog_buttons_row"
+          >
+            <button
+              class="mx_Dialog_primary"
+              data-testid="dialog-primary-button"
+              type="button"
+            >
+              OK
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;