Implement MSC3819: Allowing widgets to send/receive to-device messages (#8885)

* Implement MSC3819: Allowing widgets to send/receive to-device messages

* Don't change the room events and state events drivers

* Update to latest matrix-widget-api changes

* Support sending encrypted to-device messages

* Use queueToDevice for better reliability

* Update types for latest WidgetDriver changes

* Upgrade matrix-widget-api

* Add tests

* Test StopGapWidget

* Fix a potential memory leak

test/stores/widgets/StopGapWidget-test.ts

@@ -0,0 +1,70 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { mocked, MockedObject } from "jest-mock";
+import { MatrixClient, ClientEvent } from "matrix-js-sdk/src/client";
+import { ClientWidgetApi } from "matrix-widget-api";
+
+import { stubClient, mkRoom, mkEvent } from "../../test-utils";
+import { MatrixClientPeg } from "../../../src/MatrixClientPeg";
+import { StopGapWidget } from "../../../src/stores/widgets/StopGapWidget";
+
+jest.mock("matrix-widget-api/lib/ClientWidgetApi");
+
+describe("StopGapWidget", () => {
+    let client: MockedObject<MatrixClient>;
+    let widget: StopGapWidget;
+    let messaging: MockedObject<ClientWidgetApi>;
+
+    beforeEach(() => {
+        stubClient();
+        client = mocked(MatrixClientPeg.get());
+
+        widget = new StopGapWidget({
+            app: {
+                id: "test",
+                creatorUserId: "@alice:example.org",
+                type: "example",
+                url: "https://example.org",
+            },
+            room: mkRoom(client, "!1:example.org"),
+            userId: "@alice:example.org",
+            creatorUserId: "@alice:example.org",
+            waitForIframeLoad: true,
+            userWidget: false,
+        });
+        // Start messaging without an iframe, since ClientWidgetApi is mocked
+        widget.startMessaging(null as unknown as HTMLIFrameElement);
+        messaging = mocked(mocked(ClientWidgetApi).mock.instances[0]);
+    });
+
+    afterEach(() => {
+        widget.stopMessaging();
+    });
+
+    it("feeds incoming to-device messages to the widget", async () => {
+        const event = mkEvent({
+            event: true,
+            type: "org.example.foo",
+            user: "@alice:example.org",
+            content: { hello: "world" },
+        });
+
+        client.emit(ClientEvent.ToDeviceEvent, event);
+        await Promise.resolve(); // flush promises
+        expect(messaging.feedToDevice).toHaveBeenCalledWith(event.getEffectiveEvent(), false);
+    });
+});

test/stores/widgets/StopGapWidgetDriver-test.ts

@@ -0,0 +1,79 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { mocked, MockedObject } from "jest-mock";
+import { Widget, WidgetKind, WidgetDriver } from "matrix-widget-api";
+import { MatrixClient } from "matrix-js-sdk/src/client";
+import { DeviceInfo } from "matrix-js-sdk/src/crypto/deviceinfo";
+
+import { MatrixClientPeg } from "../../../src/MatrixClientPeg";
+import { StopGapWidgetDriver } from "../../../src/stores/widgets/StopGapWidgetDriver";
+import { stubClient } from "../../test-utils";
+
+describe("StopGapWidgetDriver", () => {
+    let client: MockedObject<MatrixClient>;
+    let driver: WidgetDriver;
+
+    beforeEach(() => {
+        stubClient();
+        client = mocked(MatrixClientPeg.get());
+
+        driver = new StopGapWidgetDriver(
+            [],
+            new Widget({
+                id: "test",
+                creatorUserId: "@alice:example.org",
+                type: "example",
+                url: "https://example.org",
+            }),
+            WidgetKind.Room,
+        );
+    });
+
+    describe("sendToDevice", () => {
+        const contentMap = {
+            "@alice:example.org": {
+                "*": {
+                    hello: "alice",
+                },
+            },
+            "@bob:example.org": {
+                "bobDesktop": {
+                    hello: "bob",
+                },
+            },
+        };
+
+        it("sends unencrypted messages", async () => {
+            await driver.sendToDevice("org.example.foo", false, contentMap);
+            expect(client.queueToDevice.mock.calls).toMatchSnapshot();
+        });
+
+        it("sends encrypted messages", async () => {
+            const aliceWeb = new DeviceInfo("aliceWeb");
+            const aliceMobile = new DeviceInfo("aliceMobile");
+            const bobDesktop = new DeviceInfo("bobDesktop");
+
+            mocked(client.crypto.deviceList).downloadKeys.mockResolvedValue({
+                "@alice:example.org": { aliceWeb, aliceMobile },
+                "@bob:example.org": { bobDesktop },
+            });
+
+            await driver.sendToDevice("org.example.foo", true, contentMap);
+            expect(client.encryptAndSendToDevices.mock.calls).toMatchSnapshot();
+        });
+    });
+});

test/stores/widgets/__snapshots__/StopGapWidgetDriver-test.ts.snap

@@ -0,0 +1,82 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`StopGapWidgetDriver sendToDevice sends encrypted messages 1`] = `
+Array [
+  Array [
+    Array [
+      Object {
+        "deviceInfo": DeviceInfo {
+          "algorithms": undefined,
+          "deviceId": "aliceWeb",
+          "keys": Object {},
+          "known": false,
+          "signatures": Object {},
+          "unsigned": Object {},
+          "verified": 0,
+        },
+        "userId": "@alice:example.org",
+      },
+      Object {
+        "deviceInfo": DeviceInfo {
+          "algorithms": undefined,
+          "deviceId": "aliceMobile",
+          "keys": Object {},
+          "known": false,
+          "signatures": Object {},
+          "unsigned": Object {},
+          "verified": 0,
+        },
+        "userId": "@alice:example.org",
+      },
+    ],
+    Object {
+      "hello": "alice",
+    },
+  ],
+  Array [
+    Array [
+      Object {
+        "deviceInfo": DeviceInfo {
+          "algorithms": undefined,
+          "deviceId": "bobDesktop",
+          "keys": Object {},
+          "known": false,
+          "signatures": Object {},
+          "unsigned": Object {},
+          "verified": 0,
+        },
+        "userId": "@bob:example.org",
+      },
+    ],
+    Object {
+      "hello": "bob",
+    },
+  ],
+]
+`;
+
+exports[`StopGapWidgetDriver sendToDevice sends unencrypted messages 1`] = `
+Array [
+  Array [
+    Object {
+      "batch": Array [
+        Object {
+          "deviceId": "*",
+          "payload": Object {
+            "hello": "alice",
+          },
+          "userId": "@alice:example.org",
+        },
+        Object {
+          "deviceId": "bobDesktop",
+          "payload": Object {
+            "hello": "bob",
+          },
+          "userId": "@bob:example.org",
+        },
+      ],
+      "eventType": "org.example.foo",
+    },
+  ],
+]
+`;

