test: ✅ adding e2e test - user displays his nft collection

.changeset/thick-peas-hear.md

@@ -0,0 +1,6 @@
+---
+"ledger-live-desktop": minor
+"@ledgerhq/live-common": minor
+---
+
+Adding New E2E tests

apps/ledger-live-desktop/src/renderer/screens/nft/Gallery/TokensList/Item.tsx

@@ -94,6 +94,7 @@ const NftCard = ({ id, mode, account, withContextMenu = false, onHideCollection
         horizontal={!isGrid}
         alignItems={!isGrid ? "center" : undefined}
         onClick={onItemClick}
+        data-testId={`nft-row-gallery-${nft?.contract}`}
       >
         <Skeleton width={40} minHeight={40} full={isGrid} show={show}>
           <Media

apps/ledger-live-desktop/tests/page/account.page.ts

@@ -2,6 +2,7 @@ import { expect } from "@playwright/test";
 import { step } from "tests/misc/reporters/step";
 import { AppPage } from "tests/page/abstractClasses";
 import { Account } from "@ledgerhq/live-common/e2e/enum/Account";
+import invariant from "invariant";
 
 export class AccountPage extends AppPage {
   readonly settingsButton = this.page.getByTestId("account-settings-button");
@@ -31,8 +32,7 @@ export class AccountPage extends AppPage {
   private tokenRow = (tokenTicker: string) => this.page.getByTestId(`token-row-${tokenTicker}`);
   private addTokenButton = this.page.getByRole("button", { name: "Add token" });
   private viewDetailsButton = this.page.getByText("View details");
-  private seeGalleryButton = this.page.getByTestId("see-gallery-button");
-  private nft = (nftName: string) => this.page.locator(`text=${nftName}`);
+  private seeGalleryButton = this.page.getByRole("button", { name: "See Gallery" });
   private nftOperation = this.page.getByText("NFT Sent");
   private nftList = (collectionName: string) => this.page.getByTestId(`nft-row-${collectionName}`);
 
@@ -169,23 +169,18 @@ export class AccountPage extends AppPage {
     await this.seeGalleryButton.click();
   }
 
-  @step("Select NFT $0")
-  async selectNFT(nftName: string) {
-    await this.nft(nftName).click();
-  }
-
   @step("Navigate to NFT operation")
   async navigateToNFTOperation() {
     await this.nftOperation.click();
   }
 
-  @step("Expect NFT list $0 to be visible")
+  @step("Expect NFT list to be visible")
   async checkNftListInAccount(account: Account) {
-    if (account.nft) {
-      for (const nft of account.nft) {
-        const nftLocator = this.nftList(nft.collectionName);
-        await expect(nftLocator).toBeVisible();
-      }
+    invariant(account.nft && account.nft.length > 0, "No NFT found in account");
+
+    for (const nft of account.nft) {
+      const nftLocator = this.nftList(nft.collectionName);
+      await expect(nftLocator).toBeVisible();
     }
   }
 }

apps/ledger-live-desktop/tests/page/drawer/nft.drawer.ts

@@ -1,13 +1,16 @@
 import { step } from "tests/misc/reporters/step";
 import { Drawer } from "tests/component/drawer.component";
 import { expect } from "@playwright/test";
+import { Account } from "@ledgerhq/live-common/e2e/enum/Account";
+import axios from "axios";
+import { getEnv } from "@ledgerhq/live-env";
+import invariant from "invariant";
 
 export class NFTDrawer extends Drawer {
   private nftName = this.page.getByTestId("nft-name-sendDrawer");
   private sendButton = this.page.getByTestId("nft-send-button-sendDrawer");
   private nftFloorPrice = this.page.getByTestId("nft-floor-price");
   private nftOptionsButton = this.page.locator("#accounts-options-button");
-  private openInOpenSeaButton = this.page.getByText("Open in Opensea.io");
 
   @step("Verify nft name is visible")
   async expectNftNameIsVisible(nft: string) {
@@ -25,50 +28,33 @@ export class NFTDrawer extends Drawer {
   }
 
   @step("Retrieve NFT floor price value")
-  async getFloorPriceplayed() {
+  async getFloorPriceDisplayed() {
     const floorPrice = await this.nftFloorPrice.textContent();
     return floorPrice ? floorPrice?.split(" ")[0] : "";
   }
 
   @step("Expect nft floor price to be positive")
   async expectNftFloorPricePositive() {
-    const floorPrice = await this.getFloorPriceplayed();
-    await expect(parseFloat(floorPrice)).toBeGreaterThan(0);
+    const floorPrice = await this.getFloorPriceDisplayed();
+    expect(parseFloat(floorPrice)).toBeGreaterThan(0);
   }
 
   @step("Click on nft options")
   async clickNftOptions() {
     await this.nftOptionsButton.click();
   }
 
-  @step("Check OpenSea.io")
-  async checkOpenSea() {
-    /*
-     *
-     * Interception not working... todo: fix it
-     *
-     */
+  @step("Check Floor price value to be $1")
+  async verifyFloorPriceValue(account: Account, floorPrice: string) {
+    const nft =
+      account.nft?.find(nft => nft.nftContract)?.nftContract ??
+      invariant(false, "No valid NFTs founds for this account");
 
-    // console.log("Checking OpenSea.io");
+    const { data } = await axios({
+      method: "GET",
+      url: `${getEnv("NFT_ETH_METADATA_SERVICE")}/v1/marketdata/${account.currency.currencyId}/1/contract/${nft}/floor-price`,
+    });
 
-    // await this.page.route("*", async (route, request) => {
-    //   console.log("Intercepted request URL:", request.url());
-
-    //   const postData = request.postData();
-    //   if (postData) {
-    //     const payload = JSON.parse(postData);
-    //     console.log("Payload:", JSON.stringify(payload, null, 2));
-
-    //     if (payload.event === "OpenURL") {
-    //       console.log("OpenURL event detected!");
-    //       expect(payload.url).toContain("opensea.io/assets/ethereum");
-    //     } else {
-    //       console.log("Non-matching event:", payload.event);
-    //     }
-    //   }
-    //   await route.continue();
-    // });
-
-    await this.openInOpenSeaButton.click();
+    expect(data.value).toEqual(parseFloat(floorPrice));
   }
 }

apps/ledger-live-desktop/tests/page/index.ts

@@ -21,6 +21,7 @@ import { AssetDrawer } from "./drawer/asset.drawer";
 import { PasswordlockModal } from "./modal/passwordlock.modal";
 import { LockscreenPage } from "tests/page/lockscreen.page";
 import { NFTDrawer } from "./drawer/nft.drawer";
+import { NftGallery } from "./nftGallery.page";
 
 export class Application extends PageHolder {
   public account = new AccountPage(this.page);
@@ -45,4 +46,5 @@ export class Application extends PageHolder {
   public password = new PasswordlockModal(this.page);
   public LockscreenPage = new LockscreenPage(this.page);
   public nftDrawer = new NFTDrawer(this.page);
+  public nftGallery = new NftGallery(this.page);
 }

apps/ledger-live-desktop/tests/page/nftGallery.page.ts

@@ -0,0 +1,26 @@
+import { expect } from "@playwright/test";
+import { step } from "tests/misc/reporters/step";
+import { AppPage } from "tests/page/abstractClasses";
+import { Account } from "@ledgerhq/live-common/e2e/enum/Account";
+import invariant from "invariant";
+
+export class NftGallery extends AppPage {
+  private locateNftInGalleryByName = (nftName: string) => this.page.locator(`text=${nftName}`);
+  private nftListGallery = (nftContract: string) =>
+    this.page.getByTestId(`nft-row-gallery-${nftContract}`);
+
+  @step("Select NFT $0")
+  async selectNFT(nftName: string) {
+    await this.locateNftInGalleryByName(nftName).click();
+  }
+
+  @step("Expect NFT list to be visible in gallery")
+  async verifyNftPresenceInGallery(account: Account) {
+    invariant(account.nft && account.nft.length > 0, "No NFT found in account");
+
+    for (const nft of account.nft) {
+      const nftLocator = this.nftListGallery(nft.nftContract);
+      await expect(nftLocator).toBeVisible();
+    }
+  }
+}

apps/ledger-live-desktop/tests/specs/speculos/nft.spec.ts

@@ -6,6 +6,7 @@ import { Fee } from "@ledgerhq/live-common/e2e/enum/Fee";
 import { addTmsLink } from "tests/utils/allureUtils";
 import { getDescription } from "../../utils/customJsonReporter";
 import { commandCLI } from "tests/utils/cliUtils";
+import invariant from "invariant";
 
 test.describe("send NFT to ENS address", () => {
   const transaction = new NFTTransaction(Account.ETH_1, Account.ETH_MC, Nft.PODIUM, Fee.SLOW);
@@ -44,7 +45,7 @@ test.describe("send NFT to ENS address", () => {
       await app.layout.goToAccounts();
       await app.accounts.navigateToAccountByName(transaction.accountToDebit.accountName);
       await app.account.navigateToNFTGallery();
-      await app.account.selectNFT(transaction.nft.nftName);
+      await app.nftGallery.selectNFT(transaction.nft.nftName);
       await app.nftDrawer.expectNftNameIsVisible(transaction.nft.nftName);
       await app.nftDrawer.clickSend();
       await app.send.craftNFTTx(transaction);
@@ -92,22 +93,25 @@ test.describe("The user can see his NFT floor price", () => {
       await app.layout.goToAccounts();
       await app.accounts.navigateToAccountByName(account.accountName);
       await app.account.navigateToNFTGallery();
-      if (account.nft) {
-        await app.account.selectNFT(account.nft[0].nftName);
-        await app.nftDrawer.expectNftNameIsVisible(account.nft[0].nftName);
-      }
+      const nft =
+        account.nft?.find(nft => nft.nftName)?.nftName ??
+        invariant(false, "No valid NFTs founds for this account");
+      await app.nftGallery.selectNFT(nft);
+      await app.nftDrawer.expectNftNameIsVisible(nft);
       await app.nftDrawer.expectNftFloorPriceIsVisible();
+      const floorPrice = await app.nftDrawer.getFloorPriceDisplayed();
       await app.nftDrawer.expectNftFloorPricePositive();
       await app.nftDrawer.clickNftOptions();
-      await app.nftDrawer.checkOpenSea();
+      await app.nftDrawer.verifyFloorPriceValue(account, floorPrice);
     },
   );
 });
 
 const accounts = [
-  { account: Account.ETH_1, xrayTicket: "B2CQA-801.1" },
-  { account: Account.POL_1, xrayTicket: "B2CQA-801.2" },
+  { account: Account.ETH_1, xrayTicket1: "B2CQA-2863", xrayTicket2: "B2CQA-2861" },
+  { account: Account.POL_1, xrayTicket1: "B2CQA-2864", xrayTicket2: "B2CQA-2862" },
 ];
+
 for (const account of accounts) {
   test.describe("The user displays all the nfts from his account", () => {
     test.use({
@@ -131,7 +135,7 @@ for (const account of accounts) {
       {
         annotation: {
           type: "TMS",
-          description: "B2CQA-659",
+          description: account.xrayTicket1,
         },
       },
       async ({ app }) => {
@@ -143,3 +147,40 @@ for (const account of accounts) {
     );
   });
 }
+
+for (const account of accounts) {
+  test.describe("The user displays his nft collection", () => {
+    test.use({
+      userdata: "skip-onboarding",
+      cliCommands: [
+        {
+          command: commandCLI.liveData,
+          args: {
+            currency: account.account.currency.currencyId,
+            index: account.account.index,
+            appjson: "",
+            add: true,
+          },
+        },
+      ],
+      speculosApp: account.account.currency.speculosApp,
+    });
+
+    test(
+      `User displays his ${account.account.currency.name} nft collection`,
+      {
+        annotation: {
+          type: "TMS",
+          description: account.xrayTicket2,
+        },
+      },
+      async ({ app }) => {
+        await addTmsLink(getDescription(test.info().annotations).split(", "));
+        await app.layout.goToAccounts();
+        await app.accounts.navigateToAccountByName(account.account.accountName);
+        await app.account.navigateToNFTGallery();
+        await app.nftGallery.verifyNftPresenceInGallery(account.account);
+      },
+    );
+  });
+}

libs/ledger-live-common/.unimportedrc.json

@@ -311,6 +311,7 @@
     "src/deviceSDK/commands/getAppAndVersion.ts",
     "src/deviceSDK/tasks/genuineCheck.ts",
     "src/e2e/enum/Account.ts",
+    "src/e2e/enum/Nft.ts",
     "src/e2e/enum/AccountType.ts",
     "src/e2e/enum/AppInfos.ts",
     "src/e2e/enum/Currency.ts",