Update `editing.spec.ts` (#10543)

* Update editing.spec.ts - deprecate custom commands

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Update editing.spec.ts - use findByRole textbox etc

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

---------

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
pull/28217/head
Suguru Hirahara 2023-04-11 08:22:45 +00:00 committed by GitHub
parent 96c62ea03d
commit 7b5d1802b1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 38 additions and 22 deletions

View File

@ -46,8 +46,8 @@ describe("Editing", () => {
// Edit "Message" // Edit "Message"
const editLastMessage = (edit: string) => { const editLastMessage = (edit: string) => {
cy.get(".mx_EventTile_last").realHover().findButton("Edit").click(); cy.get(".mx_EventTile_last").realHover().findByRole("button", { name: "Edit" }).click();
cy.get(".mx_BasicMessageComposer_input").type(`{selectAll}{del}${edit}{enter}`); cy.findByRole("textbox", { name: "Edit message" }).type(`{selectAll}{del}${edit}{enter}`);
}; };
const clickEditedMessage = (edited: string) => { const clickEditedMessage = (edited: string) => {
@ -62,7 +62,7 @@ describe("Editing", () => {
const clickButtonViewSource = () => { const clickButtonViewSource = () => {
// Assert that "View Source" button is rendered and click it // Assert that "View Source" button is rendered and click it
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findButton("View Source").click(); cy.get(".mx_EventTile .mx_EventTile_line").realHover().findByRole("button", { name: "View Source" }).click();
}; };
beforeEach(() => { beforeEach(() => {
@ -84,7 +84,7 @@ describe("Editing", () => {
it("should render and interact with the message edit history dialog", () => { it("should render and interact with the message edit history dialog", () => {
// Click the "Remove" button on the message edit history dialog // Click the "Remove" button on the message edit history dialog
const clickButtonRemove = () => { const clickButtonRemove = () => {
cy.get(".mx_EventTile_line").realHover().findButton("Remove").click(); cy.get(".mx_EventTile_line").realHover().findByRole("button", { name: "Remove" }).click();
}; };
cy.visit("/#/room/" + roomId); cy.visit("/#/room/" + roomId);
@ -120,7 +120,9 @@ describe("Editing", () => {
// Assert that the date separator is rendered at the top // Assert that the date separator is rendered at the top
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => { cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
cy.get("h2").should("have.text", "Today"); cy.get("h2").within(() => {
cy.findByText("Today");
});
}); });
// Assert that the edited message is rendered under the date separator // Assert that the edited message is rendered under the date separator
@ -130,14 +132,20 @@ describe("Editing", () => {
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Meassage"); cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Meassage");
cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => { cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
cy.get(".mx_EditHistoryMessage_deletion").should("have.text", "e"); cy.get(".mx_EditHistoryMessage_deletion").within(() => {
cy.get(".mx_EditHistoryMessage_insertion").should("have.text", "a"); cy.findByText("e");
});
cy.get(".mx_EditHistoryMessage_insertion").within(() => {
cy.findByText("a");
});
}); });
}); });
// Assert that the original message is rendered at the bottom // Assert that the original message is rendered at the bottom
cy.get("li:nth-child(3) .mx_EventTile").within(() => { cy.get("li:nth-child(3) .mx_EventTile").within(() => {
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Message"); cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
cy.findByText("Message");
});
}); });
}); });
}); });
@ -169,20 +177,24 @@ describe("Editing", () => {
// This time remove the message really // This time remove the message really
cy.get(".mx_TextInputDialog").within(() => { cy.get(".mx_TextInputDialog").within(() => {
cy.get(".mx_TextInputDialog_input").type("This is a test."); // Reason cy.findByRole("textbox", { name: "Reason (optional)" }).type("This is a test."); // Reason
cy.contains("[data-testid='dialog-primary-button']", "Remove").click(); cy.findByRole("button", { name: "Remove" }).click();
}); });
// Assert that the message edit history dialog is rendered again // Assert that the message edit history dialog is rendered again
cy.get(".mx_MessageEditHistoryDialog").within(() => { cy.get(".mx_MessageEditHistoryDialog").within(() => {
// Assert that the date is rendered // Assert that the date is rendered
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => { cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
cy.get("h2").should("have.text", "Today"); cy.get("h2").within(() => {
cy.findByText("Today");
});
}); });
// Assert that the original message is rendered under the date on the dialog // Assert that the original message is rendered under the date on the dialog
cy.get("li:nth-child(2) .mx_EventTile").within(() => { cy.get("li:nth-child(2) .mx_EventTile").within(() => {
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Message"); cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
cy.findByText("Message");
});
}); });
// Assert that the edited message is gone // Assert that the edited message is gone
@ -194,9 +206,9 @@ describe("Editing", () => {
// Assert that the main timeline is rendered // Assert that the main timeline is rendered
cy.get(".mx_RoomView_MessageList").within(() => { cy.get(".mx_RoomView_MessageList").within(() => {
cy.get(".mx_EventTile_last").within(() => { cy.get(".mx_EventTile_last .mx_RedactedBody").within(() => {
// Assert that the placeholder is rendered // Assert that the placeholder is rendered
cy.contains(".mx_RedactedBody", "Message deleted"); cy.findByText("Message deleted");
}); });
}); });
}); });
@ -223,7 +235,7 @@ describe("Editing", () => {
// Assert that "View Source" is not rendered // Assert that "View Source" is not rendered
cy.get(".mx_EventTile .mx_EventTile_line") cy.get(".mx_EventTile .mx_EventTile_line")
.realHover() .realHover()
.contains(".mx_AccessibleButton", "View Source") .findByRole("button", { name: "View Source" })
.should("not.exist"); .should("not.exist");
}); });
@ -241,7 +253,7 @@ describe("Editing", () => {
// Assert that the edited message is rendered // Assert that the edited message is rendered
cy.get(".mx_MessageEditHistoryDialog li:nth-child(2)").within(() => { cy.get(".mx_MessageEditHistoryDialog li:nth-child(2)").within(() => {
// Assert that "Remove" button for the original message is rendered // Assert that "Remove" button for the original message is rendered
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findButton("Remove"); cy.get(".mx_EventTile .mx_EventTile_line").realHover().findByRole("button", { name: "Remove" });
clickButtonViewSource(); clickButtonViewSource();
}); });
@ -254,7 +266,7 @@ describe("Editing", () => {
// Assert that "Remove" button for the original message does not exist // Assert that "Remove" button for the original message does not exist
cy.get(".mx_EventTile .mx_EventTile_line") cy.get(".mx_EventTile .mx_EventTile_line")
.realHover() .realHover()
.contains(".mx_AccessibleButton", "Remove") .findByRole("button", { name: "Remove" })
.should("not.exist"); .should("not.exist");
clickButtonViewSource(); clickButtonViewSource();
@ -271,16 +283,20 @@ describe("Editing", () => {
sendEvent(roomId); sendEvent(roomId);
// Edit message // Edit message
cy.contains(".mx_RoomView_body .mx_EventTile", "Message").within(() => { cy.get(".mx_RoomView_body .mx_EventTile").within(() => {
cy.get(".mx_EventTile_line").realHover().findButton("Edit").click().checkA11y(); cy.findByText("Message");
cy.get(".mx_EventTile_line .mx_BasicMessageComposer_input") cy.get(".mx_EventTile_line").realHover().findByRole("button", { name: "Edit" }).click().checkA11y();
cy.get(".mx_EventTile_line")
.findByRole("textbox", { name: "Edit message" })
.type("Foo{backspace}{backspace}{backspace}{enter}") .type("Foo{backspace}{backspace}{backspace}{enter}")
.checkA11y(); .checkA11y();
}); });
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Message"); cy.get(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]").within(() => {
cy.findByText("Message");
});
// Assert that the edit composer has gone away // Assert that the edit composer has gone away
cy.get(".mx_EditMessageComposer").should("not.exist"); cy.findByRole("textbox", { name: "Edit message" }).should("not.exist");
}); });
it("should correctly display events which are edited, where we lack the edit event", () => { it("should correctly display events which are edited, where we lack the edit event", () => {