mirror of
https://github.com/vector-im/element-web.git
synced 2024-11-15 20:54:59 +08:00
Update timeline.spec.ts (#10540)
* timeline.spec.ts - deprecate custom commands of find.ts Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Iterate - clickButtonReply() - findByText() Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> --------- Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara
GitHub
parent
692c07ef0a
commit
65f605951f
@ -197,10 +197,10 @@ describe("Timeline", () => {
|
||||
|
||||
cy.get(".mx_GenericEventListSummary").within(() => {
|
||||
// Click "expand" link button
|
||||
cy.findButton("expand").click();
|
||||
cy.findByRole("button", { name: "expand" }).click();
|
||||
|
||||
// Assert that the "expand" link button worked
|
||||
cy.findButton("collapse").should("exist");
|
||||
cy.findByRole("button", { name: "collapse" }).should("exist");
|
||||
});
|
||||
|
||||
// Check the height of expanded GELS line
|
||||
@ -232,10 +232,10 @@ describe("Timeline", () => {
|
||||
|
||||
cy.get(".mx_GenericEventListSummary").within(() => {
|
||||
// Click "expand" link button
|
||||
cy.findButton("expand").click();
|
||||
cy.findByRole("button", { name: "expand" }).click();
|
||||
|
||||
// Assert that the "expand" link button worked
|
||||
cy.findButton("collapse").should("exist");
|
||||
cy.findByRole("button", { name: "collapse" }).should("exist");
|
||||
});
|
||||
|
||||
// Check the height of expanded GELS line
|
||||
@ -262,10 +262,10 @@ describe("Timeline", () => {
|
||||
|
||||
cy.get(".mx_GenericEventListSummary").within(() => {
|
||||
// Click "expand" link button
|
||||
cy.findButton("expand").click();
|
||||
cy.findByRole("button", { name: "expand" }).click();
|
||||
|
||||
// Assert that the "expand" link button worked
|
||||
cy.findButton("collapse").should("exist");
|
||||
cy.findByRole("button", { name: "collapse" }).should("exist");
|
||||
});
|
||||
|
||||
// Make sure spacer is not visible on bubble layout
|
||||
@ -283,11 +283,12 @@ describe("Timeline", () => {
|
||||
// Click "collapse" link button on the first hovered info event line
|
||||
cy.get(".mx_GenericEventListSummary_unstyledList .mx_EventTile_info:first-of-type")
|
||||
.realHover()
|
||||
.findButton("collapse")
|
||||
.click();
|
||||
.findByRole("toolbar", { name: "Message Actions" })
|
||||
.should("be.visible");
|
||||
cy.findByRole("button", { name: "collapse" }).click();
|
||||
|
||||
// Assert that "collapse" link button worked
|
||||
cy.findButton("expand").should("exist");
|
||||
cy.findByRole("button", { name: "expand" }).should("exist");
|
||||
});
|
||||
|
||||
// Save snapshot of collapsed generic event list summary on bubble layout
|
||||
@ -305,7 +306,7 @@ describe("Timeline", () => {
|
||||
).should("exist");
|
||||
|
||||
// Click "expand" link button
|
||||
cy.get(".mx_GenericEventListSummary").findButton("expand").click();
|
||||
cy.get(".mx_GenericEventListSummary").findByRole("button", { name: "expand" }).click();
|
||||
|
||||
// Check the event line has margin instead of inset property
|
||||
// cf. _EventTile.pcss
|
||||
@ -335,7 +336,7 @@ describe("Timeline", () => {
|
||||
cy.contains(".mx_RoomView_body .mx_EventTile .mx_EventTile_line", "Message")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("Edit").click();
|
||||
cy.findByRole("button", { name: "Edit" }).click();
|
||||
cy.get(".mx_BasicMessageComposer_input").type("Edit{enter}");
|
||||
});
|
||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "MessageEdit").should("exist");
|
||||
@ -394,7 +395,7 @@ describe("Timeline", () => {
|
||||
|
||||
// 2. Alignment of expanded GELS and messages
|
||||
// Click "expand" link button
|
||||
cy.get(".mx_GenericEventListSummary").findButton("expand").click();
|
||||
cy.get(".mx_GenericEventListSummary").findByRole("button", { name: "expand" }).click();
|
||||
// Check inline start spacing of info line on expanded GELS
|
||||
cy.get(".mx_EventTile[data-layout=irc].mx_EventTile_info:first-of-type .mx_EventTile_line")
|
||||
// See: _EventTile.pcss
|
||||
@ -408,12 +409,14 @@ describe("Timeline", () => {
|
||||
// Delete the second (last) message
|
||||
cy.get(".mx_RoomView_MessageList > .mx_EventTile_last")
|
||||
.realHover()
|
||||
.findButton("Options")
|
||||
.findByRole("button", { name: "Options" })
|
||||
.should("be.visible")
|
||||
.click();
|
||||
cy.findMenuitem("Remove").should("be.visible").click();
|
||||
cy.findByRole("menuitem", { name: "Remove" }).should("be.visible").click();
|
||||
// Confirm deletion
|
||||
cy.get(".mx_Dialog_buttons button[data-testid=dialog-primary-button]").findButton("Remove").click();
|
||||
cy.get(".mx_Dialog_buttons").within(() => {
|
||||
cy.findByRole("button", { name: "Remove" }).click();
|
||||
});
|
||||
// Make sure the dialog was closed and the second (last) message was redacted
|
||||
cy.get(".mx_Dialog").should("not.exist");
|
||||
cy.get(".mx_GenericEventListSummary .mx_EventTile_last .mx_RedactedBody").should("be.visible");
|
||||
@ -632,7 +635,7 @@ describe("Timeline", () => {
|
||||
.should("exist")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("toggle event").click("topLeft");
|
||||
cy.findByRole("button", { name: "toggle event" }).click("topLeft");
|
||||
});
|
||||
|
||||
// Make sure the expand toggle works
|
||||
@ -640,7 +643,7 @@ describe("Timeline", () => {
|
||||
.should("be.visible")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("toggle event")
|
||||
cy.findByRole("button", { name: "toggle event" })
|
||||
// Check size and position of toggle on expanded view source event
|
||||
// See: _ViewSourceEvent.pcss
|
||||
.should("have.css", "height", "12px") // --ViewSourceEvent_toggle-size
|
||||
@ -669,7 +672,7 @@ describe("Timeline", () => {
|
||||
.should("exist")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("toggle event").click("topLeft");
|
||||
cy.findByRole("button", { name: "toggle event" }).click("topLeft");
|
||||
});
|
||||
|
||||
// Make sure the expand toggle worked
|
||||
@ -681,7 +684,7 @@ describe("Timeline", () => {
|
||||
sendEvent(roomId, true);
|
||||
cy.visit("/#/room/" + roomId);
|
||||
|
||||
cy.get(".mx_RoomHeader").findButton("Search").click();
|
||||
cy.get(".mx_RoomHeader").findByRole("button", { name: "Search" }).click();
|
||||
cy.get(".mx_SearchBar_input input").type("Message{enter}");
|
||||
|
||||
cy.get(".mx_EventTile:not(.mx_EventTile_contextual) .mx_EventTile_searchHighlight").should("exist");
|
||||
@ -748,42 +751,54 @@ describe("Timeline", () => {
|
||||
cy.contains(".mx_RoomView_body .mx_EventTile_line", "Hello world")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("Reply").click();
|
||||
cy.findByRole("button", { name: "Reply" }).click();
|
||||
});
|
||||
};
|
||||
|
||||
// For clicking the reply button on the last line
|
||||
const clickButtonReply = () => {
|
||||
cy.get(".mx_RoomView_MessageList").within(() => {
|
||||
cy.get(".mx_EventTile_last").realHover().findByRole("button", { name: "Reply" }).click();
|
||||
});
|
||||
};
|
||||
|
||||
it("can reply with a text message", () => {
|
||||
viewRoomSendMessageAndSetupReply();
|
||||
|
||||
cy.getComposer().type(`${reply}{enter}`);
|
||||
|
||||
cy.get(".mx_RoomView_body .mx_EventTile .mx_EventTile_line .mx_ReplyTile .mx_MTextBody").should(
|
||||
"contain",
|
||||
MESSAGE,
|
||||
);
|
||||
cy.contains(".mx_RoomView_body .mx_EventTile > .mx_EventTile_line > .mx_MTextBody", reply).should(
|
||||
"have.length",
|
||||
1,
|
||||
);
|
||||
cy.get(".mx_RoomView_body").within(() => {
|
||||
cy.get(".mx_EventTile_last .mx_EventTile_line").within(() => {
|
||||
cy.get(".mx_ReplyTile .mx_MTextBody").within(() => {
|
||||
cy.findByText(MESSAGE).should("exist");
|
||||
});
|
||||
|
||||
cy.findByText(reply).should("have.length", 1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it("can reply with a voice message", () => {
|
||||
viewRoomSendMessageAndSetupReply();
|
||||
|
||||
cy.openMessageComposerOptions().within(() => {
|
||||
cy.findMenuitem("Voice Message").click();
|
||||
cy.findByRole("menuitem", { name: "Voice Message" }).click();
|
||||
});
|
||||
cy.wait(3000);
|
||||
cy.get(".mx_RoomView_body .mx_MessageComposer").findButton("Send voice message").click();
|
||||
|
||||
cy.get(".mx_RoomView_body .mx_EventTile .mx_EventTile_line .mx_ReplyTile .mx_MTextBody").should(
|
||||
"contain",
|
||||
MESSAGE,
|
||||
);
|
||||
cy.get(".mx_RoomView_body .mx_EventTile > .mx_EventTile_line > .mx_MVoiceMessageBody").should(
|
||||
"have.length",
|
||||
1,
|
||||
);
|
||||
// Record an empty message
|
||||
cy.wait(3000);
|
||||
|
||||
cy.get(".mx_RoomView_body").within(() => {
|
||||
cy.get(".mx_MessageComposer").findByRole("button", { name: "Send voice message" }).click();
|
||||
|
||||
cy.get(".mx_EventTile_last .mx_EventTile_line").within(() => {
|
||||
cy.get(".mx_ReplyTile .mx_MTextBody").within(() => {
|
||||
cy.findByText(MESSAGE).should("exist");
|
||||
});
|
||||
|
||||
cy.get(".mx_MVoiceMessageBody").should("have.length", 1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it("should not be possible to send flag with regional emojis", () => {
|
||||
@ -809,19 +824,6 @@ describe("Timeline", () => {
|
||||
let bot: MatrixClient;
|
||||
const reply2 = "Reply again";
|
||||
|
||||
// For clicking the reply button on the last line
|
||||
const clickButtonReply = () => {
|
||||
cy.get(".mx_RoomView_MessageList").within(() => {
|
||||
cy.get(".mx_EventTile_last")
|
||||
.realHover()
|
||||
.findButton("Options")
|
||||
.should("be.visible")
|
||||
.realHover()
|
||||
.findButton("Reply")
|
||||
.click();
|
||||
});
|
||||
};
|
||||
|
||||
cy.visit("/#/room/" + roomId);
|
||||
|
||||
// Wait until configuration is finished
|
||||
@ -849,19 +851,27 @@ describe("Timeline", () => {
|
||||
cy.botSendMessage(bot, roomId, MESSAGE);
|
||||
});
|
||||
|
||||
// Assert that MESSAGE is found
|
||||
cy.findByText(MESSAGE);
|
||||
|
||||
// Reply to the message
|
||||
clickButtonReply();
|
||||
cy.getComposer().type(`${reply}{enter}`);
|
||||
|
||||
// Make sure 'reply' was sent
|
||||
cy.contains(".mx_RoomView_MessageList .mx_EventTile_last", reply).should("exist");
|
||||
cy.get(".mx_RoomView_body .mx_EventTile_last").within(() => {
|
||||
cy.findByText(reply).should("exist");
|
||||
});
|
||||
|
||||
// Reply again to create a replyChain
|
||||
clickButtonReply();
|
||||
cy.getComposer().type(`${reply2}{enter}`);
|
||||
|
||||
// Assert that 'reply2' was sent
|
||||
cy.contains(".mx_RoomView_MessageList .mx_EventTile_last", reply2).should("exist");
|
||||
cy.get(".mx_RoomView_body .mx_EventTile_last").within(() => {
|
||||
cy.findByText(reply2).should("exist");
|
||||
});
|
||||
|
||||
cy.get(".mx_EventTile_last .mx_EventTile_receiptSent").should("be.visible");
|
||||
|
||||
// Exclude timestamp and read marker from snapshot
|
||||
@ -955,20 +965,21 @@ describe("Timeline", () => {
|
||||
});
|
||||
|
||||
// Wait until the message is rendered
|
||||
cy.get(".mx_EventTile_last .mx_MTextBody .mx_EventTile_body").should("have.text", LONG_STRING);
|
||||
cy.get(".mx_EventTile_last .mx_MTextBody .mx_EventTile_body").within(() => {
|
||||
cy.findByText(LONG_STRING);
|
||||
});
|
||||
|
||||
// Reply to the message
|
||||
cy.get(".mx_EventTile_last")
|
||||
.realHover()
|
||||
.within(() => {
|
||||
cy.findButton("Reply").click();
|
||||
});
|
||||
clickButtonReply();
|
||||
cy.getComposer().type(`${reply}{enter}`);
|
||||
|
||||
// Make sure the reply tile is rendered
|
||||
cy.get(".mx_EventTile_last").within(() => {
|
||||
cy.get(".mx_ReplyTile .mx_MTextBody").should("have.text", LONG_STRING);
|
||||
cy.get(".mx_EventTile_line > .mx_MTextBody").should("have.text", reply);
|
||||
cy.get(".mx_EventTile_last .mx_EventTile_line").within(() => {
|
||||
cy.get(".mx_ReplyTile .mx_MTextBody").within(() => {
|
||||
cy.findByText(LONG_STRING).should("exist");
|
||||
});
|
||||
|
||||
cy.findByText(reply).should("have.length", 1);
|
||||
});
|
||||
|
||||
// Change the viewport size
|
||||
|
||||
Loading…
Reference in New Issue
Block a user