[explorer] Migrate end-to-end tests to Playwright (MystenLabs#7116)

.github/workflows/e2e.yml

@@ -15,34 +15,6 @@ jobs:
         uses: "./.github/actions/diffs"
         id: diff
 
-  static:
-    name: Static (Explorer)
-    needs: diff
-    if: needs.diff.outputs.isExplorer == 'true'
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@7dd9e2a3dc350cf687eb1b2a4fadfee8c8e49675 # pin@v3
-      - uses: pnpm/action-setup@c3b53f6a16e57305370b4ae5a540c2077a1d50dd # pin@v2.2.4
-        with:
-          version: 7
-      - name: Install Nodejs
-        uses: actions/setup-node@8c91899e586c5b171469028077307d293428b516 # pin@v3
-        with:
-          node-version: "18"
-          cache: "pnpm"
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-      - name: Install Cypress
-        run: pnpm explorer exec cypress install
-      - name: Run e2e tests
-        uses: cypress-io/github-action@19ae4d7502bfdedf2a3c47961e02ea209aad367b # pin@v5
-        with:
-          install: false
-          start: pnpm dev:static
-          working-directory: ./apps/explorer
-          spec: cypress/e2e/static/*
-
   localnet:
     name: Localnet
     needs: diff
@@ -63,23 +35,21 @@ jobs:
           cache: "pnpm"
       - name: Install dependencies
         run: pnpm install --frozen-lockfile
-      - name: Install Cypress
-        run: pnpm explorer exec cypress install
-
+      - name: Install Playwright Browsers
+        run: pnpm dlx playwright install --with-deps chromium
       - name: Run TS SDK e2e tests
         if: ${{ needs.diff.outputs.isTypescriptSDK == 'true' }}
         run: pnpm dlx concurrently --kill-others --success command-1 'RUST_LOG="consensus=off" cargo run --bin sui-test-validator' 'pnpm sdk test:e2e'
 
       - name: Run Explorer e2e tests
         if: ${{ needs.diff.outputs.isExplorer == 'true' }}
-        uses: cypress-io/github-action@19ae4d7502bfdedf2a3c47961e02ea209aad367b # pin@v5
+        run: pnpm explorer playwright test
+      - uses: actions/upload-artifact@v3
+        if: always()
         with:
-          install: false
-          start: pnpm dlx concurrently --kill-others 'cargo run --bin sui-test-validator' 'pnpm dev'
-          working-directory: ./apps/explorer
-          spec: cypress/e2e/localnet/*
-          wait-on: "pnpm test:wait-on"
-          wait-on-timeout: 120
+          name: playwright-report
+          path: apps/explorer/playwright-report/
+          retention-days: 30
 
   devnet:
     name: Devnet

.vscode/extensions.json

@@ -2,6 +2,7 @@
   "recommendations": [
     "move.move-analyzer",
     "rust-lang.rust-analyzer",
-    "esbenp.prettier-vscode"
+    "esbenp.prettier-vscode",
+    "ms-playwright.playwright"
   ]
 }

apps/explorer/.gitignore

@@ -19,5 +19,6 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-cypress/screenshots
-cypress/videos
+/test-results/
+/playwright-report/
+/playwright/.cache/

apps/explorer/.prettierignore

@@ -1,5 +1,6 @@
 build/
 coverage/
+playwright-report/
 package-lock.json
 npm-debug.log*
 yarn-debug.log*

apps/explorer/README.md

@@ -49,16 +49,10 @@ Start validators locally:
 cargo run --bin sui-test-validator
 ```
 
-In a a separate terminal, start explorer:
+In a a separate terminal, you can now run the end-to-end tests:
 
 ```bash
-pnpm explorer dev
-```
-
-In a separate terminal, run cypress locally, this should open a chrome simulating all tests:
-
-```bash
-pnpm explorer exec cypress open
+pnpm explorer playwright test
 ```
 
 # Other pnpm commands