mirror of
https://github.com/element-hq/element-web
synced 2024-11-22 17:25:50 +03:00
Update threads.spec.ts
- use Cypress Testing Library (#10680)
* Set within() Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Use findByRole("textbox") Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Use findByText() Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Apply findByRole() to reaction and emoji picker Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Use findByText() and findByRole() for removing a message Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Apply findByRole() to the close button Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Replace other commands 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:
parent
05ef1d5560
commit
259b5fe253
1 changed files with 142 additions and 112 deletions
|
@ -71,20 +71,22 @@ describe("Threads", () => {
|
||||||
// Exclude timestamp and read marker from snapshots
|
// Exclude timestamp and read marker from snapshots
|
||||||
const percyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
|
const percyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
|
||||||
|
|
||||||
|
cy.get(".mx_RoomView_body").within(() => {
|
||||||
// User sends message
|
// User sends message
|
||||||
cy.get(".mx_RoomView_body .mx_BasicMessageComposer_input").type("Hello Mr. Bot{enter}");
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Hello Mr. Bot{enter}");
|
||||||
|
|
||||||
// Check the colour of timestamp on the main timeline
|
// Check the colour of timestamp on the main timeline
|
||||||
cy.get(".mx_RoomView_body .mx_EventTile_last .mx_EventTile_line .mx_MessageTimestamp").should(
|
cy.get(".mx_EventTile_last .mx_EventTile_line .mx_MessageTimestamp").should(
|
||||||
"have.css",
|
"have.css",
|
||||||
"color",
|
"color",
|
||||||
MessageTimestampColor,
|
MessageTimestampColor,
|
||||||
);
|
);
|
||||||
|
|
||||||
// Wait for message to send, get its ID and save as @threadId
|
// Wait for message to send, get its ID and save as @threadId
|
||||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
cy.contains(".mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
||||||
.invoke("attr", "data-scroll-tokens")
|
.invoke("attr", "data-scroll-tokens")
|
||||||
.as("threadId");
|
.as("threadId");
|
||||||
|
});
|
||||||
|
|
||||||
// Bot starts thread
|
// Bot starts thread
|
||||||
cy.get<string>("@threadId").then((threadId) => {
|
cy.get<string>("@threadId").then((threadId) => {
|
||||||
|
@ -96,15 +98,16 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// User asserts timeline thread summary visible & clicks it
|
// User asserts timeline thread summary visible & clicks it
|
||||||
cy.get(".mx_RoomView_body").within(() => {
|
cy.get(".mx_RoomView_body .mx_ThreadSummary")
|
||||||
cy.get(".mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "BotBob");
|
.within(() => {
|
||||||
cy.get(".mx_ThreadSummary .mx_ThreadSummary_content").should("contain", "Hello there");
|
cy.get(".mx_ThreadSummary_sender").findByText("BotBob").should("exist");
|
||||||
cy.get(".mx_ThreadSummary").click();
|
cy.get(".mx_ThreadSummary_content").findByText(MessageLong).should("exist");
|
||||||
});
|
})
|
||||||
|
.click();
|
||||||
|
|
||||||
// Wait until the both messages are read
|
// Wait until the both messages are read
|
||||||
cy.get(".mx_ThreadView .mx_EventTile_last[data-layout=group]").within(() => {
|
cy.get(".mx_ThreadView .mx_EventTile_last[data-layout=group]").within(() => {
|
||||||
cy.get(".mx_EventTile_line .mx_MTextBody").should("have.text", MessageLong);
|
cy.get(".mx_EventTile_line .mx_MTextBody").findByText(MessageLong).should("exist");
|
||||||
cy.get(".mx_ReadReceiptGroup .mx_BaseAvatar_image").should("be.visible");
|
cy.get(".mx_ReadReceiptGroup .mx_BaseAvatar_image").should("be.visible");
|
||||||
|
|
||||||
// Make sure the CSS style for spacing is applied to mx_EventTile_line on group/modern layout
|
// Make sure the CSS style for spacing is applied to mx_EventTile_line on group/modern layout
|
||||||
|
@ -122,7 +125,7 @@ describe("Threads", () => {
|
||||||
|
|
||||||
cy.get(".mx_ThreadView .mx_EventTile[data-layout='group'].mx_EventTile_last").within(() => {
|
cy.get(".mx_ThreadView .mx_EventTile[data-layout='group'].mx_EventTile_last").within(() => {
|
||||||
// Wait until the messages are rendered
|
// Wait until the messages are rendered
|
||||||
cy.get(".mx_EventTile_line .mx_MTextBody").should("have.text", MessageLong);
|
cy.get(".mx_EventTile_line .mx_MTextBody").findByText(MessageLong).should("exist");
|
||||||
|
|
||||||
// Make sure the avatar inside ReadReceiptGroup is visible on the group layout
|
// Make sure the avatar inside ReadReceiptGroup is visible on the group layout
|
||||||
cy.get(".mx_ReadReceiptGroup .mx_BaseAvatar_image").should("be.visible");
|
cy.get(".mx_ReadReceiptGroup .mx_BaseAvatar_image").should("be.visible");
|
||||||
|
@ -145,20 +148,22 @@ describe("Threads", () => {
|
||||||
// Re-enable the group layout
|
// Re-enable the group layout
|
||||||
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.Group);
|
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.Group);
|
||||||
|
|
||||||
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
// User responds in thread
|
// User responds in thread
|
||||||
cy.get(".mx_ThreadView .mx_BasicMessageComposer_input").type("Test{enter}");
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Test{enter}");
|
||||||
|
|
||||||
// Check the colour of timestamp on EventTile in a thread (mx_ThreadView)
|
// Check the colour of timestamp on EventTile in a thread (mx_ThreadView)
|
||||||
cy.get(".mx_ThreadView .mx_EventTile_last[data-layout='group'] .mx_EventTile_line .mx_MessageTimestamp").should(
|
cy.get(".mx_EventTile_last[data-layout='group'] .mx_EventTile_line .mx_MessageTimestamp").should(
|
||||||
"have.css",
|
"have.css",
|
||||||
"color",
|
"color",
|
||||||
MessageTimestampColor,
|
MessageTimestampColor,
|
||||||
);
|
);
|
||||||
|
});
|
||||||
|
|
||||||
// User asserts summary was updated correctly
|
// User asserts summary was updated correctly
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
cy.get(".mx_ThreadSummary_sender").should("contain", "Tom");
|
cy.get(".mx_ThreadSummary_sender").findByText("Tom").should("exist");
|
||||||
cy.get(".mx_ThreadSummary_content").should("contain", "Test");
|
cy.get(".mx_ThreadSummary_content").findByText("Test").should("exist");
|
||||||
});
|
});
|
||||||
|
|
||||||
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
|
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
|
||||||
|
@ -169,12 +174,17 @@ describe("Threads", () => {
|
||||||
cy.setSettingValue("showHiddenEventsInTimeline", null, SettingLevel.DEVICE, true);
|
cy.setSettingValue("showHiddenEventsInTimeline", null, SettingLevel.DEVICE, true);
|
||||||
|
|
||||||
// User reacts to message instead
|
// User reacts to message instead
|
||||||
cy.contains(".mx_ThreadView .mx_EventTile .mx_EventTile_line", "Hello there")
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
.find('[aria-label="React"]')
|
cy.contains(".mx_EventTile .mx_EventTile_line", "Hello there")
|
||||||
.click({ force: true }); // Cypress has no ability to hover
|
.realHover()
|
||||||
|
.findByRole("toolbar", { name: "Message Actions" })
|
||||||
|
.findByRole("button", { name: "React" })
|
||||||
|
.click();
|
||||||
|
});
|
||||||
|
|
||||||
cy.get(".mx_EmojiPicker").within(() => {
|
cy.get(".mx_EmojiPicker").within(() => {
|
||||||
cy.get('input[type="text"]').type("wave");
|
cy.findByRole("textbox").type("wave");
|
||||||
cy.contains('[role="gridcell"]', "👋").click();
|
cy.findByRole("gridcell", { name: "👋" }).click();
|
||||||
});
|
});
|
||||||
|
|
||||||
cy.get(".mx_ThreadView").within(() => {
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
|
@ -231,17 +241,20 @@ describe("Threads", () => {
|
||||||
|
|
||||||
// User redacts their prior response
|
// User redacts their prior response
|
||||||
cy.contains(".mx_ThreadView .mx_EventTile .mx_EventTile_line", "Test")
|
cy.contains(".mx_ThreadView .mx_EventTile .mx_EventTile_line", "Test")
|
||||||
.find('[aria-label="Options"]')
|
.realHover()
|
||||||
.click({ force: true }); // Cypress has no ability to hover
|
.findByRole("button", { name: "Options" })
|
||||||
|
.click();
|
||||||
cy.get(".mx_IconizedContextMenu").within(() => {
|
cy.get(".mx_IconizedContextMenu").within(() => {
|
||||||
cy.contains('[role="menuitem"]', "Remove").click();
|
cy.findByRole("menuitem", { name: "Remove" }).click();
|
||||||
});
|
});
|
||||||
cy.get(".mx_TextInputDialog").within(() => {
|
cy.get(".mx_TextInputDialog").within(() => {
|
||||||
cy.contains(".mx_Dialog_primary", "Remove").click();
|
cy.findByRole("button", { name: "Remove" }).should("have.class", "mx_Dialog_primary").click();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
// Wait until the response is redacted
|
// Wait until the response is redacted
|
||||||
cy.get(".mx_ThreadView .mx_EventTile_last .mx_EventTile_receiptSent").should("be.visible");
|
cy.get(".mx_EventTile_last .mx_EventTile_receiptSent").should("be.visible");
|
||||||
|
});
|
||||||
|
|
||||||
// Take Percy snapshots in group layout and bubble layout (IRC layout is not available on ThreadView)
|
// Take Percy snapshots in group layout and bubble layout (IRC layout is not available on ThreadView)
|
||||||
cy.get(".mx_ThreadView .mx_EventTile[data-layout='group']").should("be.visible");
|
cy.get(".mx_ThreadView .mx_EventTile[data-layout='group']").should("be.visible");
|
||||||
|
@ -258,12 +271,16 @@ describe("Threads", () => {
|
||||||
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.Group);
|
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.Group);
|
||||||
|
|
||||||
// User asserts summary was updated correctly
|
// User asserts summary was updated correctly
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "BotBob");
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should("contain", "Hello there");
|
cy.get(".mx_ThreadSummary_sender").findByText("BotBob").should("exist");
|
||||||
|
cy.get(".mx_ThreadSummary_content").findByText(MessageLong).should("exist");
|
||||||
|
});
|
||||||
|
|
||||||
// User closes right panel after clicking back to thread list
|
// User closes right panel after clicking back to thread list
|
||||||
cy.get(".mx_ThreadView .mx_BaseCard_back").click();
|
cy.get(".mx_ThreadPanel").within(() => {
|
||||||
cy.get(".mx_ThreadPanel .mx_BaseCard_close").click();
|
cy.findByRole("button", { name: "Threads" }).click();
|
||||||
|
cy.findByRole("button", { name: "Close" }).click();
|
||||||
|
});
|
||||||
|
|
||||||
// Bot responds to thread
|
// Bot responds to thread
|
||||||
cy.get<string>("@threadId").then((threadId) => {
|
cy.get<string>("@threadId").then((threadId) => {
|
||||||
|
@ -273,21 +290,22 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "BotBob");
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should("contain", "How are things?");
|
cy.get(".mx_ThreadSummary_sender").findByText("BotBob").should("exist");
|
||||||
// User asserts thread list unread indicator
|
cy.get(".mx_ThreadSummary_content").findByText("How are things?").should("exist");
|
||||||
cy.get('.mx_HeaderButtons [aria-label="Threads"]').should("have.class", "mx_RightPanel_headerButton_unread");
|
});
|
||||||
|
|
||||||
// User opens thread list
|
cy.findByRole("tab", { name: "Threads" })
|
||||||
cy.get('.mx_HeaderButtons [aria-label="Threads"]').click();
|
.should("have.class", "mx_RightPanel_headerButton_unread") // User asserts thread list unread indicator
|
||||||
|
.click(); // User opens thread list
|
||||||
|
|
||||||
// User asserts thread with correct root & latest events & unread dot
|
// User asserts thread with correct root & latest events & unread dot
|
||||||
cy.get(".mx_ThreadPanel .mx_EventTile_last").within(() => {
|
cy.get(".mx_ThreadPanel .mx_EventTile_last").within(() => {
|
||||||
cy.get(".mx_EventTile_body").should("contain", "Hello Mr. Bot");
|
cy.get(".mx_EventTile_body").findByText("Hello Mr. Bot").should("exist");
|
||||||
cy.get(".mx_ThreadSummary_content").should("contain", "How are things?");
|
cy.get(".mx_ThreadSummary_content").findByText("How are things?").should("exist");
|
||||||
|
|
||||||
// Check the number of the replies
|
// Check the number of the replies
|
||||||
cy.get(".mx_ThreadPanel_replies_amount").should("have.text", "2");
|
cy.get(".mx_ThreadPanel_replies_amount").findByText("2").should("exist");
|
||||||
|
|
||||||
// Check the colour of timestamp on thread list
|
// Check the colour of timestamp on thread list
|
||||||
cy.get(".mx_EventTile_details .mx_MessageTimestamp").should("have.css", "color", MessageTimestampColor);
|
cy.get(".mx_EventTile_details .mx_MessageTimestamp").should("have.css", "color", MessageTimestampColor);
|
||||||
|
@ -300,23 +318,29 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// User responds & asserts
|
// User responds & asserts
|
||||||
cy.get(".mx_ThreadView .mx_BasicMessageComposer_input").type("Great!{enter}");
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "Tom");
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Great!{enter}");
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should("contain", "Great!");
|
});
|
||||||
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
|
cy.get(".mx_ThreadSummary_sender").findByText("Tom").should("exist");
|
||||||
|
cy.get(".mx_ThreadSummary_content").findByText("Great!").should("exist");
|
||||||
|
});
|
||||||
|
|
||||||
// User edits & asserts
|
// User edits & asserts
|
||||||
cy.contains(".mx_ThreadView .mx_EventTile_last .mx_EventTile_line", "Great!").within(() => {
|
cy.get(".mx_ThreadView .mx_EventTile_last").within(() => {
|
||||||
cy.get('[aria-label="Edit"]').click({ force: true }); // Cypress has no ability to hover
|
cy.findByText("Great!").should("exist");
|
||||||
cy.get(".mx_BasicMessageComposer_input").type(" How about yourself?{enter}");
|
cy.get(".mx_EventTile_line").realHover().findByRole("button", { name: "Edit" }).click();
|
||||||
|
cy.findByRole("textbox").type(" How about yourself?{enter}");
|
||||||
|
});
|
||||||
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
|
cy.get(".mx_ThreadSummary_sender").findByText("Tom").should("exist");
|
||||||
|
cy.get(".mx_ThreadSummary_content").findByText("Great! How about yourself?").should("exist");
|
||||||
});
|
});
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "Tom");
|
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should(
|
|
||||||
"contain",
|
|
||||||
"Great! How about yourself?",
|
|
||||||
);
|
|
||||||
|
|
||||||
// User closes right panel
|
// User closes right panel
|
||||||
cy.get(".mx_ThreadView .mx_BaseCard_close").click();
|
cy.get(".mx_ThreadPanel").within(() => {
|
||||||
|
cy.findByRole("button", { name: "Close" }).click();
|
||||||
|
});
|
||||||
|
|
||||||
// Bot responds to thread and saves the id of their message to @eventId
|
// Bot responds to thread and saves the id of their message to @eventId
|
||||||
cy.get<string>("@threadId").then((threadId) => {
|
cy.get<string>("@threadId").then((threadId) => {
|
||||||
|
@ -331,11 +355,10 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// User asserts
|
// User asserts
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "BotBob");
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should(
|
cy.get(".mx_ThreadSummary_sender").findByText("BotBob").should("exist");
|
||||||
"contain",
|
cy.get(".mx_ThreadSummary_content").findByText("I'm very good thanks").should("exist");
|
||||||
"I'm very good thanks",
|
});
|
||||||
);
|
|
||||||
|
|
||||||
// Bot edits their latest event
|
// Bot edits their latest event
|
||||||
cy.get<string>("@eventId").then((eventId) => {
|
cy.get<string>("@eventId").then((eventId) => {
|
||||||
|
@ -354,11 +377,10 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// User asserts
|
// User asserts
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_sender").should("contain", "BotBob");
|
cy.get(".mx_RoomView_body .mx_ThreadSummary").within(() => {
|
||||||
cy.get(".mx_RoomView_body .mx_ThreadSummary .mx_ThreadSummary_content").should(
|
cy.get(".mx_ThreadSummary_sender").findByText("BotBob").should("exist");
|
||||||
"contain",
|
cy.get(".mx_ThreadSummary_content").findByText("I'm very good thanks :)").should("exist");
|
||||||
"I'm very good thanks :)",
|
});
|
||||||
);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it("can send voice messages", () => {
|
it("can send voice messages", () => {
|
||||||
|
@ -375,18 +397,20 @@ describe("Threads", () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Send message
|
// Send message
|
||||||
cy.get(".mx_RoomView_body .mx_BasicMessageComposer_input").type("Hello Mr. Bot{enter}");
|
cy.get(".mx_RoomView_body").within(() => {
|
||||||
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Hello Mr. Bot{enter}");
|
||||||
|
|
||||||
// Create thread
|
// Create thread
|
||||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
cy.contains(".mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
||||||
.realHover()
|
.realHover()
|
||||||
.find(".mx_MessageActionBar_threadButton")
|
.findByRole("button", { name: "Reply in thread" })
|
||||||
.click();
|
.click();
|
||||||
|
});
|
||||||
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
||||||
|
|
||||||
cy.openMessageComposerOptions(true).find(`[aria-label="Voice Message"]`).click();
|
cy.openMessageComposerOptions(true).findByRole("menuitem", { name: "Voice Message" }).click();
|
||||||
cy.wait(3000);
|
cy.wait(3000);
|
||||||
cy.getComposer(true).find(".mx_MessageComposer_sendMessage").click();
|
cy.getComposer(true).findByRole("button", { name: "Send voice message" }).click();
|
||||||
|
|
||||||
cy.get(".mx_ThreadView .mx_MVoiceMessageBody").should("have.length", 1);
|
cy.get(".mx_ThreadView .mx_MVoiceMessageBody").should("have.length", 1);
|
||||||
});
|
});
|
||||||
|
@ -394,10 +418,10 @@ describe("Threads", () => {
|
||||||
it("should send location and reply to the location on ThreadView", () => {
|
it("should send location and reply to the location on ThreadView", () => {
|
||||||
// See: location.spec.ts
|
// See: location.spec.ts
|
||||||
const selectLocationShareTypeOption = (shareType: string): Chainable<JQuery> => {
|
const selectLocationShareTypeOption = (shareType: string): Chainable<JQuery> => {
|
||||||
return cy.get(`[data-testid="share-location-option-${shareType}"]`);
|
return cy.findByTestId(`share-location-option-${shareType}`);
|
||||||
};
|
};
|
||||||
const submitShareLocation = (): void => {
|
const submitShareLocation = (): void => {
|
||||||
cy.get('[data-testid="location-picker-submit-button"]').click();
|
cy.findByRole("button", { name: "Share location" }).click();
|
||||||
};
|
};
|
||||||
|
|
||||||
let bot: MatrixClient;
|
let bot: MatrixClient;
|
||||||
|
@ -423,13 +447,15 @@ describe("Threads", () => {
|
||||||
const percyCSS =
|
const percyCSS =
|
||||||
".mx_MessageTimestamp, .mx_RoomView_myReadMarker, .mapboxgl-map { visibility: hidden !important; }";
|
".mx_MessageTimestamp, .mx_RoomView_myReadMarker, .mapboxgl-map { visibility: hidden !important; }";
|
||||||
|
|
||||||
|
cy.get(".mx_RoomView_body").within(() => {
|
||||||
// User sends message
|
// User sends message
|
||||||
cy.get(".mx_RoomView_body .mx_BasicMessageComposer_input").type("Hello Mr. Bot{enter}");
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Hello Mr. Bot{enter}");
|
||||||
|
|
||||||
// Wait for message to send, get its ID and save as @threadId
|
// Wait for message to send, get its ID and save as @threadId
|
||||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
cy.contains(".mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
||||||
.invoke("attr", "data-scroll-tokens")
|
.invoke("attr", "data-scroll-tokens")
|
||||||
.as("threadId");
|
.as("threadId");
|
||||||
|
});
|
||||||
|
|
||||||
// Bot starts thread
|
// Bot starts thread
|
||||||
cy.get<string>("@threadId").then((threadId) => {
|
cy.get<string>("@threadId").then((threadId) => {
|
||||||
|
@ -444,7 +470,7 @@ describe("Threads", () => {
|
||||||
|
|
||||||
// User sends location on ThreadView
|
// User sends location on ThreadView
|
||||||
cy.get(".mx_ThreadView").should("exist");
|
cy.get(".mx_ThreadView").should("exist");
|
||||||
cy.openMessageComposerOptions(true).find("[aria-label='Location']").click();
|
cy.openMessageComposerOptions(true).findByRole("menuitem", { name: "Location" }).click();
|
||||||
selectLocationShareTypeOption("Pin").click();
|
selectLocationShareTypeOption("Pin").click();
|
||||||
cy.get("#mx_LocationPicker_map").click("center");
|
cy.get("#mx_LocationPicker_map").click("center");
|
||||||
submitShareLocation();
|
submitShareLocation();
|
||||||
|
@ -452,13 +478,9 @@ describe("Threads", () => {
|
||||||
|
|
||||||
// User replies to the location
|
// User replies to the location
|
||||||
cy.get(".mx_ThreadView").within(() => {
|
cy.get(".mx_ThreadView").within(() => {
|
||||||
cy.get(".mx_EventTile_last")
|
cy.get(".mx_EventTile_last").realHover().findByRole("button", { name: "Reply" }).click();
|
||||||
.realHover()
|
|
||||||
.within(() => {
|
|
||||||
cy.get("[aria-label='Reply']").click({ force: false });
|
|
||||||
});
|
|
||||||
|
|
||||||
cy.get(".mx_BasicMessageComposer_input").type("Please come here.{enter}");
|
cy.findByRole("textbox", { name: "Reply to thread…" }).type("Please come here.{enter}");
|
||||||
|
|
||||||
// Wait until the reply is sent
|
// Wait until the reply is sent
|
||||||
cy.get(".mx_EventTile_last .mx_EventTile_receiptSent").should("be.visible");
|
cy.get(".mx_EventTile_last .mx_EventTile_receiptSent").should("be.visible");
|
||||||
|
@ -475,30 +497,38 @@ describe("Threads", () => {
|
||||||
roomId = _roomId;
|
roomId = _roomId;
|
||||||
cy.visit("/#/room/" + roomId);
|
cy.visit("/#/room/" + roomId);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Send message
|
// Send message
|
||||||
cy.get(".mx_RoomView_body .mx_BasicMessageComposer_input").type("Hello Mr. Bot{enter}");
|
cy.get(".mx_RoomView_body").within(() => {
|
||||||
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Hello Mr. Bot{enter}");
|
||||||
|
|
||||||
// Create thread
|
// Create thread
|
||||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
cy.contains(".mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
||||||
.realHover()
|
.realHover()
|
||||||
.find(".mx_MessageActionBar_threadButton")
|
.findByRole("button", { name: "Reply in thread" })
|
||||||
.click();
|
.click();
|
||||||
|
});
|
||||||
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
||||||
|
|
||||||
// Send message to thread
|
// Send message to thread
|
||||||
cy.get(".mx_BaseCard .mx_BasicMessageComposer_input").type("Hello Mr. User{enter}");
|
cy.get(".mx_ThreadPanel").within(() => {
|
||||||
cy.get(".mx_BaseCard .mx_EventTile").should("contain", "Hello Mr. User");
|
cy.findByRole("textbox", { name: "Send a message…" }).type("Hello Mr. User{enter}");
|
||||||
|
cy.get(".mx_EventTile_last").findByText("Hello Mr. User").should("exist");
|
||||||
|
|
||||||
// Close thread
|
// Close thread
|
||||||
cy.get(".mx_BaseCard_close").click();
|
cy.findByRole("button", { name: "Close" }).click();
|
||||||
|
});
|
||||||
|
|
||||||
// Open existing thread
|
// Open existing thread
|
||||||
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "Hello Mr. Bot")
|
||||||
.realHover()
|
.realHover()
|
||||||
.find(".mx_MessageActionBar_threadButton")
|
.findByRole("button", { name: "Reply in thread" })
|
||||||
.click();
|
.click();
|
||||||
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
cy.get(".mx_ThreadView_timelinePanelWrapper").should("have.length", 1);
|
||||||
cy.get(".mx_BaseCard .mx_EventTile").should("contain", "Hello Mr. Bot");
|
|
||||||
cy.get(".mx_BaseCard .mx_EventTile").should("contain", "Hello Mr. User");
|
cy.get(".mx_BaseCard").within(() => {
|
||||||
|
cy.get(".mx_EventTile").first().findByText("Hello Mr. Bot").should("exist");
|
||||||
|
cy.get(".mx_EventTile").last().findByText("Hello Mr. User").should("exist");
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue