@cardano-sdk/e2e 0.15.0 → 0.16.0

package/docker-compose.yml

@@ -12,6 +12,10 @@ services:
     <<: *logging
     build:
       context: ./local-network
+    depends_on:
+      # We need the file server here in order to calculate the pool metadata hashes
+      file-server:
+        condition: service_healthy
     environment:
       CARDANO_NODE_LOG_LEVEL: ${CARDANO_NODE_LOG_LEVEL:-Info}
       CARDANO_NODE_CHAINDB_LOG_LEVEL: ${CARDANO_NODE_CHAINDB_LOG_LEVEL:-Notice}
@@ -20,10 +24,7 @@ services:
     volumes:
       - ./local-network/network-files/node-sp1/:/root/network-files/node-sp1
       - ./local-network/config:/root/config
-    depends_on:
-      # We need the file server here in order to calculate the pool metadata hashes
-      file-server:
-        condition: service_healthy
+      - sdk-ipc:/sdk-ipc
 
   file-server:
     <<: *logging
@@ -39,12 +40,15 @@ services:
       timeout: 10s
 
   cardano-node-ogmios:
+    entrypoint: [ "/tini", "-g", "--", "/scripts/cardano-node-ogmios.sh" ]
     image: cardanosolutions/cardano-node-ogmios:v${OGMIOS_VERSION:-5.6.0}_${CARDANO_NODE_VERSION:-1.35.5}
     depends_on:
       local-testnet:
         condition: service_healthy
     volumes:
       - ./local-network/config/network:/config
+      - ./local-network/scripts:/scripts
+      - sdk-ipc:/sdk-ipc
 
   cardano-db-sync:
     depends_on:
@@ -72,6 +76,12 @@ services:
         condition: service_healthy
     restart: on-failure
 
+  handle-projector:
+    environment:
+      HANDLE_POLICY_IDS_FILE: /sdk-ipc/handle_policy_ids
+    volumes:
+      - sdk-ipc:/sdk-ipc
+
   provider-server:
     environment:
       TOKEN_METADATA_SERVER_URL: stub://
@@ -79,4 +89,10 @@ services:
       - ./local-network/config/network:/config
 
 volumes:
+  sdk-ipc:
+    driver: local
+    driver_opts:
+      device: ./local-network/sdk-ipc
+      o: bind
+      type: none
   wallet-db:

package/local-network/scripts/cardano-node-ogmios.sh

@@ -0,0 +1,13 @@
+#!/bin/bash
+
+# Simple scripts which overrides the original cardano-node-ogmios.sh file from the
+# cardano-node-ogmios docker image.
+
+# Used to support the e2e test to check the projector is able to
+# connect / reconnect to the ogmios server.
+
+# If the test set the file, wait for its removal before starting the container
+while [ -f /sdk-ipc/prevent_ogmios ] ; do sleep 10 ; done
+
+# Start the cardano-node-ogmios as normal
+/root/cardano-node-ogmios.sh

package/local-network/scripts/mint-handles.sh

@@ -25,6 +25,7 @@ cat >network-files/utxo-keys/handles-metadata.json <<EOL
 }}
 EOL
 
+echo $policyid > /sdk-ipc/handle_policy_ids
 
 addr=$(cardano-cli address build --payment-verification-key-file network-files/utxo-keys/utxo1.vkey --testnet-magic 888)
 faucetAddr="addr_test1qqen0wpmhg7fhkus45lyv4wju26cecgu6avplrnm6dgvuk6qel5hu3u3q0fht53ly97yx95hkt56j37ch07pesf6s4pqh5gd4e"

package/local-network/sdk-ipc/README.md

