Merge pull request #14 from argentlabs/ax0-tests-sign-and-tx

chore: add argent-x tests for signMessage and transaction

.github/workflows/pull-request.yml

@@ -147,6 +147,7 @@ jobs:
       E2E_REPO_TOKEN: ${{ secrets.E2E_REPO_TOKEN }}
       E2E_REPO_OWNER: ${{ secrets.E2E_REPO_OWNER }}
       E2E_REPO_RELEASE_NAME: ${{ secrets.E2E_REPO_RELEASE_NAME }}
+      E2E_TESTNET_SEED3: ${{ secrets.E2E_TESTNET_SEED3 }}
 
     steps:
       - uses: actions/checkout@v4

e2e/package.json

@@ -30,7 +30,7 @@
     "uuid": "^11.0.0"
   },
   "scripts": {
-    "test:argentx": "pnpm playwright test --project=ArgentX",
+    "test:argentx": "DONWNLOAD_ARGENTX_BUILD=1 pnpm playwright test --project=ArgentX",
     "test:webwallet": "pnpm playwright test --project=WebWallet"
   },
   "dependencies": {

e2e/playwright.config.ts

@@ -45,6 +45,7 @@ const playwrightConfig: PlaywrightTestConfig = {
   outputDir: config.artifactsDir,
   preserveOutput: "failures-only",
   globalTeardown: "./src/shared/cfg/global.teardown.ts",
+  globalSetup: "./src/shared/cfg/global.setup.ts",
 }
 
 export default playwrightConfig

e2e/src/argent-x/languages/en/index.ts

@@ -157,6 +157,18 @@ const texts = {
     extendedView: "Extended view",
     lockWallet: "Lock wallet",
   },
+  sign: {
+    accept: "Sign",
+    reject: "Reject",
+  },
+  transaction: {
+    accept: "Confirm",
+    reject: "Reject",
+  },
+  network: {
+    addNetwork: "Add Network",
+    switchNetwork: "Switch network",
+  },
 } as const
 
 export default texts

e2e/src/argent-x/page-objects/Dapps.ts

@@ -2,13 +2,14 @@ import { ChromiumBrowserContext, Page, expect } from "@playwright/test"
 
 import { lang } from "../languages"
 import Navigation from "./Navigation"
-import config from "../../../config"
 
 const dappUrl = "http://localhost:3000"
