feat: add sip10 tokens send test

src/app/pages/send/sent-summary/stx-sent-summary.tsx

@@ -1,5 +1,6 @@
 import { useLocation } from 'react-router-dom';
 
+import { SendCryptoAssetSelectors } from '@tests/selectors/send.selectors';
 import { Stack } from 'leather-styles/jsx';
 
 import { analytics } from '@shared/utils/analytics';
@@ -54,6 +55,7 @@ export function StxSentSummary() {
       <Content>
         <Page>
           <Card
+            data-testid={SendCryptoAssetSelectors.SentTransactionSummary}
             contentStyle={{
               p: 'space.00',
             }}

tests/mocks/mock-stacks-txs.ts

@@ -165,7 +165,7 @@ export async function mockStacksPendingTransaction(page: Page) {
   );
 }
 
-export async function mockStacksBroadcastCancelTransaction(page: Page) {
+export async function mockStacksBroadcastTransaction(page: Page) {
   await page.route(`**/api.hiro.so/v2/transactions`, route =>
     route.fulfill({
       body: '9b709768122e6c62a37b087106cc9c23280ed6242b565484b6cc4e6a43ae1155',

tests/page-object-models/send.page.ts

@@ -1,4 +1,5 @@
 import { Locator, Page } from '@playwright/test';
+import { MockedTokensSelectors } from '@tests/selectors/mocked-tokens.selectors';
 import { SendCryptoAssetSelectors } from '@tests/selectors/send.selectors';
 import { SharedComponentsSelectors } from '@tests/selectors/shared-component.selectors';
 import { createTestSelector } from '@tests/utils';
@@ -82,6 +83,12 @@ export class SendPage {
     await this.page.getByTestId(SendCryptoAssetSelectors.SendForm).waitFor();
   }
 
+  async selectSIP10AndGoToSendForm() {
+    await this.page.waitForURL('**' + RouteUrls.SendCryptoAsset);
+    await this.page.getByTestId(MockedTokensSelectors.Sip10TokenTestId).click();
+    await this.page.getByTestId(SendCryptoAssetSelectors.SendForm).waitFor();
+  }
+
   async waitForSendPageReady() {
     await this.page.waitForSelector(createTestSelector(SendCryptoAssetSelectors.SendPageReady), {
       state: 'attached',
@@ -119,4 +126,8 @@ export class SendPage {
       await sendButton.nth(0).click({ force: true });
     }
   }
+
+  async confirmSendTransaction() {
+    await this.page.getByTestId(SendCryptoAssetSelectors.ConfirmSendTxBtn).click();
+  }
 }

tests/selectors/mocked-tokens.selectors.ts

@@ -0,0 +1,7 @@
+export enum MockedTokensSelectors {
+  Sip10TokenTestId = 'SP265WBWD4NH7TVPYQTVD23X3607NNK4484DTXQZ3.longcoin::longcoin',
+  Brc20TokenTestId = 'doge',
+  Src20TokenTestId = 'pxl',
+  Stx20TokenTestId = 'MEME',
+  RuneTokenTestId = 'DOGGOTOTHEMOON',
+}

tests/selectors/send.selectors.ts

@@ -24,6 +24,8 @@ export enum SendCryptoAssetSelectors {
 
   SendPageReady = 'send-page-ready',
 
+  SentTransactionSummary = 'sent-transaction-summary',
+
   // stx high fee warning dialog
   HighFeeWarningSheet = 'high-fee-warning-sheet',
   HighFeeWarningSheetSubmit = 'high-fee-warning-sheet-submit',

tests/specs/manage-tokens/manage-tokens.spec.ts

@@ -1,48 +1,52 @@
 import { expect } from '@playwright/test';
 
 import { test } from '../../fixtures/fixtures';
+import { MockedTokensSelectors } from '../../selectors/mocked-tokens.selectors';
 
-const sip10TokenTestId = 'SP265WBWD4NH7TVPYQTVD23X3607NNK4484DTXQZ3.longcoin::longcoin';
-const brc20TokenTestId = 'doge';
-const src20TokenTestId = 'pxl';
-const stx20TokenTestId = 'MEME';
-const runeTokenTestId = 'DOGGOTOTHEMOON';
-
-test.describe('manage tokens', () => {
+test.describe('Manage tokens', () => {
   test.beforeEach(async ({ extensionId, globalPage, onboardingPage }) => {
     await globalPage.setupAndUseApiCalls(extensionId);
     await onboardingPage.signInWithTestAccount(extensionId);
   });
 
   test('that supported sip10 token is shown', async ({ homePage }) => {
     await homePage.manageTokensBtn.click();
-    const sip10Token = homePage.assetList.getByTestId(sip10TokenTestId);
+    const sip10Token = homePage.assetList.getByTestId(MockedTokensSelectors.Sip10TokenTestId);
     await expect(sip10Token).toBeAttached();
   });
 
   test('that token can be removed from asset list and added back', async ({ homePage }) => {
     await homePage.manageTokensBtn.click();
 
     // sip10 token
-    const sip10InAssetList = homePage.assetList.getByTestId(sip10TokenTestId);
-    const sip10TokenInManageTokensList =
-      homePage.manageTokensAssetsList.getByTestId(sip10TokenTestId);
+    const sip10InAssetList = homePage.assetList.getByTestId(MockedTokensSelectors.Sip10TokenTestId);
+    const sip10TokenInManageTokensList = homePage.manageTokensAssetsList.getByTestId(
+      MockedTokensSelectors.Sip10TokenTestId
+    );
 
     // brc20 token
-    const brc20InAssetList = homePage.assetList.getByTestId(brc20TokenTestId);
-    const brc20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(brc20TokenTestId);
+    const brc20InAssetList = homePage.assetList.getByTestId(MockedTokensSelectors.Brc20TokenTestId);
+    const brc20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(
+      MockedTokensSelectors.Brc20TokenTestId
+    );
 
     // src20 token
-    const src20InAssetList = homePage.assetList.getByTestId(src20TokenTestId);
-    const src20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(src20TokenTestId);
+    const src20InAssetList = homePage.assetList.getByTestId(MockedTokensSelectors.Src20TokenTestId);
+    const src20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(
+      MockedTokensSelectors.Src20TokenTestId
+    );
 
     // rune token
-    const runeInAssetList = homePage.assetList.getByTestId(runeTokenTestId);
-    const runeInManageTokensList = homePage.manageTokensAssetsList.getByTestId(runeTokenTestId);
+    const runeInAssetList = homePage.assetList.getByTestId(MockedTokensSelectors.RuneTokenTestId);
+    const runeInManageTokensList = homePage.manageTokensAssetsList.getByTestId(
+      MockedTokensSelectors.RuneTokenTestId
+    );
 
     // stx20 token (disabled by default)
-    const stx20InAssetList = homePage.assetList.getByTestId(stx20TokenTestId);
-    const stx20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(stx20TokenTestId);
+    const stx20InAssetList = homePage.assetList.getByTestId(MockedTokensSelectors.Stx20TokenTestId);
+    const stx20InManageTokensList = homePage.manageTokensAssetsList.getByTestId(
+      MockedTokensSelectors.Stx20TokenTestId
+    );
 
     // disable tokens that are enabled by default
     await sip10TokenInManageTokensList.click();

tests/specs/manage-transaction/manage-transaction.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test';
 import {
-  mockStacksBroadcastCancelTransaction,
+  mockStacksBroadcastTransaction,
   mockStacksPendingTransaction,
   mockStacksRawTx,
   mockTestAccountStacksTxsRequestsWithPendingTx,
@@ -9,13 +9,13 @@ import { ActivitySelectors } from '@tests/selectors/activity.selectors';
 
 import { test } from '../../fixtures/fixtures';
 
-test.describe('manage transaction', () => {
+test.describe('Manage transaction', () => {
   test.beforeEach(async ({ homePage, extensionId, globalPage, onboardingPage }) => {
     await globalPage.setupAndUseApiCalls(extensionId);
     await mockTestAccountStacksTxsRequestsWithPendingTx(globalPage.page);
     await mockStacksRawTx(globalPage.page);
     await mockStacksPendingTransaction(globalPage.page);
-    await mockStacksBroadcastCancelTransaction(globalPage.page);
+    await mockStacksBroadcastTransaction(globalPage.page);
     await onboardingPage.signInWithTestAccount(extensionId);
 
     await homePage.clickActivityTab();

tests/specs/send/send-sip10.spec.ts

@@ -0,0 +1,36 @@
+import { expect } from '@playwright/test';
+import { TEST_ACCOUNT_2_STX_ADDRESS } from '@tests/mocks/constants';
+import { mockStacksBroadcastTransaction } from '@tests/mocks/mock-stacks-txs';
+import { SendCryptoAssetSelectors } from '@tests/selectors/send.selectors';
+
+import { test } from '../../fixtures/fixtures';
+
+const amount = '0.000001';
+
+test.describe('Send sip10', () => {
+  test.beforeEach(async ({ extensionId, globalPage, homePage, onboardingPage, sendPage }) => {
+    await globalPage.setupAndUseApiCalls(extensionId);
+    await mockStacksBroadcastTransaction(globalPage.page);
+
+    await onboardingPage.signInWithTestAccount(extensionId);
+    await homePage.sendButton.click();
+    await sendPage.selectSIP10AndGoToSendForm();
+  });
+
+  test('can send sip10 token', async ({ sendPage }) => {
+    await sendPage.amountInput.fill(amount);
+    await sendPage.recipientInput.fill(TEST_ACCOUNT_2_STX_ADDRESS);
+    await sendPage.previewSendTxButton.click();
+    const details = await sendPage.confirmationDetails.allInnerTexts();
+
+    test.expect(details).toBeTruthy();
+
+    await sendPage.confirmSendTransaction();
+
+    const sentTransactionSummaryPage = sendPage.page.getByTestId(
+      SendCryptoAssetSelectors.SentTransactionSummary
+    );
+
+    await expect(sentTransactionSummaryPage).toBeAttached();
+  });
+});