imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve stability of Playwright screenshot tests (#11983)

Browse source
This commit is contained in:
Michael Telatynski 2023-12-04 11:02:48 +00:00 • committed by GitHub
parent 74ea0d134e
commit e180ca841b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
23 changed files with 71 additions and 80 deletions
Download patch file Download diff file Expand all files Collapse all files

36
playwright/e2e/right-panel/file-panel.spec.ts
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { type Page } from "@playwright/test";
import { Download, type Page } from "@playwright/test";
import { test, expect } from "../../element-web-test";
import { viewRoomSummaryByName } from "./utils";
@ -53,7 +53,7 @@ test.describe("FilePanel", () => {
await expect(page.locator(".mx_FilePanel_empty")).toBeVisible();
// Take a snapshot of RightPanel - fix https://github.com/vector-im/element-web/issues/25332
await expect(page.locator(".mx_RightPanel")).toHaveScreenshot("empty.png");
await expect(page.locator(".mx_RightPanel")).toMatchScreenshot("empty.png");
});
test("should list tiles on the panel", async ({ page }) => {
@ -135,17 +135,9 @@ test.describe("FilePanel", () => {
await expect(senderDetails.locator(".mx_MessageTimestamp")).toBeVisible();
// Take a snapshot of file tiles list on FilePanel
// XXX: We remove the RM as masking it in different locations causes a false positive
await page.evaluate(() => {
document.querySelectorAll(".mx_MessagePanel_myReadMarker").forEach((e) => e.remove());
});
await expect(filePanelMessageList).toHaveScreenshot("file-tiles-list.png", {
// Exclude timestamps, profiles, avatars & flaky seek bar from snapshot
mask: [
page.locator(
".mx_MessageTimestamp, .mx_DisambiguatedProfile, .mx_BaseAvatar, .mx_AudioPlayer_seek",
),
],
await expect(filePanelMessageList).toMatchScreenshot("file-tiles-list.png", {
// Exclude timestamps, profile & flaky seek bar from snapshot
mask: [page.locator(".mx_MessageTimestamp, .mx_DisambiguatedProfile, .mx_AudioPlayer_seek")],
});
});
@ -210,18 +202,22 @@ test.describe("FilePanel", () => {
const link = imageBody.locator(".mx_MFileBody_download a");
const newPagePromise = context.waitForEvent("page");
// const downloadPromise = page.waitForEvent("download");
const downloadPromise = new Promise<Download>((resolve) => {
page.once("download", resolve);
});
// Click the anchor link (not the image itself)
await link.click();
const newPage = await newPagePromise;
// XXX: Clicking the link opens the image in a new tab on some browsers rather than downloading, so handle that case
await expect(newPage).toHaveURL(/.+\/_matrix\/media\/\w+\/download\/localhost\/\w+/);
// .catch(async () => {
// const download = await downloadPromise;
// expect(download.suggestedFilename()).toBe("riot.png");
// });
// XXX: Clicking the link opens the image in a new tab on some browsers rather than downloading
await expect(newPage)
.toHaveURL(/.+\/_matrix\/media\/\w+\/download\/localhost\/\w+/)
.catch(async () => {
const download = await downloadPromise;
expect(download.suggestedFilename()).toBe("riot.png");
});
});
});
});

2
playwright/e2e/right-panel/notification-panel.spec.ts
View file

@ -38,6 +38,6 @@ test.describe("NotificationPanel", () => {
await expect(page.locator(".mx_NotificationPanel_empty")).toBeVisible();
// Take a snapshot of RightPanel
await expect(page.locator(".mx_RightPanel")).toHaveScreenshot("empty.png");
await expect(page.locator(".mx_RightPanel")).toMatchScreenshot("empty.png");
});
});

4
playwright/e2e/right-panel/right-panel.spec.ts
View file

@ -67,9 +67,7 @@ test.describe("RightPanel", () => {
await expect(page.locator(".mx_RightPanel")).not.toBeVisible();
await page.getByRole("button", { name: "Room info" }).click();
await expect(page.locator(".mx_RightPanel")).toHaveScreenshot("with-name-and-address.png", {
mask: [page.locator(".mx_BaseAvatar")],
});
await expect(page.locator(".mx_RightPanel")).toMatchScreenshot("with-name-and-address.png");
});
test("should handle clicking add widgets", async ({ page, app }) => {