@@ -0,0 +1,5 @@
+## Description
+
+Empty directory used as IPC between SDK containers and with the extern.
+
+Used for files required by tests or to share ADA handle policy id between containers, etc...

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cardano-sdk/e2e",
-  "version": "0.15.0",
+  "version": "0.16.0",
   "description": "End to end tests for the cardano-js-sdk packages.",
   "engines": {
     "node": ">=16.0"
@@ -81,18 +81,18 @@
   "dependencies": {
     "@cardano-foundation/ledgerjs-hw-app-cardano": "^6.0.0",
     "@cardano-ogmios/client": "5.6.0",
-    "@cardano-sdk/cardano-services": "~0.13.3",
-    "@cardano-sdk/cardano-services-client": "~0.9.9",
-    "@cardano-sdk/core": "~0.15.0",
-    "@cardano-sdk/crypto": "~0.1.6",
-    "@cardano-sdk/hardware-ledger": "~0.2.8",
-    "@cardano-sdk/key-management": "~0.7.7",
-    "@cardano-sdk/ogmios": "~0.12.5",
-    "@cardano-sdk/tx-construction": "~0.8.0",
-    "@cardano-sdk/util": "~0.11.0",
-    "@cardano-sdk/util-dev": "~0.13.3",
-    "@cardano-sdk/util-rxjs": "~0.4.16",
-    "@cardano-sdk/wallet": "~0.16.3",
+    "@cardano-sdk/cardano-services": "~0.14.0",
+    "@cardano-sdk/cardano-services-client": "~0.10.0",
+    "@cardano-sdk/core": "~0.15.1",
+    "@cardano-sdk/crypto": "~0.1.7",
+    "@cardano-sdk/hardware-ledger": "~0.2.9",
+    "@cardano-sdk/key-management": "~0.7.8",
+    "@cardano-sdk/ogmios": "~0.12.6",
+    "@cardano-sdk/tx-construction": "~0.8.1",
+    "@cardano-sdk/util": "~0.12.0",
+    "@cardano-sdk/util-dev": "~0.13.4",
+    "@cardano-sdk/util-rxjs": "~0.5.0",
+    "@cardano-sdk/wallet": "~0.17.0",
     "@vespaiach/axios-fetch-adapter": "^0.3.0",
     "axios": "^0.27.2",
     "bunyan": "^1.8.15",
@@ -122,16 +122,17 @@
     "@babel/core": "^7.18.2",
     "@babel/preset-env": "^7.18.2",
     "@babel/preset-typescript": "^7.17.12",
-    "@cardano-sdk/dapp-connector": "~0.9.7",
-    "@cardano-sdk/projection": "~0.6.9",
-    "@cardano-sdk/projection-typeorm": "~0.3.5",
-    "@cardano-sdk/web-extension": "~0.13.0",
+    "@cardano-sdk/dapp-connector": "~0.9.8",
+    "@cardano-sdk/projection": "~0.6.10",
+    "@cardano-sdk/projection-typeorm": "~0.3.6",
+    "@cardano-sdk/web-extension": "~0.13.1",
     "@dcspark/cardano-multiplatform-lib-browser": "^3.1.1",
     "@emurgo/cardano-message-signing-asmjs": "^1.0.1",
     "@types/bunyan": "^1.8.8",
     "@types/chalk": "^2.2.0",
     "@types/convict": "^6.1.2",
     "@types/delay": "^3.1.0",
+    "@types/dockerode": "^3.3.8",
     "@types/jest": "^28.1.2",
     "@types/lodash": "^4.14.182",
     "@types/ora": "^3.2.0",
@@ -146,7 +147,7 @@
     "babel-loader": "^8.2.5",
     "blake2b-no-wasm": "2.1.4",
     "buffer": "^6.0.3",
-    "chromedriver": "^112.0.0",
+    "chromedriver": "^114.0.0",
     "copy-webpack-plugin": "^10.2.4",
     "eslint": "^7.32.0",
     "events": "^3.3.0",
@@ -173,5 +174,5 @@
     "webpack-cli": "^4.9.2",
     "webpack-merge": "^5.8.0"
   },
-  "gitHead": "7368568d3dd7844bb48513c92f3a7f26773bf2c7"
+  "gitHead": "46029ae65c25ce6cfef394249c7ff5a32259757f"
 }

package/src/factories.ts

@@ -42,8 +42,7 @@ import {
   rewardsHttpProvider,
   stakePoolHttpProvider,
   txSubmitHttpProvider,
-  utxoHttpProvider,
-  version
+  utxoHttpProvider
 } from '@cardano-sdk/cardano-services-client';
 import { LedgerKeyAgent } from '@cardano-sdk/hardware-ledger';
 import { Logger } from 'ts-log';
@@ -105,8 +104,7 @@ assetProviderFactory.register(HTTP_PROVIDER, async (params: any, logger: Logger)
       assetInfoHttpProvider({
         adapter: customHttpFetchAdapter,
         baseUrl: params.baseUrl,
-        logger,
-        version
+        logger
       })
     );
   });