-const dappName = 'localhost'
+const dappName = "localhost"
 export default class Dapps extends Navigation {
+  private dApp: Page
   constructor(page: Page) {
     super(page)
+    this.dApp = page
   }
 
   account(accountName: string) {
@@ -18,11 +19,11 @@ export default class Dapps extends Navigation {
   connectedDapps(accountName: string, nbrConnectedDapps: number) {
     return nbrConnectedDapps > 1
       ? this.page.locator(
-        `[data-testid="${accountName}"]:has-text("${nbrConnectedDapps} dapps connected")`,
-      )
+          `[data-testid="${accountName}"]:has-text("${nbrConnectedDapps} dapps connected")`,
+        )
       : this.page.locator(
-        `[data-testid="${accountName}"]:has-text("${nbrConnectedDapps} dapp connected")`,
-      )
+          `[data-testid="${accountName}"]:has-text("${nbrConnectedDapps} dapp connected")`,
+        )
   }
 
   get noConnectedDapps() {
@@ -59,99 +60,126 @@ export default class Dapps extends Navigation {
     )
   }
 
-  get knownDappButton() {
-    return this.page.locator('[data-testid="KnownDappButton"]')
-  }
-
-  async ensureKnowDappText() {
-    return Promise.all([
-      expect(this.page.locator('h4:text-is("Known Dapp")')).toBeVisible(),
-      expect(
-        this.page.locator('p:text-is("This dapp is listed on Dappland")'),
-      ).toBeVisible(),
-    ])
-  }
-  async requestConnectionFromDapp(
-    { browserContext,
-      useStarknetKitModal = false }:
-      {
-        browserContext: ChromiumBrowserContext,
-        useStarknetKitModal?: boolean
-      }
-  ) {
+  async requestConnectionFromDapp({
+    browserContext,
+    useStarknetKitModal = false,
+  }: {
+    browserContext: ChromiumBrowserContext
+    useStarknetKitModal?: boolean
+  }) {
     //open dapp page
-    const dapp = await browserContext.newPage()
-    await dapp.setViewportSize({ width: 1080, height: 720 })
-    await dapp.goto("chrome://inspect/#extensions")
-    await dapp.waitForTimeout(1000)
-    await dapp.goto(dappUrl)
+    this.dApp = await browserContext.newPage()
+    await this.dApp.setViewportSize({ width: 1080, height: 720 })
+    await this.dApp.goto("chrome://inspect/#extensions")
+    await this.dApp.waitForTimeout(1000)
+    await this.dApp.goto(dappUrl)
 
-    await dapp.getByRole('button', { name: 'Connection' }).click()
+    await this.dApp.getByRole("button", { name: "Connection" }).click()
     if (useStarknetKitModal) {
-      await dapp.getByRole('button', { name: 'Starknetkit Modal' }).click()
-      await dapp.locator('#starknetkit-modal-container').getByRole('button', { name: 'Argent X Argent X' }).click()
+      await this.dApp.getByRole("button", { name: "Starknetkit Modal" }).click()
+      await this.dApp
+        .locator("#starknetkit-modal-container")
+        .getByRole("button", { name: "Argent X" })
+        .click()
     } else {
-      await expect(dapp.locator('button :text-is("Argent X")')).toBeVisible()
+      await expect(
+        this.dApp.locator('button :text-is("Argent X")'),
+      ).toBeVisible()
     }
-    await dapp.locator('button :text-is("Argent X")').click()
-    return dapp
-  }
 
-  async claimSpok(browserContext: ChromiumBrowserContext) {
-    const spokCampaignUrl = config.spokCampaignUrl! || ''
-    //open dapp page
-    const dapp = await browserContext.newPage()
-    await dapp.setViewportSize({ width: 1080, height: 720 })
-    await dapp.goto("chrome://inspect/#extensions")
-    await dapp.waitForTimeout(1000)
-    await dapp.goto(spokCampaignUrl)
-    await dapp.getByRole("button", { name: "Check eligibility" }).click()
-    await expect(dapp.locator("text=Argent X")).toBeVisible()
-    await dapp.locator("text=Argent X").click()
-    return dapp
+    await this.dApp.locator('button :text-is("Argent X")').click()
   }
 
-  checkCriticalRiskConnectionScreen() {
-    return Promise.all([
-      expect(
-        this.page.locator(
-          `//span[text()="Critical risk"]/following-sibling::label[text()="Use of a blacklisted domain"]`,
-        ),
-      ).toBeVisible(),
-      expect(
-        this.page.locator(
-          `//p[@data-testid="review-footer" and text()="Please review warnings before continuing"]`,
-        ),
-      ).toBeVisible(),
-      expect(this.page.getByRole("button", { name: "Connect" })).toBeDisabled(),
+  async sendERC20transaction({
+    browserContext,
+    type,
+  }: {
+    browserContext: ChromiumBrowserContext
+    type: "ERC20" | "Multicall"
+  }) {
+    const [extension, dappPage] = browserContext.pages()
+    const dialogPromise = this.dApp.waitForEvent("dialog")
+
+    dappPage.bringToFront()
+
+    // avoid too many requests in a short time, causing user to reject
+    await this.dApp.waitForTimeout(2500)
+    await this.dApp.locator('button :text-is("Transactions")').click()
+    await this.dApp.waitForTimeout(2500)
+    await this.dApp.locator(`button :text-is("Send ${type}")`).click()
+
+    await expect(extension.getByText("Review transaction")).toBeVisible()
+    await expect(extension.getByText("Confirm")).toBeVisible()
+    const [, dialog] = await Promise.all([
+      extension.getByText("Confirm").click(),
+      dialogPromise,
     ])
+
+    expect(dialog.message()).toContain("Transaction sent")
+    await dialog.accept()
   }
 
-  async acceptCriticalRiskConnection() {
-    await this.page.getByRole("button", { name: "Review" }).click()
+  async signMessage({
+    browserContext,
+  }: {
+    browserContext: ChromiumBrowserContext
+  }) {
+    const [extension, dappPage] = browserContext.pages()
+
+    dappPage.bringToFront()
+
+    await this.dApp.locator('button :text-is("Signing")').click()
+    await this.dApp.locator("[name=short-text]").fill("some message to sign")
+    await this.dApp.locator('button[type="submit"]').click()
+
+    extension.bringToFront()
+    await this.page.locator(`button:text-is("${lang.sign.accept}")`).click()
+    dappPage.bringToFront()
+
     await Promise.all([
-      expect(
-        this.page.locator(`//header[@title="1 risk identified"]`),
-      ).toBeVisible(),
-      expect(
-        this.page.locator(
-          '//label[text()="We strongly recommend you do not proceed with this transaction"]',
-        ),
-      ).toBeVisible(),
-      expect(
-        this.page.locator(
-          '//span[text()="Critical risk"]/following-sibling::span[text()="Use of a blacklisted domain"]/following-sibling::p[text()="You are currently on an unsafe domain. Be aware of the risks."]',
-        ),
-      ).toBeVisible(),
+      expect(this.dApp.getByText("Signer", { exact: true })).toBeVisible(),
+      expect(this.dApp.locator("[name=signer_r]")).toBeVisible(),
+      expect(this.dApp.locator("[name=signer_s]")).toBeVisible(),
     ])
-    await this.page.getByRole("button", { name: "Accept risk" }).click()
   }
 
-  async connectedDappsTooltip(dappUrl: string) {
-    await this.showSettingsLocator.click()
-    await this.page.hover('[data-testid="connected-dapp"]')
-    await expect(
-      this.page.locator('[data-testid="connected-dapp"]'),
-    ).toHaveText(`Connected to ${dappUrl}`)
+  async network({
+    browserContext,
+    type,
+  }: {
+    browserContext: ChromiumBrowserContext
+    type: "Add" | "Change"
+  }) {
+    const [extension, dappPage] = browserContext.pages()
+    dappPage.bringToFront()
+    await this.dApp.locator('button :text-is("Network")').click()
+    await this.dApp.locator(`button :text-is("${type} Network")`).click()
+
+    extension.bringToFront()
+    await this.dApp.waitForTimeout(1000)
+    await this.page
+      .locator(
+        `button:text-is("${type === "Add" ? lang.network.addNetwork : lang.network.switchNetwork}")`,
+      )
+      .click()
+
+    if (type === "Change") {
+      await this.accept.click()
+    }
+  }
+
+  async addToken({
+    browserContext,
+  }: {
+    browserContext: ChromiumBrowserContext
+  }) {
+    const [extension, dappPage] = browserContext.pages()
+    dappPage.bringToFront()
+    await this.dApp.locator('button :text-is("ERC20")').click()
+    await this.dApp.locator(`button :text-is("Add Token")`).click()
+
+    extension.bringToFront()
+    await this.dApp.waitForTimeout(1000)
+    await this.page.locator(`button:text-is("Add token")`).click()
   }
 }

e2e/src/argent-x/page-objects/Network.ts

@@ -34,7 +34,7 @@ export default class Network extends Navigation {
   }
 
   get networkSelector() {
-    return this.page.getByLabel("Show account list")
+    return this.page.locator(`[aria-label="Show account list"]`)
   }
 
   networkOption(name: string) {
@@ -62,6 +62,11 @@ export default class Network extends Navigation {
     }
   }
 
+  async openNetworkSelector() {
+    await this.networkSelector.click()
+    await this.page.locator('[data-testid="network-switcher-button"]').click()
+  }
+
   async ensureAvailableNetworks(networks: string[]) {
     await this.networkSelector.click()
     await this.page.locator('[data-testid="network-switcher-button"]').click()

e2e/src/argent-x/specs/connect.spec.ts

@@ -0,0 +1,45 @@
+import { expect } from "@playwright/test"
+
+import test from "../test"
+import config from "../../../config"
+
+test.describe("Connect", () => {
+
+  for (const useStarknetKitModal of [true, false] as const) {
+    test(`connect from testDapp using starknetKitModal ${useStarknetKitModal}`, async ({
+      extension,
+      browserContext,
+    }) => {
+      //setup wallet
+      await extension.open()
+      await extension.recoverWallet(config.testSeed3!)
+      await expect(extension.network.networkSelector).toBeVisible()
+      await extension.network.selectDefaultNetwork()
+
+      await extension.dapps.requestConnectionFromDapp({
+        browserContext,
+        useStarknetKitModal,
+      })
+
+      //accept connection from Argent X
+      await extension.dapps.accept.click()
+      //check connect dapps
+      await extension.navigation.showSettingsLocator.click()
+      await extension.settings.account(extension.account.accountName1).click()
+      await extension.page
+        .getByRole("button", { name: "Connected dapps" })
+        .click()
+
+      await expect(extension.dapps.connected()).toBeVisible()
+      //disconnect dapp from Argent X
+      await extension.dapps.disconnect().click()
+      await expect(extension.dapps.connected()).toBeHidden()
+      await extension.page
+        .getByRole("button", { name: "Connected dapps" })
+        .click()
+      await expect(
+        extension.page.getByRole("heading", { name: "No authorised dapps" }),
+      ).toBeVisible()
+    })
+  }
+})