feat(e2e-connector-test): CI FE-499 (#399)

Co-authored-by: Luiz Gomes <8636507+LuizAsFight@users.noreply.github.com>
Co-authored-by: LuizAsFight <felipebolsonigomes@gmail.com>

.github/workflows/pr-tests.yml

@@ -7,6 +7,7 @@ on:
   push:
     branches:
       - release
+      - main
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
@@ -40,7 +41,6 @@ jobs:
           name: my-toolchain
           components: forc@${{ env.FORC_VERSION }}, fuel-core@${{ env.CORE_VERSION }}
 
-      # Unit tests running with Vitest
       - name: Find PR number
         uses: jwalton/gh-find-current-pr@v1
         if: ${{ github.event_name == 'pull_request' }}
@@ -76,3 +76,56 @@ jobs:
           working-directory: ./packages/fuelet-wallet
           json-summary-path: ./coverage/coverage-summary.json
           json-final-path: ./coverage/coverage-final.json
+
+  tests-e2e-connectors:
+    runs-on: buildjet-8vcpu-ubuntu-2204
+    steps:
+      - name: Check out the code
+        uses: actions/checkout@v3
+
+      - name: Setup Node
+        uses: FuelLabs/github-actions/setups/node@master
+        with:
+          node-version: 20.11.0
+          pnpm-version: 9.5.0
+
+      - uses: FuelLabs/github-actions/setups/docker@master
+        with:
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Start Test Node
+        run: pnpm node:up
+
+      - name: Run PNPM install
+        id: pnpm-cache
+        run: pnpm install --frozen-lockfile
+
+      - name: Run build:connectors
+        run: pnpm build:connectors
+
+      # E2E tests running with Playwright
+      - name: Install Playwright Browsers
+        run: pnpm exec playwright install --with-deps chromium
+        working-directory: e2e-tests
+
+      - name: Run Playwright tests on Testnet
+        if: ${{ github.ref == 'refs/heads/main' }}
+        run: xvfb-run --auto-servernum -- pnpm --filter e2e-tests test:e2e
+        env:
+          VITE_FUEL_PROVIDER_URL: "https://testnet.fuel.network/v1/graphql"
+          VITE_MASTER_WALLET_MNEMONIC: ${{ secrets.VITE_MASTER_WALLET_MNEMONIC }}
+          VITE_APP_WC_PROJECT_ID: e01471314fc69cc4efba6dce12dfd710
+          VITE_CHAIN_ID_NAME: testnet
+          PORT: 5173
+
+      - name: Run Playwright tests locally for Preview
+        if: ${{ github.event_name == 'pull_request' }}
+        run: xvfb-run --auto-servernum -- pnpm --filter e2e-tests test:e2e
+        env:
+          VITE_FUEL_PROVIDER_URL: "http://localhost:4000/v1/graphql"
+          VITE_WALLET_SECRET: "0xa449b1ffee0e2205fa924c6740cc48b3b473aa28587df6dab12abc245d1f5298"
+          VITE_MASTER_WALLET_MNEMONIC: ${{ secrets.VITE_MASTER_WALLET_MNEMONIC }}
+          VITE_APP_WC_PROJECT_ID: e01471314fc69cc4efba6dce12dfd710
+          VITE_CHAIN_ID_NAME: local
+          PORT: 5173

.gitignore

@@ -30,5 +30,6 @@ yarn-error.log*
 /playwright/.cache/
 /e2e-tests/playwright-report
 .env
+!docker/.env
 /e2e-tests/test-results
 **/*.tgz

docker/.env

@@ -0,0 +1,7 @@
+PROJECT=fuels-wallet
+MIN_GAS_PRICE=1
+WALLET_SECRET=0xa449b1ffee0e2205fa924c6740cc48b3b473aa28587df6dab12abc245d1f5298
+DISPENSE_AMOUNT=2000000
+FUEL_CORE_PORT=4000
+FUEL_FAUCET_PORT=4040
+FUEL_IP=0.0.0.0

docker/Makefile

@@ -0,0 +1,8 @@
+up:
+	docker compose -p dev --env-file .env up -d --build 
+
+down:
+	docker compose -p dev stop
+
+clean:
+	docker compose -p dev down --rmi local -v --remove-orphans

docker/docker-compose.yml

@@ -0,0 +1,47 @@
+version: '3'
+
+services:
+  fuel-core:
+    platform: linux/amd64
+    container_name: '${PROJECT:-fuel-node}_fuel-core'
+    environment:
+      FUEL_IP: ${FUEL_IP}
+      FUEL_CORE_PORT: ${FUEL_CORE_PORT}
+      NETWORK_NAME: '${PROJECT} local'
+      MIN_GAS_PRICE: ${MIN_GAS_PRICE}
+      # This is the private key of the consensus.PoA.signing_key in the chainConfig.json
+      # this key is responsible for validating the transactions
+      CONSENSUS_KEY_SECRET: ${WALLET_SECRET}
+    build: ./fuel-core
+    ports:
+      - '${FUEL_CORE_PORT:-4000}:4000'
+    volumes:
+      - fuel-core-db:/mnt/db
+    healthcheck:
+      test: curl --fail http://localhost:4000/v1/health || exit 1
+      interval: 1s
+      timeout: 5s
+      retries: 20
+
+  faucet:
+    platform: linux/amd64
+    container_name: '${PROJECT:-fuel-node}_faucet'
+    environment:
+      # Other configurations can be found at;
+      # https://github.com/FuelLabs/faucet#configuration
+      MIN_GAS_PRICE: ${MIN_GAS_PRICE}
+      WALLET_SECRET_KEY: ${WALLET_SECRET}
+      DISPENSE_AMOUNT: ${DISPENSE_AMOUNT}
+      FUEL_NODE_URL: http://${PROJECT:-fuel-node}_fuel-core:4000/v1/graphql
+    image: ghcr.io/fuellabs/faucet:4f7bec0
+    ports:
+      - '${FUEL_FAUCET_PORT:-4040}:3000'
+    links:
+      - fuel-core
+    depends_on:
+      fuel-core:
+        condition: service_healthy
+
+volumes:
+  fuel-core-db:
+    name: '${PROJECT:-fuel-node}_fuel-core-db'

docker/fuel-core/Dockerfile

@@ -0,0 +1,50 @@
+# IMPORTANT!
+# Make sure to check:
+# https://github.com/FuelLabs/chain-configuration/tree/master/upgradelog/ignition-devnet
+# and apply the latest state_transition_function and consensus_parameter
+# when upgrading fuel-core
+
+# We should be supporting always the same fuel-core version as the fuels (ts-sdk)
+# https://github.com/FuelLabs/fuels-ts/blob/master/internal/fuel-core/VERSION
+FROM ghcr.io/fuellabs/fuel-core:v0.40.0
+
+# dependencies
+ENV DEBIAN_FRONTEND=noninteractive
+RUN apt update && apt install -y git curl jq && rm -rf /var/lib/apt/lists/*
+
+# copy chain config
+WORKDIR /fuel
+
+COPY ./genesis_coins.json .
+
+RUN git clone \
+    https://github.com/FuelLabs/chain-configuration.git \
+    /chain-configuration && \
+    cd /chain-configuration && \
+    git checkout 0dc0960f14da7b6650b5438dc1e99d7ff7acec73
+
+# Copy the base local configuration
+RUN cp -R /chain-configuration/local/* ./
+
+# Copy the testnet consensus parameters and state transition bytecode
+RUN cp /chain-configuration/upgradelog/ignition-devnet/consensus_parameters/13.json \
+    ./latest_consensus_parameters.json
+RUN cp /chain-configuration/upgradelog/ignition-devnet/state_transition_function/15.wasm \
+    ./state_transition_bytecode.wasm
+
+# update local state_config with custom genesis coins config
+RUN jq '.coins = input' \
+    state_config.json genesis_coins.json > tmp.json \
+    && mv tmp.json state_config.json
+
+# update local state_config with testnet consensus parameters
+RUN jq '.consensus_parameters = input' \
+    state_config.json latest_consensus_parameters.json > tmp.json \
+    && mv tmp.json state_config.json
+
+# expose fuel node port
+EXPOSE ${FUEL_CORE_PORT}
+
+# copy over script and run
+COPY ./fuel_core.sh .
+CMD ["sh", "./fuel_core.sh"]

docker/fuel-core/fuel_core.sh

@@ -0,0 +1,17 @@
+#!/bin/bash
+
+# TODO change to --poa-interval-period 1sec \
+
+# Start the Fuel Core node
+/root/fuel-core run \
+    --ip $FUEL_IP \
+    --port $FUEL_CORE_PORT \
+    --db-path ./mnt/db/ \
+    --utxo-validation \
+    --vm-backtrace \
+    --poa-interval-period 1sec \
+    --debug \
+    --min-gas-price ${MIN_GAS_PRICE} \
+    --snapshot ./ \
+    --consensus-key ${CONSENSUS_KEY_SECRET}
+

docker/fuel-core/genesis_coins.json

@@ -0,0 +1,20 @@
+[
+  {
+    "owner": "0x94ffcc53b892684acefaebc8a3d4a595e528a8cf664eeb3ef36f1020b0809d0d",
+    "amount": 1000000000000,
+    "asset_id": "0xf8f8b6283d7fa5b672b530cbb84fcccb4ff8dc40f8176ef4544ddb1f1952ad07",
+    "tx_id": "0x0000000000000000000000000000000000000000000000000000000000000032",
+    "output_index": 0,
+    "tx_pointer_block_height": 0,
+    "tx_pointer_tx_idx": 0
+  },
+  {
+    "owner": "0x94ffcc53b892684acefaebc8a3d4a595e528a8cf664eeb3ef36f1020b0809d0d",
+    "amount": 1000000000000,
+    "asset_id": "0x0000000000000000000000000000000000000000000000000000000000000001",
+    "tx_id": "0x0000000000000000000000000000000000000000000000000000000000000033",
+    "output_index": 0,
+    "tx_pointer_block_height": 0,
+    "tx_pointer_tx_idx": 0
+  }
+]

e2e-tests/package.json

@@ -7,11 +7,12 @@
   "homepage": "https://github.com/FuelLabs/fuel-connectors",
   "type": "module",
   "scripts": {
-    "test:e2e": "playwright test"
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui --debug"
   },
   "devDependencies": {
     "@fuels/connectors": "workspace:*",
-    "@fuels/playwright-utils": "0.23.0",
+    "@fuels/playwright-utils": "0.40.1",
     "@playwright/test": "1.48.1",
     "dotenv": "16.4.5",
     "fuels": "0.96.1"

e2e-tests/react-app/connectors/BurnerWalletConnector/BurnerWalletConnector.test.ts

@@ -6,6 +6,14 @@ const connectBurner = async (page: Page, walletName = 'Burner Wallet') => {
   const connectButton = getButtonByText(page, 'Connect');
   await connectButton.click();
   await getByAriaLabel(page, `Connect to ${walletName}`, true).click();
+
+  await skipBridgeFunds(page);
+};
+
+const skipBridgeFunds = async (page: Page) => {
+  if (await page.isVisible('text=Bridge Funds')) {
+    await page.click('text=Continue to application');
+  }
 };
 
 test.describe('BurnerWalletConnector', async () => {
@@ -14,7 +22,7 @@ test.describe('BurnerWalletConnector', async () => {
     await page.bringToFront();
   });
 
-  test('should connect and show fuel address', async ({ page }) => {
+  test('BurnerWallet Tests', async ({ page }) => {
     await connectBurner(page);
 
     expect(await page.waitForSelector('text=/Your Fuel Address/')).toBeTruthy();
@@ -31,10 +39,12 @@ test.describe('BurnerWalletConnector', async () => {
 
     await test.step('should connect, refresh and stay connected', async () => {
       await page.reload();
+      await skipBridgeFunds(page);
       await page.waitForSelector('text=/Your Fuel Address/');
     });
 
     await test.step('should connect, disconnect, refresh and stay disconnected', async () => {
+      await skipBridgeFunds(page);
       await page.click('text=Disconnect');
       await page.waitForSelector('text=/Connect Wallet/');