2023-11-21 21:28:54 +00:00
|
|
|
/*
|
2024-09-09 13:57:16 +00:00
|
|
|
Copyright 2024 New Vector Ltd.
|
2023-11-21 21:28:54 +00:00
|
|
|
Copyright 2023 The Matrix.org Foundation C.I.C.
|
|
|
|
|
2024-09-09 13:57:16 +00:00
|
|
|
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
|
|
|
|
Please see LICENSE files in the repository root for full details.
|
2023-11-21 21:28:54 +00:00
|
|
|
*/
|
|
|
|
|
|
|
|
import React from "react";
|
|
|
|
import { MockedObject } from "jest-mock";
|
|
|
|
import { Room } from "matrix-js-sdk/src/matrix";
|
2024-10-14 16:11:58 +00:00
|
|
|
import { fireEvent, render, screen, waitFor } from "jest-matrix-react";
|
2023-11-21 21:28:54 +00:00
|
|
|
|
|
|
|
import { VideoRoomChatButton } from "../../../../../src/components/views/rooms/RoomHeader/VideoRoomChatButton";
|
|
|
|
import { SDKContext, SdkContextClass } from "../../../../../src/contexts/SDKContext";
|
|
|
|
import RightPanelStore from "../../../../../src/stores/right-panel/RightPanelStore";
|
|
|
|
import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../../test-utils";
|
|
|
|
import { RoomNotificationState } from "../../../../../src/stores/notifications/RoomNotificationState";
|
2024-01-15 15:25:48 +00:00
|
|
|
import { NotificationLevel } from "../../../../../src/stores/notifications/NotificationLevel";
|
2023-11-21 21:28:54 +00:00
|
|
|
import { NotificationStateEvents } from "../../../../../src/stores/notifications/NotificationState";
|
|
|
|
import { RightPanelPhases } from "../../../../../src/stores/right-panel/RightPanelStorePhases";
|
|
|
|
|
|
|
|
describe("<VideoRoomChatButton />", () => {
|
|
|
|
const roomId = "!room:server.org";
|
|
|
|
let sdkContext!: SdkContextClass;
|
|
|
|
let rightPanelStore!: MockedObject<RightPanelStore>;
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Create a room using mocked client
|
|
|
|
* And mock isElementVideoRoom
|
|
|
|
*/
|
|
|
|
const makeRoom = (isVideoRoom = true): Room => {
|
|
|
|
const room = new Room(roomId, sdkContext.client!, sdkContext.client!.getSafeUserId());
|
|
|
|
jest.spyOn(room, "isElementVideoRoom").mockReturnValue(isVideoRoom);
|
|
|
|
// stub
|
|
|
|
jest.spyOn(room, "getPendingEvents").mockReturnValue([]);
|
|
|
|
return room;
|
|
|
|
};
|
|
|
|
|
2024-01-15 15:25:48 +00:00
|
|
|
const mockRoomNotificationState = (room: Room, level: NotificationLevel): RoomNotificationState => {
|
2024-01-29 17:52:48 +00:00
|
|
|
const roomNotificationState = new RoomNotificationState(room, false);
|
2023-11-21 21:28:54 +00:00
|
|
|
|
|
|
|
// @ts-ignore ugly mocking
|
2024-01-15 15:25:48 +00:00
|
|
|
roomNotificationState._level = level;
|
2023-11-21 21:28:54 +00:00
|
|
|
jest.spyOn(sdkContext.roomNotificationStateStore, "getRoomState").mockReturnValue(roomNotificationState);
|
|
|
|
return roomNotificationState;
|
|
|
|
};
|
|
|
|
|
|
|
|
const getComponent = (room: Room) =>
|
|
|
|
render(<VideoRoomChatButton room={room} />, {
|
2024-04-15 13:54:37 +00:00
|
|
|
wrapper: ({ children }) => <SDKContext.Provider value={sdkContext}>{children}</SDKContext.Provider>,
|
2023-11-21 21:28:54 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
const client = getMockClientWithEventEmitter({
|
|
|
|
...mockClientMethodsUser(),
|
|
|
|
});
|
|
|
|
rightPanelStore = {
|
2024-09-30 16:36:24 +00:00
|
|
|
showOrHidePhase: jest.fn(),
|
2023-11-21 21:28:54 +00:00
|
|
|
} as unknown as MockedObject<RightPanelStore>;
|
|
|
|
sdkContext = new SdkContextClass();
|
|
|
|
sdkContext.client = client;
|
|
|
|
jest.spyOn(sdkContext, "rightPanelStore", "get").mockReturnValue(rightPanelStore);
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
jest.restoreAllMocks();
|
|
|
|
});
|
|
|
|
|
|
|
|
it("toggles timeline in right panel on click", () => {
|
|
|
|
const room = makeRoom();
|
|
|
|
getComponent(room);
|
|
|
|
|
2024-10-14 16:11:58 +00:00
|
|
|
fireEvent.click(screen.getByRole("button", { name: "Chat" }));
|
2023-11-21 21:28:54 +00:00
|
|
|
|
2024-09-30 16:36:24 +00:00
|
|
|
expect(sdkContext.rightPanelStore.showOrHidePhase).toHaveBeenCalledWith(RightPanelPhases.Timeline);
|
2023-11-21 21:28:54 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
it("renders button with an unread marker when room is unread", () => {
|
|
|
|
const room = makeRoom();
|
2024-01-15 15:25:48 +00:00
|
|
|
mockRoomNotificationState(room, NotificationLevel.Activity);
|
2023-11-21 21:28:54 +00:00
|
|
|
getComponent(room);
|
|
|
|
|
|
|
|
// snapshot includes `data-indicator` attribute
|
2024-10-14 16:11:58 +00:00
|
|
|
expect(screen.getByRole("button", { name: "Chat" })).toMatchSnapshot();
|
|
|
|
expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy();
|
2023-11-21 21:28:54 +00:00
|
|
|
});
|
|
|
|
|
2024-08-06 17:22:02 +00:00
|
|
|
it("adds unread marker when room notification state changes to unread", async () => {
|
2023-11-21 21:28:54 +00:00
|
|
|
const room = makeRoom();
|
|
|
|
// start in read state
|
2024-01-15 15:25:48 +00:00
|
|
|
const notificationState = mockRoomNotificationState(room, NotificationLevel.None);
|
2023-11-21 21:28:54 +00:00
|
|
|
getComponent(room);
|
|
|
|
|
|
|
|
// no unread marker
|
2024-10-14 16:11:58 +00:00
|
|
|
expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeFalsy();
|
2023-11-21 21:28:54 +00:00
|
|
|
|
|
|
|
// @ts-ignore ugly mocking
|
2024-01-15 15:25:48 +00:00
|
|
|
notificationState._level = NotificationLevel.Highlight;
|
2023-11-21 21:28:54 +00:00
|
|
|
notificationState.emit(NotificationStateEvents.Update);
|
|
|
|
|
|
|
|
// unread marker
|
2024-10-14 16:11:58 +00:00
|
|
|
await waitFor(() =>
|
|
|
|
expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy(),
|
|
|
|
);
|
2023-11-21 21:28:54 +00:00
|
|
|
});
|
|
|
|
|
2024-08-06 17:22:02 +00:00
|
|
|
it("clears unread marker when room notification state changes to read", async () => {
|
2023-11-21 21:28:54 +00:00
|
|
|
const room = makeRoom();
|
|
|
|
// start in unread state
|
2024-01-15 15:25:48 +00:00
|
|
|
const notificationState = mockRoomNotificationState(room, NotificationLevel.Highlight);
|
2023-11-21 21:28:54 +00:00
|
|
|
getComponent(room);
|
|
|
|
|
|
|
|
// unread marker
|
2024-10-14 16:11:58 +00:00
|
|
|
expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy();
|
2023-11-21 21:28:54 +00:00
|
|
|
|
|
|
|
// @ts-ignore ugly mocking
|
2024-01-15 15:25:48 +00:00
|
|
|
notificationState._level = NotificationLevel.None;
|
2023-11-21 21:28:54 +00:00
|
|
|
notificationState.emit(NotificationStateEvents.Update);
|
|
|
|
|
|
|
|
// unread marker cleared
|
2024-10-14 16:11:58 +00:00
|
|
|
await waitFor(() =>
|
|
|
|
expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeFalsy(),
|
|
|
|
);
|
2023-11-21 21:28:54 +00:00
|
|
|
});
|
|
|
|
});
|