Add invisible decryption config flag and show invisible crypto decryption errors

playwright/e2e/crypto/invisible-crypto.spec.ts

@@ -0,0 +1,60 @@
+/*
+Copyright 2024 New Vector Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { expect, test } from "../../element-web-test";
+import { autoJoin, createSharedRoomWithUser, verify } from "./utils";
+import { Bot } from "../../pages/bot";
+
+test.describe("Invisible cryptography", () => {
+    test.use({
+        displayName: "Alice",
+        botCreateOpts: { displayName: "Bob", autoAcceptInvites: true },
+        labsFlags: ["feature_invisible_crypto"],
+    });
+
+    test("Messages fail to decrypt when sender is previously verified", async ({
+        page,
+        bot: bob,
+        user: aliceCredentials,
+        app,
+        homeserver,
+    }) => {
+        await app.client.bootstrapCrossSigning(aliceCredentials);
+        await autoJoin(bob);
+
+        // create an encrypted room
+        const testRoomId = await createSharedRoomWithUser(app, bob.credentials.userId, {
+            name: "TestRoom",
+            initial_state: [
+                {
+                    type: "m.room.encryption",
+                    state_key: "",
+                    content: {
+                        algorithm: "m.megolm.v1.aes-sha2",
+                    },
+                },
+            ],
+        });
+
+        // Verify Bob
+        await verify(app, bob);
+
+        // Bob logs in a new device and resets cross-signing
+        const bobSecondDevice = new Bot(page, homeserver, {
+            bootstrapSecretStorage: true,
+            bootstrapCrossSigning: true,
+            setupNewCrossSigning: true,
+        });
+        bobSecondDevice.setCredentials(await homeserver.loginUser(bob.credentials.userId, bob.credentials.password));
+        await bobSecondDevice.prepareClient();
+
+        /* should show an error for a message from a previously verified device */
+        await bobSecondDevice.sendMessage(testRoomId, "test encrypted from previously verified");
+        const lastTile = page.locator(".mx_EventTile_last");
+        await expect(lastTile).toContainText("Verified identity has changed");
+    });
+});

playwright/pages/bot.ts

