imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix formatting

Browse source
This commit is contained in:
Tim Vahlbrock 2024-11-22 12:19:50 +01:00
parent d5bbe8e5b2
commit 51671e5670
No known key found for this signature in database
9 changed files with 96 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

11
playwright/e2e/polls/polls.spec.ts
View file

@ -64,9 +64,7 @@ test.describe("Polls", () => {
};
const getPollResultsDialogOption = (page: Page, optionText: string): Locator => {
return getPollResultsDialog(page)
.locator(".mx_AnswerEntry")
.filter({ hasText: optionText });
return getPollResultsDialog(page).locator(".mx_AnswerEntry").filter({ hasText: optionText });
};
const expectDetailedPollOptionVoteCount = async (
@ -290,7 +288,10 @@ test.describe("Polls", () => {
await expectPollOptionVoteCount(page, pollId, pollParams.options[2], 2);
// click the 'vote to see results' message
await page.locator(".mx_MPollBody_totalVotes").getByText("Based on 2 votes. Click here to see full results").click();
await page
.locator(".mx_MPollBody_totalVotes")
.getByText("Based on 2 votes. Click here to see full results")
.click();
// expect the detailed results to be shown
await expect(getPollResultsDialog(page)).toBeAttached();
@ -300,7 +301,7 @@ test.describe("Polls", () => {
const voterEntries = getPollResultsDialogOption(page, pollParams.options[2]).locator(".mx_VoterEntry");
expect((await voterEntries.all()).length).toBe(2);
expect(voterEntries.filter({ hasText: bot.credentials.displayName })).not.toBeNull();
expect(voterEntries.filter({hasText: user.displayName})).not.toBeNull();
expect(voterEntries.filter({ hasText: user.displayName })).not.toBeNull();
// close the dialog
await page.locator(".mx_Dialog").getByRole("button", { name: "Close" }).click();

2
res/css/components/views/dialogs/polls/_PollResultsDialog.pcss
View file

@ -10,7 +10,7 @@
.mx_AnswerEntry_Header_answerName {
font-weight: bolder;
flex-grow: 1
flex-grow: 1;
}
.mx_VoterEntry {

2
res/css/components/views/polls/_PollOption.pcss
View file

@ -40,7 +40,7 @@ Please see LICENSE files in the repository root for full details.
}
.mx_PollOption_facePile {
margin-right: $spacing-8
margin-right: $spacing-8;
}
.mx_PollOption_optionVoteCount {

47
src/components/views/dialogs/PollResultsDialog.tsx
View file

@ -29,43 +29,30 @@ export default function PollResultsDialog(props: IProps): JSX.Element {
onFinished={() => Modal.closeCurrentModal()}
className="mx_PollResultsDialog"
>
{
props.pollEvent.answers.map((answer) => {
const votes = props.votes.get(answer.id) || [];
if (votes.length === 0) return;
{props.pollEvent.answers.map((answer) => {
const votes = props.votes.get(answer.id) || [];
if (votes.length === 0) return;
return <AnswerEntry
key={answer.id}
answer={answer}
members={props.members}
votes={votes}
/>;
})
}
return <AnswerEntry key={answer.id} answer={answer} members={props.members} votes={votes} />;
})}
</BaseDialog>
);
}
function AnswerEntry(props: {
answer: PollAnswerSubevent;
members: RoomMember[];
votes: UserVote[];
}): JSX.Element {
function AnswerEntry(props: { answer: PollAnswerSubevent; members: RoomMember[]; votes: UserVote[] }): JSX.Element {
const { answer, members, votes } = props;
return (
<div key={answer.id} className="mx_AnswerEntry">
<div className="mx_AnswerEntry_Header">
<span className="mx_AnswerEntry_Header_answerName">{answer.text}</span>
<span className="mx_AnswerEntry_Header_voteCount">{_t("poll|result_dialog|count_of_votes", { count: votes.length })}</span>
<span className="mx_AnswerEntry_Header_voteCount">
{_t("poll|result_dialog|count_of_votes", { count: votes.length })}
</span>
</div>
{votes.length === 0 && <div>No one voted for this.</div>}
{votes.map((vote) => {
const member = members.find(m => m.userId === vote.sender);
if (member) return <VoterEntry
key={vote.sender}
vote={vote}
member={member}
/>;
const member = members.find((m) => m.userId === vote.sender);
if (member) return <VoterEntry key={vote.sender} vote={vote} member={member} />;
})}
</div>
);
@ -73,10 +60,12 @@ function AnswerEntry(props: {
function VoterEntry(props: { vote: UserVote; member: RoomMember }): JSX.Element {
const { vote, member } = props;
return <div key={vote.sender} className="mx_VoterEntry">
<div className="mx_VoterEntry_AvatarWrapper">
<MemberAvatar member={member} size="36px" aria-hidden="true" />
return (
<div key={vote.sender} className="mx_VoterEntry">
<div className="mx_VoterEntry_AvatarWrapper">
<MemberAvatar member={member} size="36px" aria-hidden="true" />
</div>
{member.name}
</div>
{member.name}
</div>;
);
}

6
src/components/views/messages/MPollBody.tsx
View file

@ -326,7 +326,7 @@ export default class MPollBody extends React.Component<IBodyProps, IState> {
) : null;
const showDetailedVotes = (): void => {
if(!showResults) return;
if (!showResults) return;
Modal.createDialog(PollResultsDialog, {
pollEvent,
@ -368,7 +368,9 @@ export default class MPollBody extends React.Component<IBodyProps, IState> {
})}
</div>
<div className="mx_MPollBody_totalVotes">
<span data-testid="totalVotes" onClick={() => showDetailedVotes()}>{totalText}</span>
<span data-testid="totalVotes" onClick={() => showDetailedVotes()}>
{totalText}
</span>
{isFetchingResponses && <Spinner w={16} h={16} />}
</div>
</div>

7
src/components/views/polls/PollOption.tsx
View file

@ -34,16 +34,15 @@ const PollOptionContent: React.FC<PollOptionContentProps> = ({ isWinner, answer,
<div className="mx_PollOption_content">
<div className="mx_PollOption_optionText">{answer.text}</div>
<div className="mx_PollOption_votesWrapper">
{displayVoteCount
&& members.length <= MAXIMUM_MEMBERS_FOR_FACE_PILE
&& <div className="mx_PollOption_facePile">
{displayVoteCount && members.length <= MAXIMUM_MEMBERS_FOR_FACE_PILE && (
<div className="mx_PollOption_facePile">
<FacePile
members={members.filter((m) => votes.some((v) => v.sender === m.userId))}
size="24px"
overflow={false}
/>
</div>
}
)}
<span className="mx_PollOption_optionVoteCount">
{isWinner && <TrophyIcon className="mx_PollOption_winnerIcon" />}
{votesText}

2
src/components/views/polls/pollHistory/PollListItemEnded.tsx
View file

@ -35,7 +35,7 @@ const getWinningAnswers = (poll: Poll, responseRelations: Relations): EndedPollS
const userVotes = collectUserVotes(allVotes(responseRelations));
const votes = countVotes(userVotes, poll.pollEvent);
const totalVoteCount = [...votes.values()].reduce((sum, vote) => sum + vote.length, 0);
const winCount = Math.max(...Array.from(votes.values()).map(v => v.length));
const winCount = Math.max(...Array.from(votes.values()).map((v) => v.length));
return {
totalVoteCount,

83
test/unit-tests/components/views/messages/MPollBody-test.tsx
View file

@ -16,7 +16,7 @@ import {
MatrixEvent,
PollAnswer,
PollStartEventContent,
Relations
Relations,
} from "matrix-js-sdk/src/matrix";
import React from "react";
@ -101,7 +101,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("1 vote");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 4 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 4 votes. Click here to see full results",
);
});
it("ignores end poll events from unauthorised users", async () => {
@ -120,7 +122,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("1 vote");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 4 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 4 votes. Click here to see full results",
);
});
it("hides scores if I have not voted", async () => {
@ -161,7 +165,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("1 vote");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 2 votes. Click here to see full results",
);
});
it("uses my local vote", async () => {
@ -182,7 +188,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "italian")).toBe("1 vote");
expect(votesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 4 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 4 votes. Click here to see full results",
);
});
it("overrides my other votes with my local vote", async () => {
@ -204,7 +212,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "italian")).toBe("1 vote");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 2 votes. Click here to see full results",
);
// And my vote is highlighted
expect(voteButton(renderResult, "wings").className.includes(CHECKED)).toBe(true);
@ -236,7 +246,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 1 vote. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 1 vote. Click here to see full results",
);
});
it("doesn't cancel my local vote if someone else votes", async () => {
@ -268,7 +280,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 2 votes. Click here to see full results",
);
// And my vote is highlighted
expect(voteButton(renderResult, "pizza").className.includes(CHECKED)).toBe(true);
@ -295,7 +309,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("0 votes");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 2 votes. Click here to see full results",
);
});
it("allows un-voting by passing an empty vote", async () => {
@ -309,7 +325,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("0 votes");
expect(votesCount(renderResult, "italian")).toBe("1 vote");
expect(votesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 1 vote. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 1 vote. Click here to see full results",
);
});
it("allows re-voting after un-voting", async () => {
@ -324,7 +342,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("0 votes");
expect(votesCount(renderResult, "italian")).toBe("2 votes");
expect(votesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 2 votes. Click here to see full results",
);
});
it("treats any invalid answer as a spoiled ballot", async () => {
@ -342,7 +362,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("0 votes");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 0 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 0 votes. Click here to see full results",
);
});
it("allows re-voting after a spoiled ballot", async () => {
@ -359,7 +381,9 @@ describe("MPollBody", () => {
expect(votesCount(renderResult, "poutine")).toBe("1 vote");
expect(votesCount(renderResult, "italian")).toBe("0 votes");
expect(votesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Based on 1 vote. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Based on 1 vote. Click here to see full results",
);
});
it("renders nothing if poll has no answers", async () => {
@ -427,7 +451,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe("1 vote");
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe("1 vote");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 5 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 5 votes. Click here to see full results",
);
});
it("sends a vote event when I choose an option", async () => {
@ -528,7 +554,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe('<div class="mx_PollOption_winnerIcon"></div>1 vote');
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe('<div class="mx_PollOption_winnerIcon"></div>1 vote');
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 2 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 2 votes. Click here to see full results",
);
});
it("counts a single vote as normal if the poll is ended", async () => {
@ -539,7 +567,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe('<div class="mx_PollOption_winnerIcon"></div>1 vote');
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe("0 votes");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 1 vote. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 1 vote. Click here to see full results",
);
});
it("shows ended vote counts of different numbers", async () => {
@ -559,7 +589,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe("0 votes");
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe('<div class="mx_PollOption_winnerIcon"></div>3 votes');
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 5 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 5 votes. Click here to see full results",
);
});
it("ignores votes that arrived after poll ended", async () => {
@ -579,7 +611,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe("0 votes");
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe('<div class="mx_PollOption_winnerIcon"></div>3 votes');
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 5 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 5 votes. Click here to see full results",
);
});
it("counts votes that arrived after an unauthorised poll end event", async () => {
@ -602,7 +636,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe("0 votes");
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe('<div class="mx_PollOption_winnerIcon"></div>3 votes');
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 5 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 5 votes. Click here to see full results",
);
});
it("ignores votes that arrived after the first end poll event", async () => {
@ -629,7 +665,9 @@ describe("MPollBody", () => {
expect(endedVotesCount(renderResult, "poutine")).toBe("0 votes");
expect(endedVotesCount(renderResult, "italian")).toBe("0 votes");
expect(endedVotesCount(renderResult, "wings")).toBe('<div class="mx_PollOption_winnerIcon"></div>3 votes');
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe("Final result based on 5 votes. Click here to see full results");
expect(renderResult.getByTestId("totalVotes").innerHTML).toBe(
"Final result based on 5 votes. Click here to see full results",
);
});
it("highlights the winning vote in an ended poll", async () => {
@ -878,10 +916,7 @@ describe("MPollBody", () => {
fireEvent.click(renderResult.getByTestId("totalVotes"));
expect(createDialogSpy).toHaveBeenCalledWith(
PollResultsDialog,
expect.anything()
);
expect(createDialogSpy).toHaveBeenCalledWith(PollResultsDialog, expect.anything());
});
});

4
test/unit-tests/components/views/messages/MPollEndBody-test.tsx
View file

@ -132,7 +132,9 @@ describe("<MPollEndBody />", () => {
// quick check for poll tile
expect(getByTestId("pollQuestion").innerHTML).toEqual("Question?");
expect(getByTestId("totalVotes").innerHTML).toEqual("Final result based on 0 votes. Click here to see full results");
expect(getByTestId("totalVotes").innerHTML).toEqual(
"Final result based on 0 votes. Click here to see full results",
);
});
it("does not render a poll tile when end event is invalid", async () => {