SWED-2249 update E2E tests

SwedbankPay · Oct 10, 2023 · 55d0107 · 55d0107
1 parent 0795b38
commit 55d0107
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 19 deletions.
diff --git a/...ialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-chromium-darwin.png b/...ialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-chromium-darwin.png
diff --git a/...dialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-firefox-darwin.png b/...dialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-firefox-darwin.png
diff --git a/.../dialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-webkit-darwin.png b/.../dialog.e2e.spec.js-snapshots/SwedbankPay-dialog-modal-screen-webkit-darwin.png
diff --git a/src/App/ComponentsDocumentation/components/Topbar/topbar.e2e.spec.js b/src/App/ComponentsDocumentation/components/Topbar/topbar.e2e.spec.js
@@ -9,12 +9,12 @@ test("Topbar page exist", async ({ page }) => {
 		})
 		.click();
 	await expect(page.getByRole("link", { name: "Topbar" })).toHaveCount(
-		page.viewportSize().width < 991 ? 1 : 2,
+		page.viewportSize().width < 991 ? 1 : 2
 	);
 	await page.getByText("call_to_actionTopbararrow_forward").click();
 	await expect(page).toHaveTitle(/Topbar/);
 	await expect(
-		page.getByRole("heading", { name: "Topbar", exact: true, level: 1 }),
+		page.getByRole("heading", { name: "Topbar", exact: true, level: 1 })
 	).toBeVisible();
 });
 
@@ -44,7 +44,9 @@ let brand;
  * @param {string} tabBtnText text of the doc preview container tab
  */
 const clickDocPreviewTab = async (page, tabBtnText) => {
-	await page.getByRole("link", { name: tabBtnText, exact: true }).click();
+	await page
+		.getByRole("link", { name: tabBtnText, exact: true })
+		.click({ force: true });
 };
 
 test.describe("visual regressions topbar", () => {
@@ -56,14 +58,14 @@ test.describe("visual regressions topbar", () => {
 
 	test(`general UI closed`, async ({ page }) => {
 		await expect(
-			page.getByRole("heading", { name: "Topbar", exact: true }),
+			page.getByRole("heading", { name: "Topbar", exact: true })
 		).toBeVisible();
 
 		for (const topbarTab of topbarTabs) {
 			clickDocPreviewTab(page, topbarTab.btnText);
 
 			await expect(
-				page.locator(".component-preview-content > div"),
+				page.locator(".component-preview-content > div")
 			).toHaveScreenshot(`${brand}-topbar-${topbarTab.name}-closed.png`);
 		}
 	});
@@ -77,9 +79,9 @@ test.describe("visual regressions topbar", () => {
 
 			await page.locator("#demo-topbar").getByRole("link").nth(2).hover();
 			await expect(
-				page.locator("#demo-topbar").getByRole("navigation"),
+				page.locator("#demo-topbar").getByRole("navigation")
 			).toHaveScreenshot(
-				`${brand}-topbar-${topbarTab.name}-links-ui-feedbacks.png`,
+				`${brand}-topbar-${topbarTab.name}-links-ui-feedbacks.png`
 			);
 		}
 	});
@@ -96,7 +98,7 @@ test.describe("visual regressions topbar", () => {
 				: page.locator(".component-preview-content > div");
 
 			await expect(modalContainer).toHaveScreenshot(
-				`${brand}-topbar-${topbarTab.name}-opened.png`,
+				`${brand}-topbar-${topbarTab.name}-opened.png`
 			);
 		}
 	});
@@ -105,7 +107,7 @@ test.describe("visual regressions topbar", () => {
 		page,
 	}) => {
 		for (const topbarTab of topbarTabs.filter(
-			(tab) => tab.desktopTopbar && !tab.isLegacy,
+			(tab) => tab.desktopTopbar && !tab.isLegacy
 		)) {
 			clickDocPreviewTab(page, topbarTab.btnText);
 

diff --git a/src/App/Identity/identity/Typography/typography.e2e.spec.js b/src/App/Identity/identity/Typography/typography.e2e.spec.js
@@ -8,16 +8,30 @@ test("Typography page exist", async ({ page }) => {
 			name: "Identity Learn about our fundamental principles",
 		})
 		.click();
-	await expect(
-		page.getByRole("link", {
-			name: "Typography",
-		})
-	).toHaveCount(page.viewportSize().width < 991 ? 1 : 2);
-	await page
-		.getByRole("link", {
-			name: "Typography See our fronts and sizing arrow_forward",
-		})
-		.click();
+
+	if (page.viewportSize().width > 991) {
+		await expect(
+			page.getByRole("link", {
+				name: "Typography",
+			})
+		).toHaveCount(1);
+		await page.getByRole("link", { name: "Typography" }).click();
+	} else {
+		await expect(
+			page.getByRole("link", {
+				name: "Typography",
+			})
+		).toHaveCount(0);
+		await page.getByLabel("Open menu").click();
+		await page.getByRole("button", { name: "Identity" }).click();
+
+		await expect(
+			page.getByRole("link", {
+				name: "Typography",
+			})
+		).toHaveCount(1);
+		await page.getByRole("link", { name: "Typography" }).click();
+	}
 });
 
 const viewportsVariants = [