ci(bridge): run e2e tests with Playwright

Replace the Cypress GitHub Action with a Playwright run (start app, wait, then
`pnpm test:e2e <spec>`, orbit variants via env), update the spec matrix to
Playwright filenames, and drop the unused cctp.json.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: fionnachan

.github/workflows/e2e-tests.yml

@@ -81,8 +81,8 @@ jobs:
       - name: Restore build artifacts
         uses: ./.github/actions/restore-build-artifacts
 
-      - name: Install cypress
-        run: pnpm cypress install
+      - name: Install Playwright chromium
+        run: pnpm --filter arb-token-bridge-ui exec playwright install --with-deps chromium
 
       - name: Install linux dependencies
         run: |
@@ -115,25 +115,20 @@ jobs:
               ''
             }}
 
-      - name: Run e2e tests via cypress-io/github-action
-        uses: cypress-io/github-action@0da3c06ed8217b912deea9d8ee69630baed1737e # pin@v6.7.6
-        with:
-          start: pnpm start
-          command: >-
-            ${{
-              (matrix.test.type == 'orbit-eth') && 'pnpm test:e2e:orbit' ||
-              (matrix.test.type == 'orbit-custom-6dec' && 'pnpm test:e2e:orbit:custom-gas-token') ||
-              (matrix.test.type == 'orbit-custom-18dec' && 'pnpm test:e2e:orbit:custom-gas-token') ||
-              (matrix.test.type == 'orbit-custom-20dec' && 'pnpm test:e2e:orbit:custom-gas-token') ||
-              (matrix.test.type == 'cctp' && 'pnpm test:e2e:cctp') ||
-              'pnpm test:e2e'
-            }}
-          wait-on: http://127.0.0.1:3000
-          wait-on-timeout: 120
-          spec: ./packages/arb-token-bridge-ui/tests/e2e/specs/*
+      - name: Run e2e tests (Playwright)
+        run: |
+          pnpm start &
+          npx --yes wait-on http://127.0.0.1:3000 --timeout 120000
+          ${{
+            (matrix.test.type == 'cctp') && 'pnpm test:e2e:cctp' ||
+            format('pnpm test:e2e {0}', matrix.test.file)
+          }}
         env:
           DISPLAY: :0.0
-          TEST_FILE: ${{ matrix.test.file }}
+          E2E_ORBIT: ${{ matrix.test.type == 'orbit-eth' }}
+          E2E_ORBIT_CUSTOM_GAS_TOKEN: ${{ startsWith(matrix.test.type, 'orbit-custom') }}
+          ORBIT_CUSTOM_GAS_TOKEN: ${{ startsWith(matrix.test.type, 'orbit-custom') }}
+          METAMASK_VERSION: 11.15.0
           SKIP_METAMASK_SETUP: true
           CYPRESS_RECORD_VIDEO: ${{ matrix.test.recordVideo }}
           PRIVATE_KEY_CUSTOM: ${{ secrets.E2E_PRIVATE_KEY }}
@@ -153,8 +148,8 @@ jobs:
         with:
           name: e2e-artifacts-${{ github.sha }}-${{ matrix.test.name }}-${{ matrix.test.type }}
           path: |
-            ./packages/arb-token-bridge-ui/cypress/videos
-            ./packages/arb-token-bridge-ui/cypress/screenshots
+            ./packages/arb-token-bridge-ui/test-results
+            ./packages/arb-token-bridge-ui/playwright-report
           if-no-files-found: 'ignore'
         continue-on-error: true
 

.github/workflows/formatSpecfiles.js

@@ -1,6 +1,5 @@
 #!/usr/bin/env node
 const specFiles = require('../../packages/arb-token-bridge-ui/tests/e2e/specfiles.json');
-const cctpFiles = require('../../packages/arb-token-bridge-ui/tests/e2e/cctp.json');
 
 const tests = [];
 
@@ -41,7 +40,7 @@ switch (testType) {
     tests.push({
       name: 'cctp',
       typeName: '',
-      file: 'tests/e2e/specs/**/*Cctp.cy.{js,jsx,ts,tsx}',
+      file: '*Cctp.spec.ts',
       recordVideo: false,
       type: 'cctp',
     });

packages/arb-token-bridge-ui/tests/e2e/cctp.json

@@ -1,67 +1,15 @@
 [
-  {
-    "name": "Login and balance check",
-    "file": "tests/e2e/specs/**/login.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Deposit native token",
-    "file": "tests/e2e/specs/**/depositNativeToken.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Withdraw native token",
-    "file": "tests/e2e/specs/**/withdrawNativeToken.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Deposit ERC20",
-    "file": "tests/e2e/specs/**/depositERC20.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Withdraw ERC20",
-    "file": "tests/e2e/specs/**/withdrawERC20.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Batch deposit",
-    "file": "tests/e2e/specs/**/batchDeposit.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "TX history",
-    "file": "tests/e2e/specs/**/txHistory.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Approve ERC20",
-    "file": "tests/e2e/specs/**/approveToken.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Import test ERC20",
-    "file": "tests/e2e/specs/**/importToken.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Read classic deposits",
-    "file": "tests/e2e/specs/**/readClassicDeposits.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Redeem Retryable",
-    "file": "tests/e2e/specs/**/redeemRetryable.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "Switch network",
-    "file": "tests/e2e/specs/**/switchNetworks.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  },
-  {
-    "name": "URL query param",
-    "file": "tests/e2e/specs/**/urlQueryParam.cy.{js,jsx,ts,tsx}",
-    "recordVideo": "false"
-  }
+  { "name": "Login and balance check", "file": "login.spec.ts" },
+  { "name": "Deposit native token", "file": "depositNativeToken.spec.ts" },
+  { "name": "Withdraw native token", "file": "withdrawNativeToken.spec.ts" },
+  { "name": "Deposit ERC20", "file": "depositERC20.spec.ts" },
+  { "name": "Withdraw ERC20", "file": "withdrawERC20.spec.ts" },
+  { "name": "Batch deposit", "file": "batchDeposit.spec.ts" },
+  { "name": "TX history", "file": "txHistory.spec.ts" },
+  { "name": "Approve ERC20", "file": "approveToken.spec.ts" },
+  { "name": "Import test ERC20", "file": "importToken.spec.ts" },
+  { "name": "Read classic deposits", "file": "readClassicDeposits.spec.ts" },
+  { "name": "Redeem Retryable", "file": "redeemRetryable.spec.ts" },
+  { "name": "Switch network", "file": "switchNetworks.spec.ts" },
+  { "name": "URL query param", "file": "urlQueryParam.spec.ts" }
 ]