Use native js-sdk group call support (#9625)

* Use native js-sdk group call support

Now that the js-sdk supports group calls natively, our group call implementation can be simplified a bit. Switching to the js-sdk implementation also brings the react-sdk up to date with recent MSC3401 changes, and adds support for joining calls from multiple devices. (So, the previous logic which sent to-device messages to prevent multi-device sessions is no longer necessary.)

* Fix strings

* Fix strict type errors
This commit is contained in:
Robin 2022-11-28 16:37:32 -05:00 committed by GitHub
parent 3c7781a561
commit 2c612d5aa1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 383 additions and 567 deletions

View file

@ -121,7 +121,7 @@ describe("CallEvent", () => {
it("shows call details and connection controls if the call is loaded", async () => {
jest.advanceTimersByTime(90000);
call.participants = new Set([alice, bob]);
call.participants = new Map([[alice, new Set(["a"])], [bob, new Set(["b"])]]);
renderEvent();
screen.getByText("@alice:example.org started a video call");

View file

@ -22,6 +22,7 @@ import { Room } from "matrix-js-sdk/src/models/room";
import { RoomStateEvent } from "matrix-js-sdk/src/models/room-state";
import { Widget } from "matrix-widget-api";
import type { RoomMember } from "matrix-js-sdk/src/models/room-member";
import type { ClientWidgetApi } from "matrix-widget-api";
import {
stubClient,
@ -74,7 +75,9 @@ describe("RoomTile", () => {
setupAsyncStoreWithClient(WidgetMessagingStore.instance, client);
MockedCall.create(room, "1");
call = CallStore.instance.getCall(room.roomId) as MockedCall;
const maybeCall = CallStore.instance.getCall(room.roomId);
if (!(maybeCall instanceof MockedCall)) throw new Error("Failed to create call");
call = maybeCall;
widget = new Widget(call.widget);
WidgetMessagingStore.instance.storeMessaging(widget, room.roomId, {
@ -123,19 +126,25 @@ describe("RoomTile", () => {
});
it("tracks participants", () => {
const alice = mkRoomMember(room.roomId, "@alice:example.org");
const bob = mkRoomMember(room.roomId, "@bob:example.org");
const carol = mkRoomMember(room.roomId, "@carol:example.org");
const alice: [RoomMember, Set<string>] = [
mkRoomMember(room.roomId, "@alice:example.org"), new Set(["a"]),
];
const bob: [RoomMember, Set<string>] = [
mkRoomMember(room.roomId, "@bob:example.org"), new Set(["b1", "b2"]),
];
const carol: [RoomMember, Set<string>] = [
mkRoomMember(room.roomId, "@carol:example.org"), new Set(["c"]),
];
expect(screen.queryByLabelText(/participant/)).toBe(null);
act(() => { call.participants = new Set([alice]); });
act(() => { call.participants = new Map([alice]); });
expect(screen.getByLabelText("1 participant").textContent).toBe("1");
act(() => { call.participants = new Set([alice, bob, carol]); });
expect(screen.getByLabelText("3 participants").textContent).toBe("3");
act(() => { call.participants = new Map([alice, bob, carol]); });
expect(screen.getByLabelText("4 participants").textContent).toBe("4");
act(() => { call.participants = new Set(); });
act(() => { call.participants = new Map(); });
expect(screen.queryByLabelText(/participant/)).toBe(null);
});
});

View file

@ -131,7 +131,7 @@ describe("CallLobby", () => {
for (const [userId, avatar] of zip(userIds, avatars)) {
fireEvent.focus(avatar!);
screen.getByRole("tooltip", { name: userId });
screen.getAllByRole("tooltip", { name: userId });
}
};
@ -139,15 +139,21 @@ describe("CallLobby", () => {
expect(screen.queryByLabelText(/joined/)).toBe(null);
expectAvatars([]);
act(() => { call.participants = new Set([alice]); });
act(() => { call.participants = new Map([[alice, new Set(["a"])]]); });
screen.getByText("1 person joined");
expectAvatars([alice.userId]);
act(() => { call.participants = new Set([alice, bob, carol]); });
screen.getByText("3 people joined");
expectAvatars([alice.userId, bob.userId, carol.userId]);
act(() => {
call.participants = new Map([
[alice, new Set(["a"])],
[bob, new Set(["b1", "b2"])],
[carol, new Set(["c"])],
]);
});
screen.getByText("4 people joined");
expectAvatars([alice.userId, bob.userId, bob.userId, carol.userId]);
act(() => { call.participants = new Set(); });
act(() => { call.participants = new Map(); });
expect(screen.queryByLabelText(/joined/)).toBe(null);
expectAvatars([]);
});
@ -166,7 +172,7 @@ describe("CallLobby", () => {
SdkConfig.put({
"element_call": { participant_limit: 2, url: "", use_exclusively: false, brand: "Element Call" },
});
call.participants = new Set([bob, carol]);
call.participants = new Map([[bob, new Set("b")], [carol, new Set("c")]]);
await renderView();
const connectSpy = jest.spyOn(call, "connect");