Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 7b5d180

Browse files
authored
Update editing.spec.ts (#10543)
* Update editing.spec.ts - deprecate custom commands Signed-off-by: Suguru Hirahara <[email protected]> * Update editing.spec.ts - use findByRole textbox etc Signed-off-by: Suguru Hirahara <[email protected]> --------- Signed-off-by: Suguru Hirahara <[email protected]>
1 parent 96c62ea commit 7b5d180

File tree

1 file changed

+38
-22
lines changed

1 file changed

+38
-22
lines changed

cypress/e2e/editing/editing.spec.ts

Lines changed: 38 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ describe("Editing", () => {
4646

4747
// Edit "Message"
4848
const editLastMessage = (edit: string) => {
49-
cy.get(".mx_EventTile_last").realHover().findButton("Edit").click();
50-
cy.get(".mx_BasicMessageComposer_input").type(`{selectAll}{del}${edit}{enter}`);
49+
cy.get(".mx_EventTile_last").realHover().findByRole("button", { name: "Edit" }).click();
50+
cy.findByRole("textbox", { name: "Edit message" }).type(`{selectAll}{del}${edit}{enter}`);
5151
};
5252

5353
const clickEditedMessage = (edited: string) => {
@@ -62,7 +62,7 @@ describe("Editing", () => {
6262

6363
const clickButtonViewSource = () => {
6464
// Assert that "View Source" button is rendered and click it
65-
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findButton("View Source").click();
65+
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findByRole("button", { name: "View Source" }).click();
6666
};
6767

6868
beforeEach(() => {
@@ -84,7 +84,7 @@ describe("Editing", () => {
8484
it("should render and interact with the message edit history dialog", () => {
8585
// Click the "Remove" button on the message edit history dialog
8686
const clickButtonRemove = () => {
87-
cy.get(".mx_EventTile_line").realHover().findButton("Remove").click();
87+
cy.get(".mx_EventTile_line").realHover().findByRole("button", { name: "Remove" }).click();
8888
};
8989

9090
cy.visit("/#/room/" + roomId);
@@ -120,7 +120,9 @@ describe("Editing", () => {
120120

121121
// Assert that the date separator is rendered at the top
122122
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
123-
cy.get("h2").should("have.text", "Today");
123+
cy.get("h2").within(() => {
124+
cy.findByText("Today");
125+
});
124126
});
125127

126128
// Assert that the edited message is rendered under the date separator
@@ -130,14 +132,20 @@ describe("Editing", () => {
130132
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Meassage");
131133

132134
cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
133-
cy.get(".mx_EditHistoryMessage_deletion").should("have.text", "e");
134-
cy.get(".mx_EditHistoryMessage_insertion").should("have.text", "a");
135+
cy.get(".mx_EditHistoryMessage_deletion").within(() => {
136+
cy.findByText("e");
137+
});
138+
cy.get(".mx_EditHistoryMessage_insertion").within(() => {
139+
cy.findByText("a");
140+
});
135141
});
136142
});
137143

138144
// Assert that the original message is rendered at the bottom
139145
cy.get("li:nth-child(3) .mx_EventTile").within(() => {
140-
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Message");
146+
cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
147+
cy.findByText("Message");
148+
});
141149
});
142150
});
143151
});
@@ -169,20 +177,24 @@ describe("Editing", () => {
169177

170178
// This time remove the message really
171179
cy.get(".mx_TextInputDialog").within(() => {
172-
cy.get(".mx_TextInputDialog_input").type("This is a test."); // Reason
173-
cy.contains("[data-testid='dialog-primary-button']", "Remove").click();
180+
cy.findByRole("textbox", { name: "Reason (optional)" }).type("This is a test."); // Reason
181+
cy.findByRole("button", { name: "Remove" }).click();
174182
});
175183

176184
// Assert that the message edit history dialog is rendered again
177185
cy.get(".mx_MessageEditHistoryDialog").within(() => {
178186
// Assert that the date is rendered
179187
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
180-
cy.get("h2").should("have.text", "Today");
188+
cy.get("h2").within(() => {
189+
cy.findByText("Today");
190+
});
181191
});
182192

183193
// Assert that the original message is rendered under the date on the dialog
184194
cy.get("li:nth-child(2) .mx_EventTile").within(() => {
185-
cy.get(".mx_EventTile_content .mx_EventTile_body").should("have.text", "Message");
195+
cy.get(".mx_EventTile_content .mx_EventTile_body").within(() => {
196+
cy.findByText("Message");
197+
});
186198
});
187199

188200
// Assert that the edited message is gone
@@ -194,9 +206,9 @@ describe("Editing", () => {
194206

195207
// Assert that the main timeline is rendered
196208
cy.get(".mx_RoomView_MessageList").within(() => {
197-
cy.get(".mx_EventTile_last").within(() => {
209+
cy.get(".mx_EventTile_last .mx_RedactedBody").within(() => {
198210
// Assert that the placeholder is rendered
199-
cy.contains(".mx_RedactedBody", "Message deleted");
211+
cy.findByText("Message deleted");
200212
});
201213
});
202214
});
@@ -223,7 +235,7 @@ describe("Editing", () => {
223235
// Assert that "View Source" is not rendered
224236
cy.get(".mx_EventTile .mx_EventTile_line")
225237
.realHover()
226-
.contains(".mx_AccessibleButton", "View Source")
238+
.findByRole("button", { name: "View Source" })
227239
.should("not.exist");
228240
});
229241

@@ -241,7 +253,7 @@ describe("Editing", () => {
241253
// Assert that the edited message is rendered
242254
cy.get(".mx_MessageEditHistoryDialog li:nth-child(2)").within(() => {
243255
// Assert that "Remove" button for the original message is rendered
244-
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findButton("Remove");
256+
cy.get(".mx_EventTile .mx_EventTile_line").realHover().findByRole("button", { name: "Remove" });
245257

246258
clickButtonViewSource();
247259
});
@@ -254,7 +266,7 @@ describe("Editing", () => {
254266
// Assert that "Remove" button for the original message does not exist
255267
cy.get(".mx_EventTile .mx_EventTile_line")
256268
.realHover()
257-
.contains(".mx_AccessibleButton", "Remove")
269+
.findByRole("button", { name: "Remove" })
258270
.should("not.exist");
259271

260272
clickButtonViewSource();
@@ -271,16 +283,20 @@ describe("Editing", () => {
271283
sendEvent(roomId);
272284

273285
// Edit message
274-
cy.contains(".mx_RoomView_body .mx_EventTile", "Message").within(() => {
275-
cy.get(".mx_EventTile_line").realHover().findButton("Edit").click().checkA11y();
276-
cy.get(".mx_EventTile_line .mx_BasicMessageComposer_input")
286+
cy.get(".mx_RoomView_body .mx_EventTile").within(() => {
287+
cy.findByText("Message");
288+
cy.get(".mx_EventTile_line").realHover().findByRole("button", { name: "Edit" }).click().checkA11y();
289+
cy.get(".mx_EventTile_line")
290+
.findByRole("textbox", { name: "Edit message" })
277291
.type("Foo{backspace}{backspace}{backspace}{enter}")
278292
.checkA11y();
279293
});
280-
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Message");
294+
cy.get(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]").within(() => {
295+
cy.findByText("Message");
296+
});
281297

282298
// Assert that the edit composer has gone away
283-
cy.get(".mx_EditMessageComposer").should("not.exist");
299+
cy.findByRole("textbox", { name: "Edit message" }).should("not.exist");
284300
});
285301

286302
it("should correctly display events which are edited, where we lack the edit event", () => {

0 commit comments

Comments
 (0)