Merge pull request #18 from Synthetixio/metamask-accept-reject-tx

feat: metamask accept/reject tx
Synthetixio · Dec 6, 2020 · 0786971 · 0786971
2 parents 6a37ac6 + 45def8a
commit 0786971
Show file tree

Hide file tree

Showing 5 changed files with 90 additions and 1 deletion.
diff --git a/pages/metamask/first-time-flow-page.js b/pages/metamask/first-time-flow-page.js
@@ -1,4 +1,4 @@
-const app = '#app-content';
+const app = '#app-content .app';
 
 const welcomePage = '.welcome-page';
 const confirmButton = `${welcomePage} .first-time-flow__button`;

diff --git a/pages/metamask/notification-page.js b/pages/metamask/notification-page.js
@@ -4,6 +4,16 @@ const nextButton = `${notificationPage} .permissions-connect-choose-account__bot
 const permissionsPage = '.permissions-connect';
 const connectButton = `${permissionsPage} .permission-approval-container__footers button:nth-child(2)`;
 
+const confirmPageHeader = `${notificationPage} .confirm-page-container-header`;
+const confirmPageContent = `${notificationPage} .confirm-page-container-content`;
+const confirmPageGasFeeSection = `${confirmPageContent} .confirm-page-container-content__gas-fee`;
+const gasFeeLabel = `${confirmPageGasFeeSection} .currency-display-component__text`;
+const gasFeeInput = `${confirmPageGasFeeSection} .advanced-gas-inputs__gas-edit-row:nth-child(1) .advanced-gas-inputs__gas-edit-row__input`;
+const gasLimitInput = `${confirmPageGasFeeSection} .advanced-gas-inputs__gas-edit-row:nth-child(2) .advanced-gas-inputs__gas-edit-row__input`;
+const totalLabel = `${confirmPageContent} div:nth-child(2) > .confirm-detail-row .currency-display-component__text`;
+const rejectButton = `${confirmPageContent} [data-testid="page-container-footer-cancel"]`;
+const confirmButton = `${confirmPageContent} [data-testid="page-container-footer-next"]`;
+
 export const notificationPageElements = {
   notificationPage,
   nextButton,
@@ -13,3 +23,16 @@ export const permissionsPageElements = {
   permissionsPage,
   connectButton,
 };
+
+export const confirmPageElements = {
+  notificationPage,
+  confirmPageHeader,
+  confirmPageContent,
+  confirmPageGasFeeSection,
+  gasFeeLabel,
+  gasFeeInput,
+  gasLimitInput,
+  totalLabel,
+  rejectButton,
+  confirmButton,
+};
diff --git a/plugins/index.js b/plugins/index.js
@@ -16,6 +16,7 @@ const { unlockPageElements } = require('../pages/metamask/unlock-page');
 const {
   notificationPageElements,
   permissionsPageElements,
+  confirmPageElements,
 } = require('../pages/metamask/notification-page');
 
 let puppeteerBrowser;
@@ -104,6 +105,14 @@ module.exports = (on, config) => {
       const accepted = await acceptMetamaskAccess();
       return accepted;
     },
+    confirmMetamaskTransaction: async () => {
+      const confirmed = await confirmMetamaskTransaction();
+      return confirmed;
+    },
+    rejectMetamaskTransaction: async () => {
+      const rejected = await rejectMetamaskTransaction();
+      return rejected;
+    },
     getMetamaskWalletAddress: async () => {
       const walletAddress = await getMetamaskWalletAddress();
       return walletAddress;
@@ -179,6 +188,16 @@ async function waitAndGetValue(selector, page = metamaskWindow) {
   return value;
 }
 
+async function waitAndSetValue(text, selector, page = metamaskWindow) {
+  await waitFor(selector, page);
+  await page.evaluate(
+    selector => (document.querySelector(selector).value = ''),
+    selector,
+  );
+  await page.focus(selector);
+  await page.keyboard.type(text);
+}
+
 async function waitForText(selector, text, page = metamaskWindow) {
   await waitFor(selector, page);
   await page.waitForFunction(
@@ -311,6 +330,33 @@ async function acceptMetamaskAccess() {
   const notificationPage = await switchToMetamaskNotification();
   await waitAndClick(notificationPageElements.nextButton, notificationPage);
   await waitAndClick(permissionsPageElements.connectButton, notificationPage);
+  await metamaskWindow.waitForTimeout(3000);
+  return true;
+}
+
+async function confirmMetamaskTransaction() {
+  await metamaskWindow.waitForTimeout(3000);
+  const notificationPage = await switchToMetamaskNotification();
+  const currentGasFee = await waitAndGetValue(
+    confirmPageElements.gasFeeInput,
+    notificationPage,
+  );
+  const newGasFee = (Number(currentGasFee) + 10).toString();
+  await waitAndSetValue(
+    newGasFee,
+    confirmPageElements.gasFeeInput,
+    notificationPage,
+  );
+  await waitAndClick(confirmPageElements.confirmButton, notificationPage);
+  await metamaskWindow.waitForTimeout(3000);
+  return true;
+}
+
+async function rejectMetamaskTransaction() {
+  await metamaskWindow.waitForTimeout(3000);
+  const notificationPage = await switchToMetamaskNotification();
+  await waitAndClick(confirmPageElements.rejectButton, notificationPage);
+  await metamaskWindow.waitForTimeout(3000);
   return true;
 }
 

diff --git a/support/commands.js b/support/commands.js
@@ -83,6 +83,14 @@ Cypress.Commands.add('acceptMetamaskAccess', () => {
   return cy.task('acceptMetamaskAccess');
 });
 
+Cypress.Commands.add('confirmMetamaskTransaction', () => {
+  return cy.task('confirmMetamaskTransaction');
+});
+
+Cypress.Commands.add('rejectMetamaskTransaction', () => {
+  return cy.task('rejectMetamaskTransaction');
+});
+
 Cypress.Commands.add('switchToMetamaskNotification', () => {
   return cy.task('switchToMetamaskNotification');
 });

diff --git a/support/index.d.ts b/support/index.d.ts
@@ -75,6 +75,18 @@ declare namespace Cypress {
      * cy.acceptMetamaskAccess()
      */
     acceptMetamaskAccess(): Chainable<Subject>;
+    /**
+     * Confirm metamask atransaction
+     * @example
+     * cy.confirmMetamaskTransaction()
+     */
+    confirmMetamaskTransaction(): Chainable<Subject>;
+    /**
+     * Reject metamask transaction
+     * @example
+     * cy.rejectMetamaskTransaction()
+     */
+    rejectMetamaskTransaction(): Chainable<Subject>;
     /**
      * Switch to metamask notification window
      * @example