element-web/test/components/views/dialogs/polls/PollHistoryDialog-test.tsx

318 lines
13 KiB
TypeScript

/*
Copyright 2023 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 React from "react";
import { fireEvent, render } from "@testing-library/react";
import { Filter } from "matrix-js-sdk/src/filter";
import { EventTimeline, Room } from "matrix-js-sdk/src/matrix";
import { M_POLL_START } from "matrix-js-sdk/src/@types/polls";
import { PollHistoryDialog } from "../../../../../src/components/views/dialogs/polls/PollHistoryDialog";
import {
flushPromises,
getMockClientWithEventEmitter,
makePollEndEvent,
makePollStartEvent,
mockClientMethodsUser,
mockIntlDateTimeFormat,
setupRoomWithPollEvents,
unmockIntlDateTimeFormat,
} from "../../../../test-utils";
describe("<PollHistoryDialog />", () => {
// 14.03.2022 16:15
const now = 1647270879403;
const userId = "@alice:domain.org";
const roomId = "!room:domain.org";
const mockClient = getMockClientWithEventEmitter({
...mockClientMethodsUser(userId),
getRoom: jest.fn(),
relations: jest.fn(),
decryptEventIfNeeded: jest.fn(),
getOrCreateFilter: jest.fn(),
paginateEventTimeline: jest.fn(),
});
let room = new Room(roomId, mockClient, userId);
const expectedFilter = new Filter(userId);
expectedFilter.setDefinition({
room: {
timeline: {
types: [M_POLL_START.name, M_POLL_START.altName],
},
},
});
const defaultProps = {
roomId,
matrixClient: mockClient,
onFinished: jest.fn(),
};
const getComponent = () => render(<PollHistoryDialog {...defaultProps} />);
beforeAll(() => {
mockIntlDateTimeFormat();
});
beforeEach(() => {
room = new Room(roomId, mockClient, userId);
mockClient.getRoom.mockReturnValue(room);
mockClient.relations.mockResolvedValue({ events: [] });
const timeline = room.getLiveTimeline();
jest.spyOn(timeline, "getEvents").mockReturnValue([]);
jest.spyOn(room, "getOrCreateFilteredTimelineSet");
mockClient.getOrCreateFilter.mockResolvedValue(expectedFilter.filterId!);
mockClient.paginateEventTimeline.mockReset().mockResolvedValue(false);
jest.spyOn(Date, "now").mockReturnValue(now);
});
afterAll(() => {
unmockIntlDateTimeFormat();
});
it("throws when room is not found", () => {
mockClient.getRoom.mockReturnValue(null);
expect(() => getComponent()).toThrow("Cannot find room");
});
it("renders a loading message while poll history is fetched", async () => {
const timelineSet = room.getOrCreateFilteredTimelineSet(expectedFilter);
const liveTimeline = timelineSet.getLiveTimeline();
jest.spyOn(liveTimeline, "getPaginationToken").mockReturnValueOnce("test-pagination-token");
const { queryByText, getByText } = getComponent();
expect(mockClient.getOrCreateFilter).toHaveBeenCalledWith(
`POLL_HISTORY_FILTER_${room.roomId}}`,
expectedFilter,
);
// no results not shown until loading finished
expect(queryByText("There are no active polls in this room")).not.toBeInTheDocument();
expect(getByText("Loading polls")).toBeInTheDocument();
// flush filter creation request
await flushPromises();
expect(liveTimeline.getPaginationToken).toHaveBeenCalledWith(EventTimeline.BACKWARDS);
expect(mockClient.paginateEventTimeline).toHaveBeenCalledWith(liveTimeline, { backwards: true });
// only one page
expect(mockClient.paginateEventTimeline).toHaveBeenCalledTimes(1);
// finished loading
expect(queryByText("Loading polls")).not.toBeInTheDocument();
expect(getByText("There are no active polls in this room")).toBeInTheDocument();
});
it("fetches poll history until end of timeline is reached while within time limit", async () => {
const timelineSet = room.getOrCreateFilteredTimelineSet(expectedFilter);
const liveTimeline = timelineSet.getLiveTimeline();
// mock three pages of timeline history
jest.spyOn(liveTimeline, "getPaginationToken")
.mockReturnValueOnce("test-pagination-token-1")
.mockReturnValueOnce("test-pagination-token-2")
.mockReturnValueOnce("test-pagination-token-3");
const { queryByText, getByText } = getComponent();
expect(mockClient.getOrCreateFilter).toHaveBeenCalledWith(
`POLL_HISTORY_FILTER_${room.roomId}}`,
expectedFilter,
);
// flush filter creation request
await flushPromises();
// once per page
expect(mockClient.paginateEventTimeline).toHaveBeenCalledTimes(3);
// finished loading
expect(queryByText("Loading polls")).not.toBeInTheDocument();
expect(getByText("There are no active polls in this room")).toBeInTheDocument();
});
it("fetches poll history until event older than history period is reached", async () => {
const timelineSet = room.getOrCreateFilteredTimelineSet(expectedFilter);
const liveTimeline = timelineSet.getLiveTimeline();
const thirtyOneDaysAgoTs = now - 60000 * 60 * 24 * 31;
jest.spyOn(liveTimeline, "getEvents")
.mockReturnValueOnce([])
.mockReturnValueOnce([makePollStartEvent("Question?", userId, undefined, { ts: thirtyOneDaysAgoTs })]);
// mock three pages of timeline history
jest.spyOn(liveTimeline, "getPaginationToken")
.mockReturnValueOnce("test-pagination-token-1")
.mockReturnValueOnce("test-pagination-token-2")
.mockReturnValueOnce("test-pagination-token-3");
getComponent();
// flush filter creation request
await flushPromises();
// after first fetch the time limit is reached
// stop paging
expect(mockClient.paginateEventTimeline).toHaveBeenCalledTimes(1);
});
it("displays loader and list while paging timeline", async () => {
const timelineSet = room.getOrCreateFilteredTimelineSet(expectedFilter);
const liveTimeline = timelineSet.getLiveTimeline();
const tenDaysAgoTs = now - 60000 * 60 * 24 * 10;
jest.spyOn(liveTimeline, "getEvents").mockReset().mockReturnValue([]);
// mock three pages of timeline history
jest.spyOn(liveTimeline, "getPaginationToken")
.mockReturnValueOnce("test-pagination-token-1")
.mockReturnValueOnce("test-pagination-token-2")
.mockReturnValueOnce("test-pagination-token-3");
// reference to pagination resolve, so we can assert between pages
let resolvePagination1: (value: boolean) => void | undefined;
let resolvePagination2: (value: boolean) => void | undefined;
mockClient.paginateEventTimeline
.mockImplementationOnce(async (_p) => {
const pollStart = makePollStartEvent("Question?", userId, undefined, { ts: now, id: "1" });
jest.spyOn(liveTimeline, "getEvents").mockReturnValue([pollStart]);
room.processPollEvents([pollStart]);
return new Promise((resolve) => (resolvePagination1 = resolve));
})
.mockImplementationOnce(async (_p) => {
const pollStart = makePollStartEvent("Older question?", userId, undefined, {
ts: tenDaysAgoTs,
id: "2",
});
jest.spyOn(liveTimeline, "getEvents").mockReturnValue([pollStart]);
room.processPollEvents([pollStart]);
return new Promise((resolve) => (resolvePagination2 = resolve));
});
const { getByText, queryByText } = getComponent();
await flushPromises();
expect(mockClient.paginateEventTimeline).toHaveBeenCalledTimes(1);
resolvePagination1!(true);
await flushPromises();
// first page has results, display immediately
expect(getByText("Question?")).toBeInTheDocument();
// but we are still fetching history, diaply loader
expect(getByText("Loading polls")).toBeInTheDocument();
resolvePagination2!(true);
await flushPromises();
// additional results addeds
expect(getByText("Older question?")).toBeInTheDocument();
expect(getByText("Question?")).toBeInTheDocument();
// finished paging
expect(queryByText("Loading polls")).not.toBeInTheDocument();
expect(mockClient.paginateEventTimeline).toHaveBeenCalledTimes(3);
});
it("renders a no polls message when there are no active polls in the room", async () => {
const { getByText } = getComponent();
await flushPromises();
expect(getByText("There are no active polls in this room")).toBeTruthy();
});
it("renders a no past polls message when there are no past polls in the room", async () => {
const { getByText } = getComponent();
await flushPromises();
fireEvent.click(getByText("Past polls"));
expect(getByText("There are no past polls in this room")).toBeTruthy();
});
it("renders a list of active polls when there are polls in the room", async () => {
const timestamp = 1675300825090;
const pollStart1 = makePollStartEvent("Question?", userId, undefined, { ts: timestamp, id: "$1" });
const pollStart2 = makePollStartEvent("Where?", userId, undefined, { ts: timestamp + 10000, id: "$2" });
const pollStart3 = makePollStartEvent("What?", userId, undefined, { ts: timestamp + 70000, id: "$3" });
const pollEnd3 = makePollEndEvent(pollStart3.getId()!, roomId, userId, timestamp + 1);
await setupRoomWithPollEvents([pollStart2, pollStart3, pollStart1], [], [pollEnd3], mockClient, room);
const { container, queryByText, getByTestId } = getComponent();
// flush relations calls for polls
await flushPromises();
expect(getByTestId("filter-tab-PollHistoryDialog_filter-ACTIVE").firstElementChild).toBeChecked();
expect(container).toMatchSnapshot();
// this poll is ended, and default filter is ACTIVE
expect(queryByText("What?")).not.toBeInTheDocument();
});
it("updates when new polls are added to the room", async () => {
const timestamp = 1675300825090;
const pollStart1 = makePollStartEvent("Question?", userId, undefined, { ts: timestamp, id: "$1" });
const pollStart2 = makePollStartEvent("Where?", userId, undefined, { ts: timestamp + 10000, id: "$2" });
// initially room has only one poll
await setupRoomWithPollEvents([pollStart1], [], [], mockClient, room);
const { getByText } = getComponent();
// wait for relations
await flushPromises();
expect(getByText("Question?")).toBeInTheDocument();
// add another poll
// paged history requests using cli.paginateEventTimeline
// call this with new events
await room.processPollEvents([pollStart2]);
// await relations for new poll
await flushPromises();
expect(getByText("Question?")).toBeInTheDocument();
// list updated to include new poll
expect(getByText("Where?")).toBeInTheDocument();
});
it("filters ended polls", async () => {
const pollStart1 = makePollStartEvent("Question?", userId, undefined, { ts: 1675300825090, id: "$1" });
const pollStart2 = makePollStartEvent("Where?", userId, undefined, { ts: 1675300725090, id: "$2" });
const pollStart3 = makePollStartEvent("What?", userId, undefined, { ts: 1675200725090, id: "$3" });
const pollEnd3 = makePollEndEvent(pollStart3.getId()!, roomId, userId, 1675200725090 + 1);
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
const { getByText, queryByText, getByTestId } = getComponent();
await flushPromises();
expect(getByText("Question?")).toBeInTheDocument();
expect(getByText("Where?")).toBeInTheDocument();
// this poll is ended, and default filter is ACTIVE
expect(queryByText("What?")).not.toBeInTheDocument();
fireEvent.click(getByText("Past polls"));
expect(getByTestId("filter-tab-PollHistoryDialog_filter-ENDED").firstElementChild).toBeChecked();
// active polls no longer shown
expect(queryByText("Question?")).not.toBeInTheDocument();
expect(queryByText("Where?")).not.toBeInTheDocument();
// this poll is ended
expect(getByText("What?")).toBeInTheDocument();
});
});