diff --git a/cypress/e2e/14-timeline/timeline.spec.ts b/cypress/e2e/14-timeline/timeline.spec.ts index 238cfc8b0ae..0a3f1fc3cfa 100644 --- a/cypress/e2e/14-timeline/timeline.spec.ts +++ b/cypress/e2e/14-timeline/timeline.spec.ts @@ -154,12 +154,36 @@ describe("Timeline", () => { cy.percySnapshot("Configured room on IRC layout"); }); + it("should click view source toggle on IRC layout", () => { + sendEvent(roomId); + cy.visit("/#/room/" + roomId); + cy.setSettingValue("showHiddenEventsInTimeline", null, SettingLevel.DEVICE, true); + cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.IRC); + cy.contains(".mx_RoomView_body .mx_GenericEventListSummary[data-layout=irc] " + + ".mx_GenericEventListSummary_summary", "created and configured the room."); + + cy.contains(".mx_RoomView_body .mx_EventTile .mx_EventTile_line", "Message").within(() => { + cy.get('[aria-label="Edit"]').click({ force: true }); // Cypress has no ability to hover + cy.get(".mx_BasicMessageComposer_input").type("Edit{enter}"); + }); + cy.contains(".mx_RoomView_body .mx_EventTile[data-scroll-tokens]", "MessageEdit"); + + // Exclude timestamp from snapshot + const percyCSS = ".mx_RoomView_body .mx_EventTile_info .mx_MessageTimestamp " + + "{ visibility: hidden !important; }"; + + // Click view source event toggle + cy.get(".mx_EventTile[data-layout=irc].mx_EventTile_info:first-of-type .mx_EventTile_line").realHover() + .percySnapshot("Hovered hidden event line", { percyCSS }) + .get(".mx_ViewSourceEvent_toggle").click({ force: false }); + }); + it("should add inline start margin to an event line on IRC layout", () => { cy.visit("/#/room/" + roomId); cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.IRC); // Wait until configuration is finished - cy.contains(".mx_RoomView_body .mx_GenericEventListSummary " + + cy.contains(".mx_RoomView_body .mx_GenericEventListSummary[data-layout=irc] " + ".mx_GenericEventListSummary_summary", "created and configured the room."); // Click "expand" link button diff --git a/res/css/views/rooms/_IRCLayout.pcss b/res/css/views/rooms/_IRCLayout.pcss index 65ee7d371e5..642895f331d 100644 --- a/res/css/views/rooms/_IRCLayout.pcss +++ b/res/css/views/rooms/_IRCLayout.pcss @@ -129,12 +129,17 @@ $irc-line-height: $font-18px; .mx_TextualEvent, .mx_ViewSourceEvent, .mx_MTextBody { - display: inline-block; /* add a 1px padding top and bottom because our larger emoji font otherwise gets cropped by anti-zalgo */ padding: var(--EventTile_irc_line-padding-block) 0; } + .mx_EventTile_e2eIcon, + .mx_TextualEvent, + .mx_MTextBody { + display: inline-block; + } + .mx_ReplyTile { .mx_MTextBody { display: -webkit-box; /* Enable -webkit-line-clamp */