chore: Update Market spec test to handle flacky test on Bitcoin search (

#8910) * chore: Update Market spec test to handle flacky test on Bitcoin search * test(lld): update screenshots (ubuntu-22.04) lld, test, screenshot * test(lld): update screenshots (ubuntu-22.04) lld, test, screenshot --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
LedgerHQ · Jan 17, 2025 · fcfcd4e · fcfcd4e
1 parent ddf8d85
commit fcfcd4e
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 13 deletions.
diff --git a/.changeset/heavy-kings-fix.md b/.changeset/heavy-kings-fix.md
@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": minor
+---
+
+Update Market spec test to handle flacky test on "Bitcoin" search
diff --git a/apps/ledger-live-desktop/tests/specs/market/market.spec.ts b/apps/ledger-live-desktop/tests/specs/market/market.spec.ts
@@ -1,4 +1,4 @@
-import { expect } from "@playwright/test";
+import { expect, Locator, Page } from "@playwright/test";
 import { getEnv } from "@ledgerhq/live-env";
 import test from "../../fixtures/common";
 import { MarketPage } from "../../page/market.page";
@@ -37,23 +37,36 @@ test("Market", async ({ page }) => {
   const layout = new Layout(page);
   const liveAppWebview = new LiveAppWebview(page);
 
-  const maskItems = {
-    mask: [
+  function createBaseMask(page: Page) {
+    return [
       page.getByTestId("market-small-graph"),
       page.getByTestId("market-coin-price"),
       page.getByTestId("market-cap"),
       page.getByTestId("market-price-change"),
-      page.getByRole("row").filter({ hasText: new RegExp("^(?!.*(?:Bitcoin|Ethereum)).*$") }),
-      //Fix for Test App (external) workflow
+      // Fix for Test App (external) workflow
       page.getByRole("row").nth(6),
       page.getByRole("row").nth(7),
-    ],
-  };
+    ];
+  }
+
+  function createMaskExcluding(page: Page, excludedPatterns: string[]): Locator[] {
+    const baseMask = createBaseMask(page);
+    const exclusionRegex = new RegExp(`^(?!.*(?:${excludedPatterns.join("|")})).*$`);
+    return [...baseMask, page.getByRole("row").filter({ hasText: exclusionRegex })];
+  }
+
+  // Masks
+  const maskEverythingExceptBitcoinAndEthereum = {
+    mask: createMaskExcluding(page, ["Bitcoin", "Ethereum"]),
+  }; // Exclude all except Bitcoin and Ethereum
+  const maskEverythingExceptBitcoin = { mask: createMaskExcluding(page, ["Bitcoin"]) }; // Exclude all except Bitcoin
 
   await test.step("go to market", async () => {
     await layout.goToMarket();
     await marketPage.waitForLoadingWithSwapbtn();
-    await expect.soft(page).toHaveScreenshot("market-page-no-scrollbar.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-no-scrollbar.png", maskEverythingExceptBitcoinAndEthereum);
   });
 
   await page.route(`${getEnv("LEDGER_COUNTERVALUES_API")}/v3/supported/fiat`, async route => {
@@ -128,31 +141,41 @@ test("Market", async ({ page }) => {
   await test.step("change countervalue", async () => {
     await marketPage.switchCountervalue("THB");
     await marketPage.waitForLoadingWithSwapbtn();
-    await expect.soft(page).toHaveScreenshot("market-page-thb-countervalue.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-thb-countervalue.png", maskEverythingExceptBitcoinAndEthereum);
   });
 
   await test.step("change market range", async () => {
     await marketPage.switchMarketRange("7d");
     await marketPage.waitForLoadingWithSwapbtn();
-    await expect.soft(page).toHaveScreenshot("market-page-7d-range.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-7d-range.png", maskEverythingExceptBitcoinAndEthereum);
   });
 
   await test.step("star bitcoin", async () => {
     await marketPage.starCoin("btc");
-    await expect.soft(page).toHaveScreenshot("market-page-btc-star.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-btc-star.png", maskEverythingExceptBitcoinAndEthereum);
   });
 
   await test.step("search bitcoin", async () => {
     await marketPage.search("bitcoin");
     await marketPage.waitForLoading();
-    await expect.soft(page).toHaveScreenshot("market-page-search-bitcoin.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-search-bitcoin.png", maskEverythingExceptBitcoin);
   });
 
   await test.step("filter starred", async () => {
     await marketPage.toggleStarFilter();
     await marketPage.waitForLoadingWithSwapbtn();
     // await marketPage.waitForSearchBarToBeEmpty(); // windows was showing the search bar still containing text. This wait prevents that
-    await expect.soft(page).toHaveScreenshot("market-page-filter-starred.png", maskItems);
+    await expect
+      .soft(page)
+      .toHaveScreenshot("market-page-filter-starred.png", maskEverythingExceptBitcoinAndEthereum);
   });
 
   await test.step("swap available to bitcoin", async () => {