@@ -118,7 +116,7 @@ chainHistoryProviderFactory.register(
     if (params.baseUrl === undefined) throw new Error(`${chainHistoryHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
     return new Promise<ChainHistoryProvider>(async (resolve) => {
-      resolve(chainHistoryHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+      resolve(chainHistoryHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
     });
   }
 );
@@ -129,7 +127,7 @@ networkInfoProviderFactory.register(
     if (params.baseUrl === undefined) throw new Error(`${networkInfoHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
     return new Promise<NetworkInfoProvider>(async (resolve) => {
-      resolve(networkInfoHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+      resolve(networkInfoHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
     });
   }
 );
@@ -138,7 +136,7 @@ rewardsProviderFactory.register(HTTP_PROVIDER, async (params: any, logger: Logge
   if (params.baseUrl === undefined) throw new Error(`${rewardsHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
   return new Promise<RewardsProvider>(async (resolve) => {
-    resolve(rewardsHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+    resolve(rewardsHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
   });
 });
 
@@ -160,7 +158,7 @@ txSubmitProviderFactory.register(HTTP_PROVIDER, async (params: any, logger: Logg
   if (params.baseUrl === undefined) throw new Error(`${txSubmitHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
   return new Promise<TxSubmitProvider>(async (resolve) => {
-    resolve(txSubmitHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+    resolve(txSubmitHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
   });
 });
 
@@ -168,7 +166,7 @@ utxoProviderFactory.register(HTTP_PROVIDER, async (params: any, logger: Logger):
   if (params.baseUrl === undefined) throw new Error(`${utxoHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
   return new Promise<UtxoProvider>(async (resolve) => {
-    resolve(utxoHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+    resolve(utxoHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
   });
 });
 
@@ -195,7 +193,7 @@ stakePoolProviderFactory.register(HTTP_PROVIDER, async (params: any, logger: Log
   if (params.baseUrl === undefined) throw new Error(`${stakePoolHttpProvider.name}: ${MISSING_URL_PARAM}`);
 
   return new Promise<StakePoolProvider>(async (resolve) => {
-    resolve(stakePoolHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger, version }));
+    resolve(stakePoolHttpProvider({ adapter: customHttpFetchAdapter, baseUrl: params.baseUrl, logger }));
   });
 });
 

package/test/artillery/StakePoolSearch.ts

@@ -2,7 +2,7 @@ import * as envalid from 'envalid';
 import { ArtilleryContext, FunctionHook, WhileTrueHook } from './artillery';
 import { Cardano, Paginated, QueryStakePoolsArgs } from '@cardano-sdk/core';
 import { logger } from '@cardano-sdk/util-dev';
-import { stakePoolHttpProvider, version } from '@cardano-sdk/cardano-services-client';
+import { stakePoolHttpProvider } from '@cardano-sdk/cardano-services-client';
 
 /**
  * The context variables shared between all the hooks.
@@ -26,7 +26,7 @@ interface StakePoolSearchVars extends Paginated<Cardano.StakePool> {
 }
 
 const env = envalid.cleanEnv(process.env, { STAKE_POOL_PROVIDER_URL: envalid.str() });
-const provider = stakePoolHttpProvider({ baseUrl: env.STAKE_POOL_PROVIDER_URL, logger, version });
+const provider = stakePoolHttpProvider({ baseUrl: env.STAKE_POOL_PROVIDER_URL, logger });
 
 const PAGE_SIZE = 20;
 

package/test/blockfrost/StakePoolCompare.test.ts

@@ -4,7 +4,7 @@ import { ChildProcess, fork } from 'child_process';
 import { WriteStream, createWriteStream } from 'fs';
 import { getRandomPort } from 'get-port-please';
 import { logger } from '@cardano-sdk/util-dev';
-import { stakePoolHttpProvider, version } from '@cardano-sdk/cardano-services-client';
+import { stakePoolHttpProvider } from '@cardano-sdk/cardano-services-client';
 import path from 'path';
 
 type StakePoolRecord = Record<string, Cardano.StakePool>;
@@ -127,7 +127,7 @@ describe('StakePoolCompare', () => {
   };
 
   const setupProvider = async (args: string[] = []) => {
-    const provider = stakePoolHttpProvider({ baseUrl: await startServer(args), logger, version });
+    const provider = stakePoolHttpProvider({ baseUrl: await startServer(args), logger });
 
     // eslint-disable-next-line no-constant-condition
     while (true) {

package/test/load-test-custom/stake-pool-search/stake-pool-search.test.ts

@@ -4,7 +4,7 @@ import { Logger } from 'ts-log';
 import { MeasurementUtil, getEnv, getLoadTestScheduler } from '../../../src';
 import { bufferTime, from, tap } from 'rxjs';
 import { logger } from '@cardano-sdk/util-dev';
-import { stakePoolHttpProvider, version } from '@cardano-sdk/cardano-services-client';
+import { stakePoolHttpProvider } from '@cardano-sdk/cardano-services-client';
 
 // Example call:
 /* STAKE_POOL_PROVIDER_URL="http://mhvm:4000/stake-pool" \
@@ -14,7 +14,7 @@ import { stakePoolHttpProvider, version } from '@cardano-sdk/cardano-services-cl
 */
 
 const { STAKE_POOL_PROVIDER_URL } = envalid.cleanEnv(process.env, { STAKE_POOL_PROVIDER_URL: envalid.str() });
-const provider = stakePoolHttpProvider({ baseUrl: STAKE_POOL_PROVIDER_URL, logger, version });
+const provider = stakePoolHttpProvider({ baseUrl: STAKE_POOL_PROVIDER_URL, logger });
 const testLogger: Logger = console;
 const intermediateResultsInterval = 10_000;
 

package/test/long-running/cache-invalidation.test.ts

@@ -47,7 +47,7 @@ describe('cache invalidation', () => {
 
   afterAll(() => wallet1.wallet.shutdown());
 
-  test('cache is invalidated on epoch rollover', async () => {
+  test.skip('cache is invalidated on epoch rollover', async () => {
     const wallet = wallet1.wallet;
 
     await walletReady(wallet);

package/test/long-running/delegation-rewards.test.ts

@@ -5,10 +5,8 @@ import {
   getEnv,
   getTxConfirmationEpoch,
   getWallet,
-  requestCoins,
   runningAgainstLocalNetwork,
   submitAndConfirm,
-  transferCoins,
   waitForEpoch,
   walletVariables
 } from '../../src';
@@ -24,9 +22,6 @@ describe('delegation rewards', () => {
   let wallet2: PersonalWallet;
 
   const initializeWallets = async () => {
-    const amountFromFaucet = 100_000_000_000n;
-    const tAdaToSend = 50_000_000n;
-
     ({ wallet: wallet1, providers } = await getWallet({
       env,
       logger,
@@ -35,9 +30,6 @@ describe('delegation rewards', () => {
     }));
     ({ wallet: wallet2 } = await getWallet({ env, logger, name: 'Receiving Wallet', polling: { interval: 50 } }));
 
-    await requestCoins({ coins: amountFromFaucet, wallet: wallet1 });
-    await transferCoins({ coins: tAdaToSend, fromWallet: wallet1, toWallet: wallet2 });
-
     await waitForWalletStateSettle(wallet1);
     await waitForWalletStateSettle(wallet2);
   };

package/test/long-running/projector-ogmios-connection.test.ts

@@ -0,0 +1,132 @@
+import * as envalid from 'envalid';
+import { DockerUtil } from '@cardano-sdk/util-dev';
+import { open, rm } from 'fs/promises';
+import Dockerode from 'dockerode';
+import axios, { AxiosResponse } from 'axios';
+import delay from 'delay';
+import path from 'path';
+
+const preventOgmiosStartFile = path.join(__dirname, '..', '..', 'local-network', 'sdk-ipc', 'prevent_ogmios');
+
+const docker = new Dockerode();
+
+const ogmiosContainer = docker.getContainer('local-network-e2e-cardano-node-ogmios-1');
+const stakePoolProjectorContainer = docker.getContainer('local-network-e2e-stake-pool-projector-1');
+
+const createPrevent = async () => {
+  const file = await open(preventOgmiosStartFile, 'a');
+
+  await file.close();
+};
+
+const removePrevent = () => rm(preventOgmiosStartFile, { force: true });
+
+const killContainer = async (container: DockerUtil.Docker.Container) => {
+  // This waits only for the signal to be sent
+  await DockerUtil.containerExec(container, ['kill', '1']);
+  // Let's wait one more second to ensure the container was shut down
+  await delay(1000);
+};
+
+describe('projector ogmios connection', () => {
+  let stakePoolProjectorUrl: string;
+
+  const fetchProjectorHealth = async () => {
+    let result: AxiosResponse;
+
+    try {
+      result = await axios.post(stakePoolProjectorUrl, {});
+    } catch (error) {
+      if (axios.isAxiosError(error)) throw new Error(error.message);
+
+      throw error;
+    }
+
+    return result;
+  };
+
+  const checkProjector = async () => {
+    const health = await fetchProjectorHealth();
+
+    if (!health.data.ok) throw new Error('Projector not healthy');
+
+    const { blockNo } = health.data.services[0].projectedTip;
+    const start = Date.now();
+
+    // Wait for another block to be projected to ensure projector is working correctly
+    while ((await fetchProjectorHealth()).data.services[0].projectedTip.blockNo === blockNo) {
+      if (Date.now() - start > 60_000) throw new Error('The projector is not projecting new blocks');
+
+      await delay(100);
+    }
+  };
+
+  const waitProjector = async (skipOkCheck = false, tolerateConnectionErrors = false) => {
+    const start = Date.now();
+    let projectorReady = false;
+
+    do {
+      try {
+        const health = await fetchProjectorHealth();
+
+        if ('ok' in health.data && (skipOkCheck || health.data.ok)) projectorReady = true;
+      } catch (error) {
+        if (error && !tolerateConnectionErrors) throw error;
+      }
+
+      if (Date.now() - start > 60_000) throw new Error("The projector can't get ready");
+    } while (projectorReady === false);
+  };
+
+  beforeAll(() => {
+    const env = envalid.cleanEnv(process.env, { STAKE_POOL_PROJECTOR_URL: envalid.url() });
+
+    stakePoolProjectorUrl = `${env.STAKE_POOL_PROJECTOR_URL}health`;
+  });
+
+  beforeEach(async () => {
+    await removePrevent();
+    await checkProjector();
+  });
+
+  afterEach(() => removePrevent());
+
+  it.skip('projector reconnects after a short delay', async () => {
+    await killContainer(ogmiosContainer);
+    await waitProjector();
+    // This throws because is not able to complete HTTP request
+    await checkProjector();
+  });
+
+  // Once the problem which prevent the original test to work is solved
+  // the original test can be un-skipped and this one can be removed
+  it('projector reconnects after a short delay - alternative', async () => {
+    await killContainer(ogmiosContainer);
+    // Add a 10" sleep as a quick workaround for HTTP connection issue
+    await delay(10_000);
+    await waitProjector();
+    await checkProjector();
+  });
+
+  it.skip('projector reconnects after a long delay', async () => {
+    await createPrevent();
+    await killContainer(ogmiosContainer);
+    await delay(120_000);
+    await removePrevent();
+    await waitProjector();
+    await checkProjector();
+  });
+
+  it('projector connects to a later started ogmios', async () => {
+    await createPrevent();
+    await killContainer(ogmiosContainer);
+    await killContainer(stakePoolProjectorContainer);
+    await waitProjector(true, true);
+    await removePrevent();
+    // Once the 'projector reconnects after a short delay' problem is solved
+    // also remove following line and uncomment next one
+    await waitProjector(false, true);
+    // await waitProjector();
+    await checkProjector();
+  });
+});

package/test/providers/StakePoolProvider.test.ts

@@ -3,7 +3,7 @@
 import * as envalid from 'envalid';
 import { Cardano, QueryStakePoolsArgs, StakePoolProvider } from '@cardano-sdk/core';
 import { logger } from '@cardano-sdk/util-dev';
-import { stakePoolHttpProvider, version } from '@cardano-sdk/cardano-services-client';
+import { stakePoolHttpProvider } from '@cardano-sdk/cardano-services-client';
 
 const stringToRegExEqualsTo = (str: string) => `^${str.replace(/[$()*+.?[\\\]^{|}-]/g, '\\$&')}$`;
 
@@ -140,7 +140,7 @@ describe('StakePoolProvider', () => {
 
   beforeAll(async () => {
     const env = envalid.cleanEnv(process.env, { STAKE_POOL_PROVIDER_URL: envalid.url() });
-    const config = { baseUrl: env.STAKE_POOL_PROVIDER_URL, logger, version };
+    const config = { baseUrl: env.STAKE_POOL_PROVIDER_URL, logger };
 
     provider = stakePoolHttpProvider(config);
     pools = await fetchAllPools();

package/test/web-extension/extension/background/services.ts

@@ -1,15 +1,30 @@
 // Expose any additional services to be shared with UIs
-import { BackgroundServices, adaPriceProperties, logger } from '../util';
+import { BackgroundServices, adaPriceProperties, env, logger } from '../util';
+import { Cardano } from '@cardano-sdk/core';
 import { adaPriceServiceChannel, walletName } from '../const';
 import { authenticator } from './authenticator';
 import { exposeApi, exposeSupplyDistributionTracker } from '@cardano-sdk/web-extension';
 import { of } from 'rxjs';
 import { runtime } from 'webextension-polyfill';
+import { stakePoolProviderFactory } from '../../../../src';
 import { supplyDistributionTrackerReady } from './supplyDistributionTracker';
 
 const priceService: BackgroundServices = {
   adaUsd$: of(2.99),
-  clearAllowList: authenticator.clear.bind(authenticator)
+  clearAllowList: authenticator.clear.bind(authenticator),
+  getPoolIds: async (count: number): Promise<Cardano.StakePool[]> => {
+    const stakePoolProvider = await stakePoolProviderFactory.create(
+      env.STAKE_POOL_PROVIDER,
+      env.STAKE_POOL_PROVIDER_PARAMS,
+      logger
+    );
+
+    const activePools = await stakePoolProvider.queryStakePools({
+      filters: { status: [Cardano.StakePoolStatus.Active] },
+      pagination: { limit: count, startAt: 0 }
+    });
+    return activePools.pageResults.slice(0, count);
+  }
 };
 
 exposeApi(

package/test/web-extension/extension/ui.html

@@ -27,6 +27,17 @@
   <div>Stake Address: <span id="stakeAddress">-</span></div>
   <div>Balance: <span id="balance">-</span></div>
   <div>Network-wide staked: <span id="supplyDistribution">-</span></div>
+  <div id="multiDelegation">
+    <div class="distribution">
+      <h3>Delegation distribution:</h3>
+      <ul></ul>
+    </div>
+    <div class="delegate">
+      <p>Available Pools: <span class="pools"></span></p>
+      <button>Delegate to multiple pools</button>
+      <p class="delegateTxId"></p>
+    </div>
+  </div>
   <button id="buildAndSignTx">Build & Sign TX</button>
   <div>Signature: <span id="signature">-</span></div>
   <script src="ui.js"></script>

package/test/web-extension/extension/ui.ts

@@ -10,10 +10,16 @@ import {
 import { adaPriceServiceChannel, getObservableWalletName, userPromptServiceChannel, walletName } from './const';
 import { bip32Ed25519Factory, keyManagementFactory } from '../../../src';
 
+import { Cardano } from '@cardano-sdk/core';
 import { combineLatest, firstValueFrom, of } from 'rxjs';
 import { runtime } from 'webextension-polyfill';
 import { setupWallet } from '@cardano-sdk/wallet';
 
+const delegationConfig = {
+  count: 3,
+  distribution: [10, 30, 60]
+};
+
 const api: UserPromptService = {
   allowOrigin(origin) {
     const container = document.querySelector<HTMLDivElement>('#requestAccess')!;
@@ -66,6 +72,30 @@ combineLatest([supplyDistribution.lovelaceSupply$, supplyDistribution.stake$]).s
     (document.querySelector('#supplyDistribution')!.textContent = `${stake.live} out of ${lovelaceSupply.total}`)
 );
 
+/** Get pools from background service and assign weights */
+const displayPoolIdsAndPreparePortfolio = async (): Promise<{ pool: Cardano.StakePool; weight: number }[]> => {
+  const pools = await backgroundServices.getPoolIds(delegationConfig.count);
+  const poolsSpan = document.querySelector('#multiDelegation .delegate .pools');
+  poolsSpan!.textContent = pools.map(({ id }) => id).join(' ');
+  return pools.map((pool, idx) => ({ pool, weight: delegationConfig.distribution[idx] }));
+};
+
+/** Build, sign and submit delegation transaction */
+const sendDelegationTx = async (portfolio: { pool: Cardano.StakePool; weight: number }[]): Promise<void> => {
+  const pools = portfolio.map(({ pool: { hexId: id }, weight }) => ({ id, weight }));
+  const txBuilder = wallet.createTxBuilder();
+
+  let msg: string;
+  try {
+    const signedTx = await txBuilder.delegatePortfolio({ pools }).build().sign();
+    const txId = await wallet.submitTx(signedTx);
+    msg = `TxId: ${txId}`;
+  } catch (error) {
+    msg = `ERROR delegating: ${JSON.stringify(error)}`;
+  }
+  document.querySelector('#multiDelegation .delegateTxId')!.textContent = msg;
+};
+
 const setAddresses = ({ address, stakeAddress }: { address: string; stakeAddress: string }): void => {
   document.querySelector('#address')!.textContent = address;
   document.querySelector('#stakeAddress')!.textContent = stakeAddress;
@@ -100,6 +130,45 @@ const deactivateWallet = async (): Promise<void> => {
   clearWalletValues();
 };
 
+/**
+ * Wallet does not have any active delegations.
+ * Show a `<p class="noDelegation">No delegation found</p>`
+ */
+const createEmptyDelegationEl = () => {
+  const emptyDistribution = document.createElement('p');
+  emptyDistribution.classList.add('noDelegation');
+  emptyDistribution.textContent = 'No delegation found';
+  return emptyDistribution;
+};
+
+/**
+ * Create a list item for a delegation
+ * `<li> <span class="poolId">thePoolId</span> <span class="percent">50</span> </li>`
+ */
+const createDelegationLi = (poolId: string, percent: string) => {
+  const delegationLi = document.createElement('li');
+  const poolIdSpan = document.createElement('span');
+  poolIdSpan.classList.add('poolId');
+  poolIdSpan.textContent = poolId;
+  const delegationPercentageSpan = document.createElement('span');
+  delegationPercentageSpan.classList.add('percent');
+  delegationPercentageSpan.textContent = percent;
+  const separatorSpan = document.createElement('span');
+  separatorSpan.textContent = ' - ';
+  delegationLi.append(poolIdSpan);
+  delegationLi.append(separatorSpan);
+  delegationLi.append(delegationPercentageSpan);
+  return delegationLi;
+};
+
+/** Remove empty delegation message or multi-delegation list items to display new data */
+const cleanupMultidelegationInfo = (multiDelegationDiv: Element) => {
+  multiDelegationDiv.querySelector('p.noDelegation')?.remove();
+  for (const delegationLi of multiDelegationDiv.querySelectorAll('ul > li')) {
+    delegationLi.remove();
+  }
+};
+
 const walletManager = new WalletManagerUi({ walletName }, { logger, runtime });
 // Wallet object does not change when wallets are activated/deactivated.
 // Instead, it's observable properties emit from the currently active wallet.
@@ -108,6 +177,19 @@ const wallet = walletManager.wallet;
 // Wallet can be subscribed can be used even before it is actually created.
 wallet.addresses$.subscribe(([{ address, rewardAccount }]) => setAddresses({ address, stakeAddress: rewardAccount }));
 wallet.balance.utxo.available$.subscribe(({ coins }) => setBalance(coins.toString()));
+wallet.delegation.distribution$.subscribe((delegationDistrib) => {
+  const multiDelegationDiv = document.querySelector('#multiDelegation .distribution');
+  cleanupMultidelegationInfo(multiDelegationDiv!);
+
+  if (delegationDistrib.size === 0) {
+    multiDelegationDiv?.appendChild(createEmptyDelegationEl());
+  } else {
+    const distributionUl = multiDelegationDiv?.querySelector('ul');
+    for (const [poolId, delegation] of delegationDistrib) {
+      distributionUl?.appendChild(createDelegationLi(poolId, (delegation.percentage * 100).toString()));
+    }
+  }
+});
 
 const createWallet = async (accountIndex: number) => {
   clearWalletValues();
@@ -142,6 +224,11 @@ document.querySelector('#activateWallet1')!.addEventListener('click', async () =
 document.querySelector('#activateWallet2')!.addEventListener('click', async () => await createWallet(1));
 document.querySelector('#deactivateWallet')!.addEventListener('click', async () => await deactivateWallet());
 document.querySelector('#destroyWallet')!.addEventListener('click', async () => await destroyWallet());
+document.querySelector('#multiDelegation .delegate button')!.addEventListener('click', async () => {
+  const poolsAndWeights = await displayPoolIdsAndPreparePortfolio();
+  // multi-delegate with 10%, 30%, 60% distribution
+  await sendDelegationTx(poolsAndWeights);
+});
 
 document.querySelector('#buildAndSignTx')!.addEventListener('click', async () => {
   const [{ address: ownAddress }] = await firstValueFrom(wallet.addresses$);