@@ -37,6 +37,10 @@ export interface CreateBotOpts {
      * Whether to generate cross-signing keys
      */
     bootstrapCrossSigning?: boolean;
+    /**
+     * Whether to reset the cross-signing keys even if keys already exist
+     */
+    setupNewCrossSigning?: boolean;
     /**
      * Whether to bootstrap the secret storage
      */
@@ -186,6 +190,7 @@ export class Bot extends Client {
                     await cli.getCrypto()!.getUserDeviceInfo([credentials.userId]);
 
                     await cli.getCrypto()!.bootstrapCrossSigning({
+                        setupNewCrossSigning: opts.setupNewCrossSigning,
                         authUploadDeviceSigningKeys: async (func) => {
                             await func({
                                 type: "m.login.password",

res/css/views/messages/_DecryptionFailureBody.pcss

@@ -10,3 +10,19 @@ Please see LICENSE files in the repository root for full details.
     color: $secondary-content;
     font-style: italic;
 }
+
+.mx_DecryptionFailureVerifiedIdentityChanged > span {
+    color: $e2e-warning-color;
+    border-radius: $font-16px;
+    border-width: 1px;
+    border-color: $e2e-warning-color;
+    border-style: solid;
+    padding: $font-1px 0.4em $font-1px 0.4em;
+    display: inline-flex;
+    align-items: center;
+
+    .mx_Icon {
+        margin-inline-start: -0.3em;
+        margin-inline-end: 0.2em;
+    }
+}

src/MatrixClientPeg.ts

@@ -24,6 +24,7 @@ import {
 import { VerificationMethod } from "matrix-js-sdk/src/types";
 import * as utils from "matrix-js-sdk/src/utils";
 import { logger } from "matrix-js-sdk/src/logger";
+import { CryptoMode } from "matrix-js-sdk/src/crypto-api";
 
 import createMatrixClient from "./utils/createMatrixClient";
 import SettingsStore from "./settings/SettingsStore";
@@ -343,6 +344,10 @@ class MatrixClientPegClass implements IMatrixClientPeg {
         });
 
         StorageManager.setCryptoInitialised(true);
+
+        if (SettingsStore.getValue("feature_invisible_crypto")) {
+            this.matrixClient.getCrypto()!.setCryptoMode(CryptoMode.Invisible);
+        }
         // TODO: device dehydration and whathaveyou
         return;
     }

src/components/views/messages/DecryptionFailureBody.tsx

@@ -6,15 +6,17 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
 Please see LICENSE files in the repository root for full details.
 */
 
+import classNames from "classnames";
 import React, { forwardRef, ForwardRefExoticComponent, useContext } from "react";
 import { MatrixEvent } from "matrix-js-sdk/src/matrix";
 import { DecryptionFailureCode } from "matrix-js-sdk/src/crypto-api";
 
 import { _t } from "../../../languageHandler";
 import { IBodyProps } from "./IBodyProps";
 import { LocalDeviceVerificationStateContext } from "../../../contexts/LocalDeviceVerificationStateContext";
+import { Icon as WarningBadgeIcon } from "../../../../res/img/compound/error-16px.svg";
 
-function getErrorMessage(mxEvent: MatrixEvent, isVerified: boolean | undefined): string {
+function getErrorMessage(mxEvent: MatrixEvent, isVerified: boolean | undefined): string | React.JSX.Element {
     switch (mxEvent.decryptionFailureReason) {
         case DecryptionFailureCode.MEGOLM_KEY_WITHHELD_FOR_UNVERIFIED_DEVICE:
             return _t("timeline|decryption_failure|blocked");
@@ -33,15 +35,39 @@ function getErrorMessage(mxEvent: MatrixEvent, isVerified: boolean | undefined):
 
         case DecryptionFailureCode.HISTORICAL_MESSAGE_USER_NOT_JOINED:
             return _t("timeline|decryption_failure|historical_event_user_not_joined");
+
+        case DecryptionFailureCode.SENDER_IDENTITY_PREVIOUSLY_VERIFIED:
+            return (
+                <span>
+                    <WarningBadgeIcon className="mx_Icon mx_Icon_16" />
+                    {_t("timeline|decryption_failure|sender_identity_previously_verified")}
+                </span>
+            );
+
+        case DecryptionFailureCode.UNSIGNED_SENDER_DEVICE:
+            // TODO: event should be hidden instead of showing this error (only
+            // happens when invisible crypto is enabled)
+            return _t("encryption|event_shield_reason_unsigned_device");
     }
     return _t("timeline|decryption_failure|unable_to_decrypt");
 }
 
+function getErrorExtraClass(mxEvent: MatrixEvent): Record<string, boolean> {
+    switch (mxEvent.decryptionFailureReason) {
+        case DecryptionFailureCode.SENDER_IDENTITY_PREVIOUSLY_VERIFIED:
+            return { mx_DecryptionFailureVerifiedIdentityChanged: true };
+
+        default:
+            return {};
+    }
+}
+
 // A placeholder element for messages that could not be decrypted
 export const DecryptionFailureBody = forwardRef<HTMLDivElement, IBodyProps>(({ mxEvent }, ref): React.JSX.Element => {
     const verificationState = useContext(LocalDeviceVerificationStateContext);
+    const classes = classNames("mx_DecryptionFailureBody", "mx_EventTile_content", getErrorExtraClass(mxEvent));
     return (
-        <div className="mx_DecryptionFailureBody mx_EventTile_content" ref={ref}>
+        <div className={classes} ref={ref}>
             {getErrorMessage(mxEvent, verificationState)}
         </div>
     );

src/i18n/strings/en_EN.json

@@ -1444,6 +1444,8 @@
         "group_widgets": "Widgets",
         "hidebold": "Hide notification dot (only display counters badges)",
         "html_topic": "Show HTML representation of room topics",
+        "invisible_crypto": "Invisible cryptography",
+        "invisible_crypto_description": "Invisible cryptography is an experimental cryptography mode that uses cross-signing to provide a cleaner cryptography experience.  If you enable this mode, you may be unable to communicate with users who have not cross-signed their devices.",
         "join_beta": "Join the beta",
         "join_beta_reload": "Joining the beta will reload %(brand)s.",
         "jump_to_date": "Jump to date (adds /jumptodate and jump to date headers)",
@@ -3291,6 +3293,7 @@
             "historical_event_no_key_backup": "Historical messages are not available on this device",
             "historical_event_unverified_device": "You need to verify this device for access to historical messages",
             "historical_event_user_not_joined": "You don't have access to this message",
+            "sender_identity_previously_verified": "Verified identity has changed",
             "unable_to_decrypt": "Unable to decrypt message"
         },
         "disambiguated_profile": "%(displayName)s (%(matrixId)s)",

src/settings/Settings.tsx

@@ -10,6 +10,7 @@ Please see LICENSE files in the repository root for full details.
 import React, { ReactNode } from "react";
 
 import { _t, _td, TranslationKey } from "../languageHandler";
+import InvisibleCryptoController from "./controllers/InvisibleCryptoController";
 import {
     NotificationBodyEnabledController,
     NotificationsEnabledController,
@@ -316,6 +317,16 @@ export const SETTINGS: { [setting: string]: ISetting } = {
         supportedLevelsAreOrdered: true,
         default: false,
     },
+    "feature_invisible_crypto": {
+        isFeature: true,
+        labsGroup: LabGroup.Encryption,
+        controller: new InvisibleCryptoController(),
+        displayName: _td("labs|invisible_crypto"),
+        description: _td("labs|invisible_crypto_description"),
+        supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS_WITH_CONFIG_PRIORITISED,
+        supportedLevelsAreOrdered: true,
+        default: false,
+    },
     "useOnlyCurrentProfiles": {
         supportedLevels: LEVELS_ACCOUNT_SETTINGS,
         displayName: _td("settings|disable_historical_profile"),

src/settings/controllers/InvisibleCryptoController.ts

@@ -0,0 +1,20 @@
+/*
+Copyright 2024 New Vector Ltd.
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { CryptoMode } from "matrix-js-sdk/src/crypto-api";
+
+import SettingController from "./SettingController";
+import { MatrixClientPeg } from "../../MatrixClientPeg";
+import { SettingLevel } from "../SettingLevel";
+
+export default class InvisibleCryptoController extends SettingController {
+    public onChange(level: SettingLevel, roomId: string, newValue: any): void {
+        const crypto = MatrixClientPeg.safeGet().getCrypto();
+        if (crypto) {
+            crypto.setCryptoMode(newValue ? CryptoMode.Invisible : CryptoMode.Legacy);
+        }
+    }
+}

test/components/views/messages/DecryptionFailureBody-test.tsx

@@ -103,4 +103,32 @@ describe("DecryptionFailureBody", () => {
         // Then
         expect(container).toHaveTextContent("You don't have access to this message");
     });
+
+    it("should handle messages from users who change identities after verification", async () => {
+        // When
+        const event = await mkDecryptionFailureMatrixEvent({
+            code: DecryptionFailureCode.SENDER_IDENTITY_PREVIOUSLY_VERIFIED,
+            msg: "User previously verified",
+            roomId: "fakeroom",
+            sender: "fakesender",
+        });
+        const { container } = customRender(event);
+
+        // Then
+        expect(container).toHaveTextContent("Verified identity has changed");
+    });
+
+    it("should handle messages from unverified devices", async () => {
+        // When
+        const event = await mkDecryptionFailureMatrixEvent({
+            code: DecryptionFailureCode.UNSIGNED_SENDER_DEVICE,
+            msg: "Unsigned device",
+            roomId: "fakeroom",
+            sender: "fakesender",
+        });
+        const { container } = customRender(event);
+
+        // Then
+        expect(container).toHaveTextContent("Encrypted by a device not verified by its owner");
+    });
 });

test/settings/controllers/InvisibleCryptoController-test.ts

@@ -0,0 +1,37 @@
+/*
+Copyright 2024 New Vector Ltd.
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { CryptoApi, CryptoMode } from "matrix-js-sdk/src/crypto-api";
+
+import { MatrixClientPeg } from "../../../src/MatrixClientPeg";
+import { stubClient } from "../../test-utils";
+import InvisibleCryptoController from "../../../src/settings/controllers/InvisibleCryptoController";
+import { SettingLevel } from "../../../src/settings/SettingLevel";
+
+describe("InvisibleCryptoController", () => {
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+
+    it("tracks enabling and disabling", () => {
+        const cli = stubClient();
+        const setCryptoModeMock = jest.fn();
+        cli.getCrypto = jest.fn(() => {
+            return {
+                setCryptoMode: setCryptoModeMock,
+            } as unknown as CryptoApi;
+        });
+        jest.spyOn(MatrixClientPeg, "safeGet").mockReturnValue(cli);
+
+        const controller = new InvisibleCryptoController();
+
+        controller.onChange(SettingLevel.DEVICE, "", true);
+        expect(setCryptoModeMock).toHaveBeenCalledWith(CryptoMode.Invisible);
+
+        controller.onChange(SettingLevel.DEVICE, "", false);
+        expect(setCryptoModeMock).toHaveBeenCalledWith(CryptoMode.Legacy);
+    });
+});