✨ feat(metamask): Add support for transactions (#997)

wallets/metamask/src/metamask.ts

@@ -91,4 +91,20 @@ export class MetaMask {
 
     await this.notificationPage.rejectSwitchNetwork(this.extensionId)
   }
+
+  async confirmTransaction() {
+    if (!this.extensionId) {
+      throw NO_EXTENSION_ID_ERROR
+    }
+
+    await this.notificationPage.confirmTransaction(this.extensionId)
+  }
+
+  async rejectTransaction() {
+    if (!this.extensionId) {
+      throw NO_EXTENSION_ID_ERROR
+    }
+
+    await this.notificationPage.rejectTransaction(this.extensionId)
+  }
 }

wallets/metamask/src/pages/NotificationPage/actions/index.ts

@@ -1,4 +1,5 @@
 export * from './connectToDapp'
 export * from './signSimpleMessage'
 export * from './signStructuredMessage'
+export * from './transaction'
 export * from './network'

wallets/metamask/src/pages/NotificationPage/actions/transaction.ts

@@ -0,0 +1,15 @@
+import type { Page } from '@playwright/test'
+import Selectors from '../selectors'
+
+const confirmTransaction = async (notificationPage: Page) => {
+  await notificationPage.locator(Selectors.TransactionPage.confirmButton).click()
+}
+
+const rejectTransaction = async (notificationPage: Page) => {
+  await notificationPage.locator(Selectors.TransactionPage.rejectButton).click()
+}
+
+export const transaction = {
+  confirm: confirmTransaction,
+  reject: rejectTransaction
+}

wallets/metamask/src/pages/NotificationPage/page.ts

@@ -1,7 +1,7 @@
 import type { Page } from '@playwright/test'
 import { getNotificationPageAndWaitForLoad } from '../../utils/getNotificationPageAndWaitForLoad'
 import { waitFor } from '../../utils/waitFor'
-import { connectToDapp, network, signSimpleMessage, signStructuredMessage } from './actions'
+import { connectToDapp, network, signSimpleMessage, signStructuredMessage, transaction } from './actions'
 import Selectors from './selectors'
 
 export class NotificationPage {
@@ -79,4 +79,16 @@ export class NotificationPage {
 
     await network.rejectSwitchNetwork(notificationPage)
   }
+
+  async confirmTransaction(extensionId: string) {
+    const notificationPage = await getNotificationPageAndWaitForLoad(this.page.context(), extensionId)
+
+    await transaction.confirm(notificationPage)
+  }
+
+  async rejectTransaction(extensionId: string) {
+    const notificationPage = await getNotificationPageAndWaitForLoad(this.page.context(), extensionId)
+
+    await transaction.reject(notificationPage)
+  }
 }

wallets/metamask/src/pages/NotificationPage/selectors/index.ts

@@ -1,7 +1,9 @@
 import NetworkPage from './networkPage'
 import SignaturePage from './signaturePage'
+import TransactionPage from './transactionPage'
 
 export default {
   SignaturePage,
-  NetworkPage
+  NetworkPage,
+  TransactionPage
 }

wallets/metamask/src/pages/NotificationPage/selectors/transactionPage.ts

@@ -0,0 +1,6 @@
+import { createDataTestSelector } from '../../../utils/selectors/createDataTestSelector'
+
+export default {
+  confirmButton: `.page-container__footer ${createDataTestSelector('page-container-footer-next')}`,
+  rejectButton: `.page-container__footer ${createDataTestSelector('page-container-footer-cancel')}`
+}

wallets/metamask/test/e2e/metamask/confirmTransaction.spec.ts

@@ -0,0 +1,19 @@
+import { testWithMetaMask } from '../testWithMetaMask'
+
+const test = testWithMetaMask
+
+const { expect } = test
+
+test('should confirm contract deployment', async ({ page, metamask }) => {
+  await page.locator('#addEthereumChain').click()
+
+  await metamask.approveNewNetwork()
+  await metamask.approveSwitchNetwork()
+
+  await expect(page.locator('#tokenAddresses')).toBeEmpty()
+  await page.locator('#createToken').click()
+
+  await metamask.confirmTransaction()
+
+  await expect(page.locator('#tokenAddresses')).toContainText(/^0x/)
+})

wallets/metamask/test/e2e/metamask/rejectTransaction.spec.ts

@@ -0,0 +1,19 @@
+import { testWithMetaMask } from '../testWithMetaMask'
+
+const test = testWithMetaMask
+
+const { expect } = test
+
+test('should reject contract deployment', async ({ page, metamask }) => {
+  await page.locator('#addEthereumChain').click()
+
+  await metamask.approveNewNetwork()
+  await metamask.approveSwitchNetwork()
+
+  await expect(page.locator('#tokenAddresses')).toBeEmpty()
+  await page.locator('#createToken').click()
+
+  await metamask.rejectTransaction()
+
+  await expect(page.locator('#tokenAddresses')).toHaveText('Creation Failed')
+})