test/test-utils/test-utils.ts

@@ -91,6 +91,12 @@ export function createTestClient(): MatrixClient {
             removeRoom: jest.fn(),
         },
 
+        crypto: {
+            deviceList: {
+                downloadKeys: jest.fn(),
+            },
+        },
+
         getPushActionsForEvent: jest.fn(),
         getRoom: jest.fn().mockImplementation(mkStubRoom),
         getRooms: jest.fn().mockReturnValue([]),
@@ -163,6 +169,9 @@ export function createTestClient(): MatrixClient {
         downloadKeys: jest.fn(),
         fetchRoomEvent: jest.fn(),
         makeTxnId: jest.fn().mockImplementation(() => `t${txnId++}`),
+        sendToDevice: jest.fn().mockResolvedValue(undefined),
+        queueToDevice: jest.fn().mockResolvedValue(undefined),
+        encryptAndSendToDevices: jest.fn().mockResolvedValue(undefined),
     } as unknown as MatrixClient;
 }
 
@@ -176,7 +185,7 @@ type MakeEventPassThruProps = {
 type MakeEventProps = MakeEventPassThruProps & {
     type: string;
     content: IContent;
-    room: Room["roomId"];
+    room?: Room["roomId"]; // to-device messages are roomless
     // eslint-disable-next-line camelcase
     prev_content?: IContent;
     unsigned?: IUnsigned;