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

Hide tooltips for certain playwright screenshots to avoid flakiness (#12770)

Browse source 
* Hide tooltips for certain playwright screenshots to avoid flakiness

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Typo

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* tsc

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-07-12 12:23:53 +01:00 committed by GitHub
parent 08ee1b8d97
commit 1082d767d4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 16 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
playwright/e2e/timeline/timeline.spec.ts
View file

@ -410,6 +410,7 @@ test.describe("Timeline", () => {
{ {
// Exclude timestamp from snapshot of mx_MainSplit // Exclude timestamp from snapshot of mx_MainSplit
mask: [page.locator(".mx_MessageTimestamp")], mask: [page.locator(".mx_MessageTimestamp")],
hideTooltips: true,
}, },
); );
@ -427,6 +428,7 @@ test.describe("Timeline", () => {
await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-and-messages-irc-layout.png", { await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-and-messages-irc-layout.png", {
// Exclude timestamp from snapshot of mx_MainSplit // Exclude timestamp from snapshot of mx_MainSplit
mask: [page.locator(".mx_MessageTimestamp")], mask: [page.locator(".mx_MessageTimestamp")],
hideTooltips: true,
}); });
// 3. Alignment of expanded GELS and placeholder of deleted message // 3. Alignment of expanded GELS and placeholder of deleted message
@ -447,6 +449,7 @@ test.describe("Timeline", () => {
await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-redaction-placeholder.png", { await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-redaction-placeholder.png", {
// Exclude timestamp from snapshot of mx_MainSplit // Exclude timestamp from snapshot of mx_MainSplit
mask: [page.locator(".mx_MessageTimestamp")], mask: [page.locator(".mx_MessageTimestamp")],
hideTooltips: true,
}); });
// 4. Alignment of expanded GELS, placeholder of deleted message, and emote // 4. Alignment of expanded GELS, placeholder of deleted message, and emote
@ -469,6 +472,7 @@ test.describe("Timeline", () => {
await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-emote-irc-layout.png", { await expect(page.locator(".mx_MainSplit")).toMatchScreenshot("expanded-gels-emote-irc-layout.png", {
// Exclude timestamp from snapshot of mx_MainSplit // Exclude timestamp from snapshot of mx_MainSplit
mask: [page.locator(".mx_MessageTimestamp")], mask: [page.locator(".mx_MessageTimestamp")],
hideTooltips: true,
}); });
}); });
@ -481,6 +485,7 @@ test.describe("Timeline", () => {
display: none !important; display: none !important;
} }
`, `,
hideTooltips: true,
}; };
await sendEvent(app.client, room.roomId); await sendEvent(app.client, room.roomId);

11
playwright/element-web-test.ts
View file

@ -306,12 +306,22 @@ export const expect = baseExpect.extend({
options?: { options?: {
mask?: Array<Locator>; mask?: Array<Locator>;
omitBackground?: boolean; omitBackground?: boolean;
hideTooltips?: boolean;
timeout?: number; timeout?: number;
css?: string; css?: string;
}, },
) { ) {
const page = "page" in receiver ? receiver.page() : receiver; const page = "page" in receiver ? receiver.page() : receiver;
let hideTooltipsCss: string | undefined;
if (options?.hideTooltips) {
hideTooltipsCss = `
.mx_Tooltip_visible {
visibility: hidden !important;
}
`;
}
// We add a custom style tag before taking screenshots // We add a custom style tag before taking screenshots
const style = (await page.addStyleTag({ const style = (await page.addStyleTag({
content: ` content: `
@ -339,6 +349,7 @@ export const expect = baseExpect.extend({
.mx_MessageTimestamp { .mx_MessageTimestamp {
font-family: Inconsolata !important; font-family: Inconsolata !important;
} }
${hideTooltipsCss ?? ""}
${options?.css ?? ""} ${options?.css ?? ""}
`, `,
})) as ElementHandle<Element>; })) as ElementHandle<Element>;