Merge pull request #5832 from mempool/knorrium/e2e_updates

.github/workflows/ci.yml

@@ -12,7 +12,7 @@ jobs:
         node: ["20", "21"]
         flavor: ["dev", "prod"]
       fail-fast: false
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
 
     name: Backend (${{ matrix.flavor }}) - node ${{ matrix.node }}
     steps:
@@ -66,7 +66,7 @@ jobs:
 
   cache:
     name: "Cache assets for builds"
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v3
@@ -163,7 +163,7 @@ jobs:
         node: ["20", "21"]
         flavor: ["dev", "prod"]
       fail-fast: false
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
 
     name: Frontend (${{ matrix.flavor }}) - node ${{ matrix.node }}
     steps:
@@ -246,7 +246,7 @@ jobs:
   
   e2e:
     if: "!contains(github.event.pull_request.labels.*.name, 'ops') && !contains(github.head_ref, 'ops/')"
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     needs: frontend
     strategy:
       fail-fast: false
@@ -309,7 +309,7 @@ jobs:
           tag: ${{ github.event_name }}
           working-directory: ${{ matrix.module }}/frontend
           build: npm run config:defaults:${{ matrix.module }}
-          start: npm run start:local-staging
+          start: npm run start:parameterized
           wait-on: "http://localhost:4200"
           wait-on-timeout: 120
           record: true
@@ -334,7 +334,7 @@ jobs:
           tag: ${{ github.event_name }}
           working-directory: ${{ matrix.module }}/frontend
           build: npm run config:defaults:${{ matrix.module }}
-          start: npm run start:local-staging
+          start: npm run start:parameterized
           wait-on: "http://localhost:4200"
           wait-on-timeout: 120
           record: true
@@ -359,7 +359,7 @@ jobs:
           tag: ${{ github.event_name }}
           working-directory: ${{ matrix.module }}/frontend
           build: npm run config:defaults:mempool
-          start: npm run start:local-staging
+          start: npm run start:parameterized
           wait-on: "http://localhost:4200"
           wait-on-timeout: 120
           record: true
@@ -378,7 +378,7 @@ jobs:
 
   validate_docker_json:
     if: "!contains(github.event.pull_request.labels.*.name, 'ops') && !contains(github.head_ref, 'ops/')"
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     name: Validate generated backend Docker JSON
 
     steps: 

.github/workflows/docker_update_latest_tag.yml

@@ -15,7 +15,7 @@ jobs:
         service:
           - frontend
           - backend
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v4

.github/workflows/e2e_parameterized.yml

