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:
parent
3c7781a561
commit
2c612d5aa1
20 changed files with 383 additions and 567 deletions
|
@ -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");
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
});
|
||||
|
|
|
@ -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");
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue