Deploy 'main' to production

.github/workflows/cf-logs-fetcher.yml

@@ -0,0 +1,23 @@
+name: CF Deployment Logs
+on:
+  issue_comment:                                     
+    types: [created, edited]
+jobs:
+  fetch_comment_log:
+    if: ${{ (github.event.issue.pull_request) && (github.event.comment.user.login == 'cloudflare-pages[bot]' ) }}
+    runs-on: [ubuntu-latest]
+    steps:
+
+      - name: Fetch & Print The Deployment Logs
+        uses: agoric-labs/cf-logs-fetcher@v1
+        with: 
+          cf_account_id: "0c4635effffcd7f36d1b9f0425a4367a"
+          cf_project: "wallet-app"
+          cf_token: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+
+      - name: Comment PR
+        uses: thollander/actions-comment-pull-request@v2
+        with:
+          message: |
+            Cloudflare deployment logs are available [here](${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }})
+          comment_tag: cflogs

.github/workflows/e2e.yml

@@ -0,0 +1,64 @@
+name: E2E Tests
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+  schedule:
+    - cron: '0 0 * * *'
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  e2e:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4 
+
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3 
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Cache Docker layers
+        uses: actions/cache@v4 
+        with:
+          path: /tmp/.buildx-cache
+          key: ${{ runner.os }}-buildx-${{ github.sha }}
+          restore-keys: |
+            ${{ runner.os }}-buildx-
+      - name: Run E2E Tests
+        run: |
+          docker-compose -f test/e2e/docker-compose.yml --profile synpress up --build --exit-code-from synpress
+        env:
+          COMPOSE_DOCKER_CLI_BUILD: 1
+          DOCKER_BUILDKIT: 1
+          DOCKER_DEFAULT_PLATFORM: linux/amd64
+          NGROK_AUTH: ${{ secrets.NGROK_AUTH }}
+          NGROK_BASIC_AUTH: ${{ secrets.NGROK_BASIC_AUTH }}
+          CYPRESS_PRIVATE_KEY_WITH_FUNDS: ${{ secrets.CYPRESS_PRIVATE_KEY_WITH_FUNDS }}
+          ANVIL_FORK_URL: ${{ secrets.ANVIL_FORK_URL }}
+          GH_PAT: ${{ secrets.GH_PAT }}
+          GH_USERNAME: ${{ secrets.GH_USERNAME }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CYPRESS_PROJECT_ID: ${{ secrets.CYPRESS_PROJECT_ID }}
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          COMMIT_INFO_MESSAGE: ${{ github.event.pull_request.title }}
+          COMMIT_INFO_SHA: ${{ github.event.pull_request.head.sha }}
+
+      - name: Upload Artifacts
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: e2e-artifacts
+          path: |
+            test/e2e/cypress/videos
+            test/e2e/cypress/screenshots
+        continue-on-error: true

.gitignore

@@ -58,3 +58,8 @@ packages/ui-components/compiled
 packages/ui-components/dist
 build
 public/wallet
+
+
+# Synpress directories and files
+screenshots
+videos

Dockerfile

@@ -0,0 +1,18 @@
+FROM ghcr.io/agoric/agoric-sdk:latest
+# Add the Agoric CLI to the PATH so that 'agops' can be accessed from anywhere in the command line.
+ENV PATH="/usr/src/agoric-sdk/packages/agoric-cli/bin:${PATH}"
+
+# Install necessary dependencies
+RUN apt-get update \
+    && apt-get install -y wget gnupg ca-certificates jq expect xvfb
+
+# Install Chrome
+RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
+    && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google-chrome.list' \
+    && apt-get update \
+    && apt-get install -y google-chrome-stable
+
+# Setup Wallet App
+WORKDIR /app
+COPY . .
+RUN yarn install --frozen-lockfile

package.json

@@ -21,7 +21,9 @@
     "lint:check": "yarn lint",
     "lint": "yarn lint:types && yarn lint:eslint",
     "lint:types": "tsc -p jsconfig.json",
-    "lint:eslint": "eslint '**/*.js'"
+    "lint:eslint": "eslint '**/*.js'",
+    "test:e2e": "EXTENSION=keplr synpress run --configFile=test/e2e/synpress.config.cjs",
+    "test:e2e:ci": "yarn build && start-server-and-test 'yarn preview' http-get://localhost:3001 'yarn test:e2e'"
   },
   "exports": {
     "./package.json": "./package.json",
@@ -33,6 +35,7 @@
   "devDependencies": {
     "@agoric/eslint-config": "^0.3.21",
     "@agoric/eventual-send": "^0.13.27",
+    "@agoric/synpress": "^3.8.1",
     "@endo/eslint-config": "^0.3.9",
     "@jessie.js/eslint-plugin": "^0.1.3",
     "@material/mwc-dialog": "^0.21.0",
@@ -58,6 +61,7 @@
     "rollup-plugin-summary": "^1.3.0",
     "rollup-plugin-terser": "^7.0.2",
     "ses": "^1.3.0",
+    "start-server-and-test": "^2.0.3",
     "typescript": "^4.2.3"
   },
   "eslintConfig": {

test/e2e/.eslintrc.cjs

@@ -0,0 +1,6 @@
+const path = require('path');
+const synpressPath = path.join(process.cwd(), '/node_modules/@agoric/synpress');
+
+module.exports = {
+  extends: `${synpressPath}/.eslintrc.js`,
+};

test/e2e/docker-compose.yml

@@ -0,0 +1,81 @@
+version: '3.9'
+
+services:
+  synpress:
+    profiles:
+      - synpress
+    container_name: synpress
+    build: ../..
+    environment:
+      - DISPLAY=display:0.0
+      - CYPRESS_PRIVATE_KEY_WITH_FUNDS=${CYPRESS_PRIVATE_KEY_WITH_FUNDS}
+      - DEBUG=${DEBUG}
+      - CYPRESS_DOCKER_RUN=true
+      - GH_PAT=${GH_PAT}
+      - GH_USERNAME=${GH_USERNAME}
+      - CI=${CI}
+      # Cypress Dashboard
+      - CYPRESS_GROUP=${CYPRESS_GROUP}
+      - GITHUB_TOKEN=${GITHUB_TOKEN}
+      - CYPRESS_PROJECT_ID=${CYPRESS_PROJECT_ID}
+      - CYPRESS_RECORD_KEY=${CYPRESS_RECORD_KEY}
+      - COMMIT_INFO_MESSAGE=${COMMIT_INFO_MESSAGE}
+      - COMMIT_INFO_SHA=${COMMIT_INFO_SHA}
+      # CI variables
+      - GITHUB_ACTIONS=${GITHUB_ACTIONS}
+      - GITHUB_WORKFLOW=${GITHUB_WORKFLOW}
+      - GITHUB_ACTION=${GITHUB_ACTION}
+      - GITHUB_EVENT_NAME=${GITHUB_EVENT_NAME}
+      - GITHUB_RUN_ID=${GITHUB_RUN_ID}
+      - GITHUB_RUN_ATTEMPT=${GITHUB_RUN_ATTEMPT}
+      - GITHUB_REPOSITORY=${GITHUB_REPOSITORY}
+      - GH_BRANCH=${GH_BRANCH}
+      - GITHUB_SHA=${GITHUB_SHA}
+      - GITHUB_REF=${GITHUB_REF}
+      - GITHUB_BASE_REF=${GITHUB_BASE_REF}
+      - GITHUB_HEAD_REF=${GITHUB_HEAD_REF}
+      - SECRET_WORDS="orbit bench unit task food shock brand bracket domain regular warfare company announce wheel grape trust sphere boy doctor half guard ritual three ecology"
+    depends_on:
+      - display
+    entrypoint: []
+    working_dir: /app
+    volumes:
+      - ./cypress/videos:/app/test/e2e/videos
+      - ./cypress/screenshots:/app/test/e2e/screenshots
+    command: >
+      bash -c 'echo -n "======> local noVNC URL: http://localhost:8080/vnc.html?autoconnect=true " && yarn wait-on http://display:8080 && echo -n "======> remote noVNC URL: " && curl -s ngrok:4040/api/tunnels | jq -r .tunnels[0].public_url && yarn test:e2e:ci'
+    networks:
+      - x11
+
+  display:
+    profiles:
+      - synpress
+    container_name: display
+    image: synthetixio/display:016121eafdfff448414894d0ca5a50b1d72b62eb-base
+    environment:
+      - RUN_XTERM=no
+      - DISPLAY_WIDTH=1920
+      - DISPLAY_HEIGHT=1080
+    ports:
+      - '8080:8080'
+    networks:
+      - x11
+
+  ngrok:
+    profiles:
+      - ngrok
+    container_name: ngrok
+    image: synthetixio/ngrok:016121eafdfff448414894d0ca5a50b1d72b62eb-base
+    ports:
+      - '4040:4040'
+    command: ['ngrok', 'http', 'display:8080', '--authtoken', '${NGROK_AUTH}']
+    environment:
+      - NGROK_AUTH=${NGROK_AUTH}
+      - NGROK_BASIC_AUTH=${NGROK_BASIC_AUTH}
+    depends_on:
+      - display
+    networks:
+      - x11
+
+networks:
+  x11:

test/e2e/specs/test.spec.js

@@ -0,0 +1,134 @@
+/* eslint-disable ui-testing/no-disabled-tests */
+describe('Wallet App Test Cases', () => {
+  context('Test commands', () => {
+    it(`should connect with Agoric Chain`, () => {
+      cy.visit('/');
+
+      cy.acceptAccess().then((taskCompleted) => {
+        expect(taskCompleted).to.be.true;
+      });
+    });
+
+    it('should connect with keplr wallet and succeed in provisioning a new wallet', () => {
+      cy.visit('/wallet/');
+
+      cy.get('input.PrivateSwitchBase-input').click();
+      cy.contains('Proceed').click();
+
+      cy.get('button[aria-label="Settings"]').click();
+
+      cy.get('#demo-simple-select').click();
+      cy.get('li[data-value="testnet"]').click();
+      cy.contains('button', 'Connect').click();
+
+      cy.acceptAccess().then((taskCompleted) => {
+        expect(taskCompleted).to.be.true;
+      });
+
+      cy.reload();
+
+      cy.acceptAccess().then((taskCompleted) => {
+        expect(taskCompleted).to.be.true;
+      });
+
+      cy.get('span').contains('ATOM').should('exist');
+      cy.get('span').contains('BLD').should('exist');
+    });
+
+    it('should add keys using agd from the CLI successfully', () => {
+      cy.exec('bash ./test/e2e/test-scripts/add-keys.sh').then((result) => {
+        expect(result.stderr).to.contain('');
+        expect(result.stdout).to.contain('Keys added successfully');
+      });
+    });
+
+    it('should place a bid by discount from the CLI successfully', () => {
+      cy.addNewTokensFound();
+      cy.getTokenAmount('IST').then((initialTokenValue) => {
+        cy.exec('bash ./test/e2e/test-scripts/place-bid-by-discount.sh').then(
+          (result) => {
+            expect(result.stderr).to.contain('');
+            expect(result.stdout).to.contain('Your bid has been accepted');
+            cy.getTokenAmount('IST').then((tokenValue) => {
+              expect(tokenValue).to.lessThan(initialTokenValue);
+            });
+          },
+        );
+      });
+    });
+
+    it('should see an offer placed in the previous test case', () => {
+      cy.visit('/wallet/');
+
+      cy.contains('Offer').should('be.visible');
+      cy.contains('Give Bid').should('be.visible');
+      cy.contains('2.00 IST').should('be.visible');
+      cy.contains('from IST').should('be.visible');
+      cy.contains('Arguments').should('be.visible');
+    });
+
+    it('should cancel the bid by discount and verify IST balance', () => {
+      cy.getTokenAmount('IST').then((initialTokenValue) => {
+        cy.visit('/wallet/');
+        cy.get('.Controls .MuiChip-root').contains('Exit').click();
+        cy.acceptAccess().then((taskCompleted) => {
+          expect(taskCompleted).to.be.true;
+        });
+        cy.get('.Body .MuiChip-label')
+          .contains('Accepted', { timeout: 120000 })
+          .should('exist');
+        cy.getTokenAmount('IST').then((tokenValue) => {
+          expect(tokenValue).to.greaterThan(initialTokenValue);
+        });
+      });
+    });
+
+    it('should place a bid by price from the CLI successfully and verify IST balance', () => {
+      cy.getTokenAmount('IST').then((initialTokenValue) => {
+        cy.exec('bash ./test/e2e/test-scripts/place-bid-by-price.sh').then(
+          (result) => {
+            expect(result.stderr).to.contain('');
+            expect(result.stdout).to.contain('Your bid has been accepted');
+            cy.getTokenAmount('IST').then((tokenValue) => {
+              expect(tokenValue).to.lessThan(initialTokenValue);
+            });
+          },
+        );
+      });
+    });
+
+    it('should see an offer placed in the previous test case', () => {
+      cy.visit('/wallet/');
+      cy.contains('Offer').should('be.visible');
+      cy.contains('Give Bid').should('be.visible');
+      cy.contains('1.00 IST').should('be.visible');
+      cy.contains('from IST').should('be.visible');
+      cy.contains('Arguments').should('be.visible');
+    });
+
+    it('should cancel the bid by price and verify IST balance', () => {
+      cy.getTokenAmount('IST').then((initialTokenValue) => {
+        cy.visit('/wallet/');
+        cy.get('.Controls .MuiChip-root').contains('Exit').click();
+        cy.acceptAccess().then((taskCompleted) => {
+          expect(taskCompleted).to.be.true;
+        });
+        cy.get('.Body .MuiChip-label')
+          .contains('Accepted', { timeout: 120000 })
+          .should('exist');
+        cy.getTokenAmount('IST').then((tokenValue) => {
+          expect(tokenValue).to.greaterThan(initialTokenValue);
+        });
+      });
+    });
+
+    it('should view the auction from the CLI successfully', () => {
+      cy.exec('bash ./test/e2e/test-scripts/view-auction.sh', {
+        failOnNonZeroExit: false,
+      }).then((result) => {
+        expect(result.stderr).to.contain('');
+        expect(result.stdout).to.contain('All required fields are present');
+      });
+    });
+  });
+});

test/e2e/synpress.config.cjs

@@ -0,0 +1,14 @@
+const config = require('@agoric/synpress/synpress.config');
+const { defineConfig } = require('cypress');
+
+module.exports = defineConfig({
+  ...config,
+  e2e: {
+    ...config.e2e,
+    baseUrl: 'http://localhost:3001',
+    specPattern: 'test/e2e/specs/**/*spec.{js,jsx,ts,tsx}',
+    supportFile: 'test/support.js',
+    screenshotsFolder: 'test/e2e/screenshots',
+    videosFolder: 'test/e2e/videos'
+  },
+});