refactor: add more comments + add getQuickNodeSeenRequests

test/e2e/flask/btc/btc-send.spec.ts

@@ -1,7 +1,10 @@
 import { strict as assert } from 'assert';
 import { Suite } from 'mocha';
 import { DEFAULT_BTC_ACCOUNT } from '../../constants';
-import { QUICKNODE_URL_REGEX, withBtcAccountSnap } from './common-btc';
+import {
+  getQuickNodeSeenRequests,
+  withBtcAccountSnap,
+} from './common-btc';
 
 enum SendFlowPlaceHolders {
   AMOUNT = 'Enter amount to send',
@@ -14,55 +17,69 @@ describe('BTC Account - Send', function (this: Suite) {
     await withBtcAccountSnap(
       { title: this.test?.fullTitle() },
       async (driver, mockServer) => {
+        // Wait a bit so the MultichainRatesController is able to fetch BTC -> USD rates.
         await driver.delay(1000);
 
+        // Start the send flow.
         const sendButton = await driver.waitForSelector({
           text: 'Send',
           tag: 'button',
           css: '[data-testid="coin-overview-send"]',
         });
-
         await sendButton.click();
 
-        // see the review button is disabled by default
+        // See the review button is disabled by default.
         await driver.waitForSelector({
           text: 'Review',
           tag: 'button',
           css: '[disabled]',
         });
 
-        // See that the balance is displayed
+        // Set the recipient address (ourself in this case).
         await driver.fill(
           `[placeholder="${SendFlowPlaceHolders.RECIPIENT}"]`,
           DEFAULT_BTC_ACCOUNT,
         );
 
+        // Set the amount to send.
         const mockAmountToSend = '0.5';
         await driver.fill(
           `[placeholder="${SendFlowPlaceHolders.AMOUNT}"]`,
           mockAmountToSend,
         );
 
+        // Wait for for the "summary panel" to start loading.
         await driver.waitForSelector({
           text: SendFlowPlaceHolders.LOADING,
         });
 
-        // Wait for the loading to disappear
+        // Wait for the loading to disappear.
         await driver.assertElementNotPresent({
           text: SendFlowPlaceHolders.LOADING,
         });
 
+        // From here, the "summary panel" should have some information about the fees and total.
+        await driver.waitForSelector({
+          text: 'Total',
+          tag: 'p',
+        });
+
+        // The review button will become available.
         const snapReviewButton = await driver.findClickableElement({
           text: 'Review',
           tag: 'button',
           css: '.snap-ui-renderer__footer-button',
         });
-
+        assert.equal(await snapReviewButton.isEnabled(), true);
         await snapReviewButton.click();
 
         // TODO: There isn't any check for the fees and total amount. This requires calculating the vbytes used in a transaction dynamically.
         // We already have unit tests for these calculations on the snap.
 
+        // ------------------------------------------------------------------------------
+        // From here, we have moved to the confirmation screen (second part of the flow).
+
+        // We should be able to send the transaction right away.
         const snapSendButton = await driver.waitForSelector({
           text: 'Send',
           tag: 'button',
@@ -71,28 +88,21 @@ describe('BTC Account - Send', function (this: Suite) {
         assert.equal(await snapSendButton.isEnabled(), true);
         await snapSendButton.click();
 
+        // Check that we are selecting the "Activity tab" right after the send.
         await driver.waitForSelector({
           tag: 'div',
           text: 'Bitcoin activity is not supported',
         });
 
-        const seenRequests = await Promise.all(
-          (
-            await mockServer.getMockedEndpoints()
-          ).map((mockedEndpoint) => mockedEndpoint.getSeenRequests()),
-        );
-        const pendingBodies = (await Promise.all(
-          seenRequests
-            .flat()
-            .filter((request) => request.url.match(QUICKNODE_URL_REGEX))
-            .map((request) => request.body.getJson()),
-        )) as { method: string }[];
-
+        // NOTE: We wait to land on the "Activity tab" first before checking the transaction network call!
+        // Check that the transaction has been sent.
+        const transactionRequest = (
+          await getQuickNodeSeenRequests(mockServer)
+        ).find(async (request) => {
+          const body = (await request.body.getJson()) as { method: string };
+          return body.method === 'sendrawtransaction';
+        });
         // TODO: check for the response as well.
-        const transactionRequest = pendingBodies.find(
-          (request) => request.method === 'sendrawtransaction',
-        );
-
         assert(transactionRequest !== undefined);
       },
     );

test/e2e/flask/btc/common-btc.ts

@@ -174,6 +174,19 @@ export async function mockRampsDynamicFeatureFlag(
     }));
 }
 
+export async function getQuickNodeSeenRequests(mockServer: Mockttp) {
+  const seenRequests = await Promise.all(
+    (
+      await mockServer.getMockedEndpoints()
+    ).map((mockedEndpoint) => mockedEndpoint.getSeenRequests()),
+  );
+  return await Promise.all(
+    seenRequests
+      .flat()
+      .filter((request) => request.url.match(QUICKNODE_URL_REGEX)),
+  );
+}
+
 export async function withBtcAccountSnap(
   {
     title,
@@ -191,16 +204,19 @@ export async function withBtcAccountSnap(
       title,
       dapp: true,
       testSpecificMock: async (mockServer: Mockttp) => [
+        // Multichain rates:
         await mockRatesCall(mockServer),
+        // Bitcoin RPC provider:
+        await mockMempoolInfo(mockServer),
+        await mockBtcFeeCallQuote(mockServer),
+        await mockGetUTXO(mockServer),
+        await mockSendTransaction(mockServer),
         await mockBtcBalanceQuote(mockServer),
+        // Ramps:
         // See: PROD_RAMP_API_BASE_URL
         await mockRampsDynamicFeatureFlag(mockServer, 'api'),
         // See: UAT_RAMP_API_BASE_URL
         await mockRampsDynamicFeatureFlag(mockServer, 'uat-api'),
-        await mockMempoolInfo(mockServer),
-        await mockBtcFeeCallQuote(mockServer),
-        await mockGetUTXO(mockServer),
-        await mockSendTransaction(mockServer),
       ],
     },
     async ({ driver, mockServer }: { driver: Driver; mockServer: Mockttp }) => {