From d898af820be4c153ee5a09984f7c9c1e17beb759 Mon Sep 17 00:00:00 2001 From: Michael Weimann Date: Thu, 20 Oct 2022 12:17:38 +0200 Subject: [PATCH] Fix displaying already stopped broadcasts in the timeline (#9470) --- .../components/VoiceBroadcastBody.tsx | 1 + .../components/VoiceBroadcastBody-test.tsx | 57 ++++++++++--------- test/voice-broadcast/utils/test-utils.ts | 11 ++++ 3 files changed, 43 insertions(+), 26 deletions(-) diff --git a/src/voice-broadcast/components/VoiceBroadcastBody.tsx b/src/voice-broadcast/components/VoiceBroadcastBody.tsx index b05c6c894b..95bc9fde06 100644 --- a/src/voice-broadcast/components/VoiceBroadcastBody.tsx +++ b/src/voice-broadcast/components/VoiceBroadcastBody.tsx @@ -49,6 +49,7 @@ export const VoiceBroadcastBody: React.FC = ({ mxEvent }) => { client, ); relationsHelper.on(RelationsHelperEvent.Add, onInfoEvent); + relationsHelper.emitCurrent(); return () => { relationsHelper.destroy(); diff --git a/test/voice-broadcast/components/VoiceBroadcastBody-test.tsx b/test/voice-broadcast/components/VoiceBroadcastBody-test.tsx index 7b01dd58be..99cfb69444 100644 --- a/test/voice-broadcast/components/VoiceBroadcastBody-test.tsx +++ b/test/voice-broadcast/components/VoiceBroadcastBody-test.tsx @@ -17,11 +17,10 @@ limitations under the License. import React from "react"; import { act, render, screen } from "@testing-library/react"; import { mocked } from "jest-mock"; -import { MatrixClient, MatrixEvent } from "matrix-js-sdk/src/matrix"; +import { MatrixClient, MatrixEvent, Room } from "matrix-js-sdk/src/matrix"; import { VoiceBroadcastBody, - VoiceBroadcastInfoEventType, VoiceBroadcastInfoState, VoiceBroadcastRecordingBody, VoiceBroadcastRecordingsStore, @@ -30,8 +29,8 @@ import { VoiceBroadcastPlayback, VoiceBroadcastPlaybacksStore, } from "../../../src/voice-broadcast"; -import { mkEvent, stubClient } from "../../test-utils"; -import { RelationsHelper } from "../../../src/events/RelationsHelper"; +import { stubClient } from "../../test-utils"; +import { mkVoiceBroadcastInfoStateEvent } from "../utils/test-utils"; jest.mock("../../../src/voice-broadcast/components/molecules/VoiceBroadcastRecordingBody", () => ({ VoiceBroadcastRecordingBody: jest.fn(), @@ -41,27 +40,15 @@ jest.mock("../../../src/voice-broadcast/components/molecules/VoiceBroadcastPlayb VoiceBroadcastPlaybackBody: jest.fn(), })); -jest.mock("../../../src/events/RelationsHelper"); - describe("VoiceBroadcastBody", () => { const roomId = "!room:example.com"; let client: MatrixClient; + let room: Room; let infoEvent: MatrixEvent; + let stoppedEvent: MatrixEvent; let testRecording: VoiceBroadcastRecording; let testPlayback: VoiceBroadcastPlayback; - const mkVoiceBroadcastInfoEvent = (state: VoiceBroadcastInfoState) => { - return mkEvent({ - event: true, - type: VoiceBroadcastInfoEventType, - user: client.getUserId(), - room: roomId, - content: { - state, - }, - }); - }; - const renderVoiceBroadcast = () => { render( { beforeEach(() => { client = stubClient(); - infoEvent = mkVoiceBroadcastInfoEvent(VoiceBroadcastInfoState.Started); + room = new Room(roomId, client, client.getUserId()); + mocked(client.getRoom).mockImplementation((getRoomId: string) => { + if (getRoomId === roomId) return room; + }); + + infoEvent = mkVoiceBroadcastInfoStateEvent(roomId, VoiceBroadcastInfoState.Started, client.getUserId()); + stoppedEvent = mkVoiceBroadcastInfoStateEvent( + roomId, + VoiceBroadcastInfoState.Stopped, + client.getUserId(), + infoEvent, + ); + room.addEventsToTimeline([infoEvent], true, room.getLiveTimeline()); testRecording = new VoiceBroadcastRecording(infoEvent, client); testPlayback = new VoiceBroadcastPlayback(infoEvent, client); mocked(VoiceBroadcastRecordingBody).mockImplementation(({ recording }) => { @@ -107,7 +106,18 @@ describe("VoiceBroadcastBody", () => { ); }); - describe("when displaying a voice broadcast recording", () => { + describe("when there is a stopped voice broadcast", () => { + beforeEach(() => { + room.addEventsToTimeline([stoppedEvent], true, room.getLiveTimeline()); + renderVoiceBroadcast(); + }); + + it("should render a voice broadcast playback body", () => { + screen.getByTestId("voice-broadcast-playback-body"); + }); + }); + + describe("when there is a started voice broadcast from the current user", () => { beforeEach(() => { renderVoiceBroadcast(); }); @@ -118,13 +128,8 @@ describe("VoiceBroadcastBody", () => { describe("and the recordings ends", () => { beforeEach(() => { - const stoppedEvent = mkVoiceBroadcastInfoEvent(VoiceBroadcastInfoState.Stopped); - // get the RelationsHelper instanced used in VoiceBroadcastBody - const relationsHelper = mocked(RelationsHelper).mock.instances[5]; act(() => { - // invoke the callback of the VoiceBroadcastBody hook to simulate an ended broadcast - // @ts-ignore - mocked(relationsHelper.on).mock.calls[0][1](stoppedEvent); + room.addEventsToTimeline([stoppedEvent], true, room.getLiveTimeline()); }); }); diff --git a/test/voice-broadcast/utils/test-utils.ts b/test/voice-broadcast/utils/test-utils.ts index 2a73877474..fc8635fc4c 100644 --- a/test/voice-broadcast/utils/test-utils.ts +++ b/test/voice-broadcast/utils/test-utils.ts @@ -23,7 +23,17 @@ export const mkVoiceBroadcastInfoStateEvent = ( roomId: string, state: VoiceBroadcastInfoState, sender: string, + startedInfoEvent?: MatrixEvent, ): MatrixEvent => { + const relationContent = {}; + + if (startedInfoEvent) { + relationContent["m.relates_to"] = { + event_id: startedInfoEvent.getId(), + rel_type: "m.reference", + }; + } + return mkEvent({ event: true, room: roomId, @@ -32,6 +42,7 @@ export const mkVoiceBroadcastInfoStateEvent = ( skey: sender, content: { state, + ...relationContent, }, }); };