@@ -0,0 +1,154 @@
+name: 'Parameterized e2e tests'
+
+on:
+  workflow_dispatch:
+    inputs:
+      mempool_hostname:
+        description: 'Mempool Hostname'
+        required: true
+        default: 'mempool.space'
+        type: string 
+      liquid_hostname:
+        description: 'Liquid Hostname'
+        required: true
+        default: 'liquid.network'
+        type: string 
+
+jobs:
+  e2e:
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        module: ["mempool", "liquid", "testnet4"]
+
+    name: E2E tests for ${{ matrix.module }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          path: ${{ matrix.module }}
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: "npm"
+          cache-dependency-path: ${{ matrix.module }}/frontend/package-lock.json
+
+      - name: Restore cached mining pool assets
+        continue-on-error: true
+        id: cache-mining-pool-restore
+        uses: actions/cache/restore@v4
+        with:
+          path: |
+            mining-pool-assets.zip
+          key: mining-pool-assets-cache
+
+      - name: Restore cached promo video assets
+        continue-on-error: true
+        id: cache-promo-video-restore
+        uses: actions/cache/restore@v4
+        with:
+          path: |
+            promo-video-assets.zip
+          key: promo-video-assets-cache
+
+      - name: Download artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: mining-pool-assets
+
+      - name: Unzip assets before building (src/resources)
+        run: unzip -o mining-pool-assets.zip -d ${{ matrix.module }}/frontend/src/resources/mining-pools
+
+      - name: Download artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: promo-video-assets
+
+      - name: Unzip assets before building (src/resources)
+        run: unzip -o promo-video-assets.zip -d ${{ matrix.module }}/frontend/src/resources/promo-video
+
+    # mempool
+      - name: Chrome browser tests (${{ matrix.module }})
+        if: ${{ matrix.module == 'mempool' }}
+        uses: cypress-io/github-action@v5
+        with:
+          tag: ${{ github.event_name }}
+          working-directory: ${{ matrix.module }}/frontend
+          build: npm run config:defaults:${{ matrix.module }}
+          start: npm run start:ci-parameterized
+          wait-on: "http://localhost:4200"
+          wait-on-timeout: 120
+          record: true
+          parallel: true
+          spec: |
+            cypress/e2e/mainnet/*.spec.ts
+            cypress/e2e/signet/*.spec.ts
+          group: Tests on Chrome (${{ matrix.module }})
+          browser: "chrome"
+          ci-build-id: "${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}"
+        env:
+          COMMIT_INFO_MESSAGE: ${{ github.event_name }} (${{ github.sha }}) - ${{ github.event.inputs.mempool_hostname }} - ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_HOSTNAME: ${{ github.event.inputs.mempool_hostname }}
+          LIQUID_HOSTNAME: ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_CI_API_KEY: ${{ secrets.MEMPOOL_CI_API_KEY }}
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CYPRESS_PROJECT_ID: ${{ secrets.CYPRESS_PROJECT_ID }}
+
+      # liquid
+      - name: Chrome browser tests (${{ matrix.module }})
+        if: ${{ matrix.module == 'liquid' }}
+        uses: cypress-io/github-action@v5
+        with:
+          tag: ${{ github.event_name }}
+          working-directory: ${{ matrix.module }}/frontend
+          build: npm run config:defaults:${{ matrix.module }}
+          start: npm run start:ci-parameterized
+          wait-on: "http://localhost:4200"
+          wait-on-timeout: 120
+          record: true
+          parallel: true
+          spec: |
+            cypress/e2e/liquid/liquid.spec.ts
+            cypress/e2e/liquidtestnet/liquidtestnet.spec.ts
+          group: Tests on Chrome (${{ matrix.module }})
+          browser: "chrome"
+          ci-build-id: "${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}"
+        env:
+          COMMIT_INFO_MESSAGE: ${{ github.event_name }} (${{ github.sha }}) - ${{ github.event.inputs.mempool_hostname }} - ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_HOSTNAME: ${{ github.event.inputs.mempool_hostname }}
+          LIQUID_HOSTNAME: ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_CI_API_KEY: ${{ secrets.MEMPOOL_CI_API_KEY }}
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CYPRESS_PROJECT_ID: ${{ secrets.CYPRESS_PROJECT_ID }}
+
+      # testnet
+      - name: Chrome browser tests (${{ matrix.module }})
+        if: ${{ matrix.module == 'testnet4' }}
+        uses: cypress-io/github-action@v5
+        with:
+          tag: ${{ github.event_name }}
+          working-directory: ${{ matrix.module }}/frontend
+          build: npm run config:defaults:mempool
+          start: npm run start:ci-parameterized
+          wait-on: "http://localhost:4200"
+          wait-on-timeout: 120
+          record: true
+          parallel: true
+          spec: |
+            cypress/e2e/testnet4/*.spec.ts
+          group: Tests on Chrome (${{ matrix.module }})
+          browser: "chrome"
+          ci-build-id: "${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}"
+        env:
+          COMMIT_INFO_MESSAGE: ${{ github.event_name }} (${{ github.sha }}) - ${{ github.event.inputs.mempool_hostname }} - ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_HOSTNAME: ${{ github.event.inputs.mempool_hostname }}
+          LIQUID_HOSTNAME: ${{ github.event.inputs.liquid_hostname }}
+          MEMPOOL_CI_API_KEY: ${{ secrets.MEMPOOL_CI_API_KEY }}
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CYPRESS_PROJECT_ID: ${{ secrets.CYPRESS_PROJECT_ID }}

.github/workflows/get_backend_block_height.yml

@@ -4,7 +4,7 @@ on: [workflow_dispatch]
 
 jobs:
   print-backend-sha:
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     name: Get block height
     steps:
       - name: Checkout

.github/workflows/get_backend_hash.yml

@@ -4,7 +4,7 @@ on: [workflow_dispatch]
 
 jobs:
   print-backend-sha:
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     name: Print backend hashes
     steps:
       - name: Checkout

.github/workflows/get_image_digest.yml

@@ -10,7 +10,7 @@ on:
         type: string 
 jobs:
   print-images-sha:
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     name: Print digest for images
     steps:
       - name: Checkout

.github/workflows/on-tag.yml

@@ -21,7 +21,7 @@ jobs:
         service:
           - frontend
           - backend
-    runs-on: mempool-ci
+    runs-on: ubuntu-latest
     timeout-minutes: 120
     name: Build and push to DockerHub
     steps:

frontend/angular.json

@@ -261,20 +261,14 @@
               "proxyConfig": "proxy.conf.mixed.js",
               "verbose": true
             },
-            "staging": {
-              "proxyConfig": "proxy.conf.js",
-              "disableHostCheck": true,
-              "host": "0.0.0.0",
-              "verbose": true
-            },
             "local-prod": {
               "proxyConfig": "proxy.conf.js",
               "disableHostCheck": true,
               "host": "0.0.0.0",
               "verbose": false
             },
-            "local-staging": {
-              "proxyConfig": "proxy.conf.staging.js",
+            "parameterized": {
+              "proxyConfig": "proxy.conf.parameterized.js",
               "disableHostCheck": true,
               "host": "0.0.0.0",
               "verbose": false
@@ -371,4 +365,4 @@
       }
     }
   }
-}
+}

frontend/cypress/e2e/mainnet/mainnet.spec.ts

@@ -496,7 +496,7 @@ describe('Mainnet', () => {
     });
 
     describe('RBF transactions', () => {
-      it('shows RBF transactions properly (mobile)', () => {
+      it('shows RBF transactions properly (mobile - details)', () => {
         cy.intercept('/api/v1/tx/21518a98d1aa9df524865d2f88c578499f524eb1d0c4d3e70312ab863508692f/cached', {
           fixture: 'mainnet_tx_cached.json'
         }).as('cached_tx');
@@ -507,7 +507,7 @@ describe('Mainnet', () => {
 
         cy.viewport('iphone-xr');
         cy.mockMempoolSocket();
-        cy.visit('/tx/21518a98d1aa9df524865d2f88c578499f524eb1d0c4d3e70312ab863508692f');
+        cy.visit('/tx/21518a98d1aa9df524865d2f88c578499f524eb1d0c4d3e70312ab863508692f?mode=details');
 
         cy.waitForSkeletonGone();
 
@@ -525,7 +525,7 @@ describe('Mainnet', () => {
           }
         });
 
-        cy.get('.alert-replaced').should('be.visible');
+        cy.get('.alert-mempool').should('be.visible');
       });
 
       it('shows RBF transactions properly (desktop)', () => {

frontend/package.json

@@ -25,14 +25,12 @@
     "i18n-extract-from-source": "npm run ng -- extract-i18n --out-file ./src/locale/messages.xlf",
     "i18n-pull-from-transifex": "tx pull -a --parallel --minimum-perc 1 --force",
     "serve": "npm run generate-config && npm run ng -- serve -c local",
-    "serve:stg": "npm run generate-config && npm run ng -- serve -c staging",
     "serve:local-prod": "npm run generate-config && npm run ng -- serve -c local-prod",
-    "serve:local-staging": "npm run generate-config && npm run ng -- serve -c local-staging",
+    "serve:parameterized": "npm run generate-config && npm run ng -- serve -c parameterized",
     "start": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c local",
+    "start:parameterized": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c parameterized",
     "start:local-esplora": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c local-esplora",
-    "start:stg": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c staging",
     "start:local-prod": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c local-prod",
-    "start:local-staging": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c local-staging",
     "start:mixed": "npm run generate-config && npm run sync-assets-dev && npm run ng -- serve -c mixed",
     "build": "npm run generate-config && npm run ng -- build --configuration production --localize && npm run sync-assets-dev && npm run sync-assets && npm run build-mempool.js",
     "sync-assets": "rsync -av ./src/resources ./dist/mempool/browser && node sync-assets.js 'dist/mempool/browser/resources/'",
@@ -58,8 +56,8 @@
     "cypress:run:record": "cypress run --record",
     "cypress:open:ci": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:local-prod 4200 cypress:open",
     "cypress:run:ci": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:local-prod 4200 cypress:run:record",
-    "cypress:open:ci:staging": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:local-staging 4200 cypress:open",
-    "cypress:run:ci:staging": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:local-staging 4200 cypress:run:record"
+    "cypress:open:ci:parameterized": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:parameterized 4200 cypress:open",
+    "cypress:run:ci:parameterized": "node update-config.js TESTNET_ENABLED=true TESTNET4_ENABLED=true SIGNET_ENABLED=true LIQUID_ENABLED=true ITEMS_PER_PAGE=25 && npm run generate-config && start-server-and-test serve:parameterized 4200 cypress:run:record"
   },
   "dependencies": {
     "@angular-devkit/build-angular": "^17.3.1",
@@ -123,4 +121,4 @@
   "scarfSettings": {
     "enabled": false
   }
-}
+}

frontend/proxy.conf.parameterized.js

@@ -0,0 +1,36 @@
+const fs = require('fs');
+
+const PROXY_CONFIG = require('./proxy.conf');
+
+const addApiKeyHeader = (proxyReq, req, res) => {
+  if (process.env.MEMPOOL_CI_API_KEY) {
+    proxyReq.setHeader('X-Mempool-Auth', process.env.MEMPOOL_CI_API_KEY);
+  }
+};
+
+PROXY_CONFIG.forEach((entry) => {
+  const mempoolHostname = process.env.MEMPOOL_HOSTNAME
+    ? process.env.MEMPOOL_HOSTNAME
+    : 'mempool.space';
+
+  const liquidHostname = process.env.LIQUID_HOSTNAME
+    ? process.env.LIQUID_HOSTNAME
+    : 'liquid.network';
+
+  entry.target = entry.target.replace('mempool.space', mempoolHostname);
+  entry.target = entry.target.replace('liquid.network', liquidHostname);
+
+  if (entry.onProxyReq) {
+    const originalProxyReq = entry.onProxyReq;
+    entry.onProxyReq = (proxyReq, req, res) => {
+      originalProxyReq(proxyReq, req, res);
+      if (process.env.MEMPOOL_CI_API_KEY) {
+        proxyReq.setHeader('X-Mempool-Auth', process.env.MEMPOOL_CI_API_KEY);
+      }
+    };
+  } else {
+    entry.onProxyReq = addApiKeyHeader;
+  }
+});
+
+module.exports = PROXY_CONFIG;

frontend/proxy.conf.staging.js

@@ -1,12 +0,0 @@
-const fs = require('fs');
-
-let PROXY_CONFIG = require('./proxy.conf');
-
-PROXY_CONFIG.forEach(entry => {
-  const hostname = process.env.CYPRESS_REROUTE_TESTNET === 'true' ? 'mempool-staging.fra.mempool.space' : 'node201.va1.mempool.space';
-  console.log(`e2e tests running against ${hostname}`);
-  entry.target = entry.target.replace("mempool.space", hostname);
-  entry.target = entry.target.replace("liquid.network", "liquid-staging.va1.mempool.space");
-});
-
-module.exports = PROXY_CONFIG;