Poll history: detail screen (#10172)
* basic navigation to focused poll * add tooltip * drill permalinkCreator down to poll history * render poll tile and link to timeline * tidy and lint * unit test poll detail * add view poll link to ended pollliste item * strict fix * pr improvements * pass room as prop * permalinkcreator ts assertion
This commit is contained in:
Kerry
GitHub
parent
9b2b3ca42e
commit
f57495d3cd
21 changed files with 588 additions and 104 deletions
|
|
@ -31,6 +31,9 @@ import {
|
|||
setupRoomWithPollEvents,
|
||||
unmockIntlDateTimeFormat,
|
||||
} from "../../../../test-utils";
|
||||
import { RoomPermalinkCreator } from "../../../../../src/utils/permalinks/Permalinks";
|
||||
import defaultDispatcher from "../../../../../src/dispatcher/dispatcher";
|
||||
import { Action } from "../../../../../src/dispatcher/actions";
|
||||
|
||||
describe("<PollHistoryDialog />", () => {
|
||||
// 14.03.2022 16:15
|
||||
|
|
@ -57,8 +60,9 @@ describe("<PollHistoryDialog />", () => {
|
|||
});
|
||||
|
||||
const defaultProps = {
|
||||
roomId,
|
||||
room,
|
||||
matrixClient: mockClient,
|
||||
permalinkCreator: new RoomPermalinkCreator(room),
|
||||
onFinished: jest.fn(),
|
||||
};
|
||||
const getComponent = () => render(<PollHistoryDialog {...defaultProps} />);
|
||||
|
|
@ -70,9 +74,12 @@ describe("<PollHistoryDialog />", () => {
|
|||
beforeEach(() => {
|
||||
room = new Room(roomId, mockClient, userId);
|
||||
mockClient.getRoom.mockReturnValue(room);
|
||||
defaultProps.room = room;
|
||||
mockClient.relations.mockResolvedValue({ events: [] });
|
||||
const timeline = room.getLiveTimeline();
|
||||
jest.spyOn(timeline, "getEvents").mockReturnValue([]);
|
||||
jest.spyOn(defaultDispatcher, "dispatch").mockClear();
|
||||
defaultProps.onFinished.mockClear();
|
||||
jest.spyOn(room, "getOrCreateFilteredTimelineSet");
|
||||
mockClient.getOrCreateFilter.mockResolvedValue(expectedFilter.filterId!);
|
||||
mockClient.paginateEventTimeline.mockReset().mockResolvedValue(false);
|
||||
|
|
@ -314,4 +321,165 @@ describe("<PollHistoryDialog />", () => {
|
|||
// this poll is ended
|
||||
expect(getByText("What?")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
describe("Poll detail", () => {
|
||||
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, "$4");
|
||||
|
||||
it("displays poll detail on active poll list item click", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText, queryByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
expect(queryByText("Polls history")).not.toBeInTheDocument();
|
||||
// elements from MPollBody
|
||||
expect(getByText("Question?")).toMatchSnapshot();
|
||||
expect(getByText("Socks")).toBeInTheDocument();
|
||||
expect(getByText("Shoes")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("links to the poll start event from an active poll detail", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
// links to poll start event
|
||||
expect(getByText("View poll in timeline").getAttribute("href")).toBe(
|
||||
`https://matrix.to/#/!room:domain.org/${pollStart1.getId()!}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("navigates in app when clicking view in timeline button", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
const event = new MouseEvent("click", { bubbles: true, cancelable: true });
|
||||
jest.spyOn(event, "preventDefault");
|
||||
fireEvent(getByText("View poll in timeline"), event);
|
||||
|
||||
expect(event.preventDefault).toHaveBeenCalled();
|
||||
|
||||
expect(defaultDispatcher.dispatch).toHaveBeenCalledWith({
|
||||
action: Action.ViewRoom,
|
||||
event_id: pollStart1.getId()!,
|
||||
highlighted: true,
|
||||
metricsTrigger: undefined,
|
||||
room_id: pollStart1.getRoomId()!,
|
||||
});
|
||||
|
||||
// dialog closed
|
||||
expect(defaultProps.onFinished).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("doesnt navigate in app when view in timeline link is ctrl + clicked", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
const event = new MouseEvent("click", { bubbles: true, cancelable: true, ctrlKey: true });
|
||||
jest.spyOn(event, "preventDefault");
|
||||
fireEvent(getByText("View poll in timeline"), event);
|
||||
|
||||
expect(event.preventDefault).not.toHaveBeenCalled();
|
||||
expect(defaultDispatcher.dispatch).not.toHaveBeenCalled();
|
||||
expect(defaultProps.onFinished).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("navigates back to poll list from detail view on header click", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText, queryByText, getByTestId, container } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
// detail view
|
||||
expect(getByText("Question?")).toBeInTheDocument();
|
||||
|
||||
// header not shown
|
||||
expect(queryByText("Polls history")).not.toBeInTheDocument();
|
||||
|
||||
expect(getByText("Active polls")).toMatchSnapshot();
|
||||
fireEvent.click(getByText("Active polls"));
|
||||
|
||||
// main list header displayed again
|
||||
expect(getByText("Polls history")).toBeInTheDocument();
|
||||
// active filter still active
|
||||
expect(getByTestId("filter-tab-PollHistoryDialog_filter-ACTIVE").firstElementChild).toBeChecked();
|
||||
// list displayed
|
||||
expect(container.getElementsByClassName("mx_PollHistoryList_list").length).toBeTruthy();
|
||||
});
|
||||
|
||||
it("displays poll detail on past poll list item click", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Past polls"));
|
||||
|
||||
// pollStart3 is ended
|
||||
fireEvent.click(getByText("What?"));
|
||||
|
||||
expect(getByText("What?")).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("links to the poll end events from a ended poll detail", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Past polls"));
|
||||
|
||||
// pollStart3 is ended
|
||||
fireEvent.click(getByText("What?"));
|
||||
|
||||
// links to poll end event
|
||||
expect(getByText("View poll in timeline").getAttribute("href")).toBe(
|
||||
`https://matrix.to/#/!room:domain.org/${pollEnd3.getId()!}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("navigates back to poll list from detail view on header click", async () => {
|
||||
await setupRoomWithPollEvents([pollStart1, pollStart2, pollStart3], [], [pollEnd3], mockClient, room);
|
||||
|
||||
const { getByText, queryByText, getByTestId, container } = getComponent();
|
||||
await flushPromises();
|
||||
|
||||
fireEvent.click(getByText("Question?"));
|
||||
|
||||
// detail view
|
||||
expect(getByText("Question?")).toBeInTheDocument();
|
||||
|
||||
// header not shown
|
||||
expect(queryByText("Polls history")).not.toBeInTheDocument();
|
||||
|
||||
expect(getByText("Active polls")).toMatchSnapshot();
|
||||
fireEvent.click(getByText("Active polls"));
|
||||
|
||||
// main list header displayed again
|
||||
expect(getByText("Polls history")).toBeInTheDocument();
|
||||
// active filter still active
|
||||
expect(getByTestId("filter-tab-PollHistoryDialog_filter-ACTIVE").firstElementChild).toBeChecked();
|
||||
// list displayed
|
||||
expect(container.getElementsByClassName("mx_PollHistoryList_list").length).toBeTruthy();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue