PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Improve percy snapshot stability (#10239)

Browse source
This commit is contained in:
Michael Telatyński 2023-02-27 09:16:49 +00:00 committed by GitHub
parent 12dd799301
commit c22971e542
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
cypress/e2e/polls/polls.spec.ts
View file

@ -20,7 +20,7 @@ import { HomeserverInstance } from "../../plugins/utils/homeserver";
import { MatrixClient } from "../../global"; import { MatrixClient } from "../../global";
import Chainable = Cypress.Chainable; import Chainable = Cypress.Chainable;
const hideTimestampCSS = ".mx_MessageTimestamp { visibility: hidden !important; }"; const hidePercyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
describe("Polls", () => { describe("Polls", () => {
let homeserver: HomeserverInstance; let homeserver: HomeserverInstance;
@ -133,7 +133,7 @@ describe("Polls", () => {
.as("pollId"); .as("pollId");
cy.get<string>("@pollId").then((pollId) => { cy.get<string>("@pollId").then((pollId) => {
getPollTile(pollId).percySnapshotElement("Polls Timeline tile - no votes", { percyCSS: hideTimestampCSS }); getPollTile(pollId).percySnapshotElement("Polls Timeline tile - no votes", { percyCSS: hidePercyCSS });
// Bot votes 'Maybe' in the poll // Bot votes 'Maybe' in the poll
botVoteForOption(bot, roomId, pollId, pollParams.options[2]); botVoteForOption(bot, roomId, pollId, pollParams.options[2]);

14
cypress/e2e/timeline/timeline.spec.ts
View file

@ -185,9 +185,8 @@ describe("Timeline", () => {
.should("have.css", "margin-inline-start", "104px") .should("have.css", "margin-inline-start", "104px")
.should("have.css", "inset-inline-start", "0px"); .should("have.css", "inset-inline-start", "0px");
// Exclude timestamp from snapshot // Exclude timestamp and read marker from snapshot
const percyCSS = const percyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
".mx_RoomView_body .mx_EventTile_info .mx_MessageTimestamp { visibility: hidden !important; }";
cy.get(".mx_MainSplit").percySnapshotElement("Event line with inline start margin on IRC layout", { cy.get(".mx_MainSplit").percySnapshotElement("Event line with inline start margin on IRC layout", {
percyCSS, percyCSS,
}); });
@ -213,8 +212,8 @@ describe("Timeline", () => {
// Click timestamp to highlight hidden event line // Click timestamp to highlight hidden event line
cy.get(".mx_RoomView_body .mx_EventTile_info .mx_MessageTimestamp").click(); cy.get(".mx_RoomView_body .mx_EventTile_info .mx_MessageTimestamp").click();
// Exclude timestamp from snapshot // Exclude timestamp and read marker from snapshot
const percyCSS = ".mx_RoomView_body .mx_EventTile .mx_MessageTimestamp { visibility: hidden !important; }"; const percyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
// should not add inline start padding to a hidden event line on IRC layout // should not add inline start padding to a hidden event line on IRC layout
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.IRC); cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.IRC);
@ -336,9 +335,8 @@ describe("Timeline", () => {
cy.checkA11y(); cy.checkA11y();
// Exclude timestamp from snapshot // Exclude timestamp and read marker from snapshot
const percyCSS = const percyCSS = ".mx_MessageTimestamp, .mx_RoomView_myReadMarker { visibility: hidden !important; }";
".mx_RoomView_body .mx_EventTile_info .mx_MessageTimestamp { visibility: hidden !important; }";
cy.get(".mx_EventTile_last").percySnapshotElement("URL Preview", { cy.get(".mx_EventTile_last").percySnapshotElement("URL Preview", {
percyCSS, percyCSS,
widths: [800, 400], widths: [800, 400],

4
cypress/support/percy.ts
View file

@ -41,7 +41,9 @@ declare global {
Cypress.Commands.add("percySnapshotElement", { prevSubject: "element" }, (subject, name, options) => { Cypress.Commands.add("percySnapshotElement", { prevSubject: "element" }, (subject, name, options) => {
if (!options?.allowSpinners) { if (!options?.allowSpinners) {
// Await spinners to vanish // Await spinners to vanish
cy.get(".mx_Spinner").should("not.exist"); cy.get(".mx_Spinner", { log: false }).should("not.exist");
// But like really no more spinners please
cy.get(".mx_Spinner", { log: false }).should("not.exist");
} }
cy.percySnapshot(name, { cy.percySnapshot(name, {
domTransformation: (documentClone) => scope(documentClone, subject.selector), domTransformation: (documentClone) => scope(documentClone, subject.selector),