test: [Snaps E2E] Unified methods and clean up snaps e2e tests (#27684)

## **Description** Because of several factors, over time, the E2E tests had diverged in their use of different methods to do the same thing. This PR represents work to unify these methods throughout the entire test base. It also was is an attempt to, as well as possible, document each individual step in the tests. Some delays were removed in lieu of waitForSelector when appropriate. Other delays were standardized. For example, Firefox requires delays to allow `scrollToElement` to complete, hence the new _Firefox Specific Delay™_ has been added to `driver.js` as `delayFirefox(time)` because these delays are not reuired in Chrome instances.  [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/27684?quickstart=1) ## **Related issues** Fixes: ## **Manual testing steps** 1. Watch CI Fly through with ease ## **Screenshots/Recordings**  ### **Before**  ### **After**  ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Extension Coding Standards](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.
MetaMask · Oct 29, 2024 · b649acf · b649acf
1 parent 03196a8
commit b649acf
Show file tree

Hide file tree

Showing 32 changed files with 951 additions and 338 deletions.
diff --git a/test/e2e/snaps/test-snap-bip-32.spec.js b/test/e2e/snaps/test-snap-bip-32.spec.js
@@ -2,7 +2,6 @@ const {
   defaultGanacheOptions,
   withFixtures,
   unlockWallet,
-  switchToNotificationWindow,
   WINDOW_TITLES,
 } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
@@ -28,14 +27,19 @@ describe('Test Snap bip-32', function () {
           tag: 'h2',
         });
 
-        // find and scroll to the bip32 test and connect
+        // find and scroll to the bip32 snap
         const snapButton1 = await driver.findElement('#connectbip32');
         await driver.scrollToElement(snapButton1);
+
+        // added delay for firefox (deflake)
+        await driver.delayFirefox(3000);
+
+        // wait for and click connect to bip-32
         await driver.waitForSelector('#connectbip32');
         await driver.clickElement('#connectbip32');
 
         // switch to metamask extension and click connect
-        await switchToNotificationWindow(driver, 2);
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
         await driver.waitForSelector({
           text: 'Connect',
           tag: 'button',
@@ -45,10 +49,13 @@ describe('Test Snap bip-32', function () {
           tag: 'button',
         });
 
+        // wait for confirm to appear
         await driver.waitForSelector({ text: 'Confirm' });
 
+        // click and dismiss possible scroll element
         await driver.clickElementSafe('[data-testid="snap-install-scroll"]');
 
+        // click confirm
         await driver.clickElement({
           text: 'Confirm',
           tag: 'button',
@@ -64,8 +71,9 @@ describe('Test Snap bip-32', function () {
           '[data-testid="snap-install-warning-modal-confirm"]',
         );
 
+        // wait for and click OK and wait for window to close
         await driver.waitForSelector({ text: 'OK' });
-        await driver.clickElement({
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'OK',
           tag: 'button',
         });
@@ -103,20 +111,15 @@ describe('Test Snap bip-32', function () {
         await driver.fill('#bip32Message-secp256k1', 'foo bar');
         await driver.clickElement('#sendBip32-secp256k1');
 
-        // hit 'approve' on the signature confirmation
-        await switchToNotificationWindow(driver, 2);
-        await driver.clickElement({
+        // hit 'approve' on the signature confirmation and wait for window to close
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'Approve',
           tag: 'button',
         });
 
         // switch back to the test-snaps window
-        let windowHandles = await driver.waitUntilXWindowHandles(
-          1,
-          1000,
-          10000,
-        );
-        await driver.switchToWindow(windowHandles[0]);
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.TestSnaps);
 
         // check results of the secp256k1 signature with waitForSelector
         await driver.waitForSelector({
@@ -133,15 +136,21 @@ describe('Test Snap bip-32', function () {
         await driver.fill('#bip32Message-ed25519', 'foo bar');
         await driver.clickElement('#sendBip32-ed25519');
 
-        // hit 'approve' on the custom confirm
-        await switchToNotificationWindow(driver, 2);
-        await driver.clickElement({
+        // switch to dialog window
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
+
+        // wait for and click 'approve' and wait for window to close
+        await driver.waitForSelector({
+          text: 'Approve',
+          tag: 'button',
+        });
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'Approve',
           tag: 'button',
         });
 
-        windowHandles = await driver.waitUntilXWindowHandles(1, 1000, 10000);
-        await driver.switchToWindow(windowHandles[0]);
+        // switch back to test-snaps window
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.TestSnaps);
 
         // check results of ed25519 signature with waitForSelector
         await driver.waitForSelector({

diff --git a/test/e2e/snaps/test-snap-bip-44.spec.js b/test/e2e/snaps/test-snap-bip-44.spec.js
@@ -2,7 +2,6 @@ const {
   defaultGanacheOptions,
   withFixtures,
   unlockWallet,
-  switchToNotificationWindow,
   WINDOW_TITLES,
 } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
@@ -28,14 +27,19 @@ describe('Test Snap bip-44', function () {
           tag: 'h2',
         });
 
-        // find and scroll to the bip44 test and connect
+        // find and scroll to the bip44 snap
         const snapButton1 = await driver.findElement('#connectbip44');
         await driver.scrollToElement(snapButton1);
+
+        // added delay for firefox (deflake)
+        await driver.delayFirefox(1000);
+
+        // wait for and click connect
         await driver.waitForSelector('#connectbip44');
         await driver.clickElement('#connectbip44');
 
         // switch to metamask extension and click connect and approve
-        await switchToNotificationWindow(driver, 2);
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
         await driver.clickElement({
           text: 'Connect',
           tag: 'button',
@@ -59,9 +63,9 @@ describe('Test Snap bip-44', function () {
           '[data-testid="snap-install-warning-modal-confirm"]',
         );
 
-        // deal with OK button
+        // wait for and click ok and wait for window to close
         await driver.waitForSelector({ text: 'OK' });
-        await driver.clickElement({
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'OK',
           tag: 'button',
         });
@@ -91,20 +95,21 @@ describe('Test Snap bip-44', function () {
         await driver.waitForSelector('#signBip44Message');
         await driver.clickElement('#signBip44Message');
 
-        // Switch to approve signature message window and approve
-        await switchToNotificationWindow(driver, 2);
-        await driver.clickElement({
+        // Switch to approve signature message window
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
+
+        // wait for and click approve and wait for window to close
+        await driver.waitForSelector({
+          text: 'Approve',
+          tag: 'button',
+        });
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'Approve',
           tag: 'button',
         });
 
         // switch back to test-snaps page
-        const windowHandles = await driver.waitUntilXWindowHandles(
-          1,
-          1000,
-          10000,
-        );
-        await driver.switchToWindow(windowHandles[0]);
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.TestSnaps);
 
         // check the results of the message signature using waitForSelector
         await driver.waitForSelector({

diff --git a/test/e2e/snaps/test-snap-clientstatus.spec.js b/test/e2e/snaps/test-snap-clientstatus.spec.js
@@ -2,7 +2,6 @@ const {
   defaultGanacheOptions,
   withFixtures,
   unlockWallet,
-  switchToNotificationWindow,
   WINDOW_TITLES,
 } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
@@ -28,28 +27,40 @@ describe('Test Snap Client Status', function () {
           tag: 'h2',
         });
 
+        // scroll to and click connect to client-status snap
         const snapButton = await driver.findElement('#connectclient-status');
         await driver.scrollToElement(snapButton);
-        await driver.delay(1000);
+
+        // added delay for firefox (deflake)
+        await driver.delayFirefox(1000);
+
+        // wait for and click connect
+        await driver.waitForSelector('#connectclient-status');
         await driver.clickElement('#connectclient-status');
 
-        // switch to metamask extension and click connect
-        await switchToNotificationWindow(driver);
+        // switch to metamask extension
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
+
+        // wait for and click connect
+        await driver.waitForSelector({
+          text: 'Connect',
+          tag: 'button',
+        });
         await driver.clickElement({
           text: 'Connect',
           tag: 'button',
         });
 
+        // wait for and click confirm
         await driver.waitForSelector({ text: 'Confirm' });
-
         await driver.clickElement({
           text: 'Confirm',
           tag: 'button',
         });
 
+        // wait for and click ok and wait for window to close
         await driver.waitForSelector({ text: 'OK' });
-
-        await driver.clickElement({
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'OK',
           tag: 'button',
         });
@@ -77,7 +88,7 @@ describe('Test Snap Client Status', function () {
           WINDOW_TITLES.ExtensionInFullScreenView,
         );
 
-        // click on the global action menu
+        // wait for and click on the global action menu
         await driver.waitForSelector(
           '[data-testid="account-options-menu-button"]',
         );

diff --git a/test/e2e/snaps/test-snap-cronjob.spec.js b/test/e2e/snaps/test-snap-cronjob.spec.js
@@ -2,7 +2,6 @@ const {
   defaultGanacheOptions,
   withFixtures,
   unlockWallet,
-  switchToNotificationWindow,
   WINDOW_TITLES,
 } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
@@ -28,28 +27,40 @@ describe('Test Snap Cronjob', function () {
           tag: 'h2',
         });
 
+        // scroll to and connect to cronjobs snap
         const snapButton = await driver.findElement('#connectcronjobs');
         await driver.scrollToElement(snapButton);
-        await driver.delay(500);
+
+        // added delay for firefox (deflake)
+        await driver.delayFirefox(1000);
+
+        // wait for and click connect
+        await driver.waitForSelector('#connectcronjobs');
         await driver.clickElement('#connectcronjobs');
 
-        // switch to metamask extension and click connect
-        await switchToNotificationWindow(driver);
+        // switch to metamask extension
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
+
+        // wait for and click connect
+        await driver.waitForSelector({
+          text: 'Connect',
+          tag: 'button',
+        });
         await driver.clickElement({
           text: 'Connect',
           tag: 'button',
         });
 
+        // wait for and click confirm
         await driver.waitForSelector({ text: 'Confirm' });
-
         await driver.clickElement({
           text: 'Confirm',
           tag: 'button',
         });
 
+        // wait for and click ok and wait for window to close
         await driver.waitForSelector({ text: 'OK' });
-
-        await driver.clickElement({
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'OK',
           tag: 'button',
         });
@@ -64,16 +75,16 @@ describe('Test Snap Cronjob', function () {
         });
 
         // switch to dialog popup, wait for a maximum of 65 seconds
-        await switchToNotificationWindow(driver);
+        await driver.switchToWindowWithTitle(WINDOW_TITLES.Dialog);
 
         // look for the dialog popup to verify cronjob fired
         await driver.waitForSelector({
           css: '.snap-ui-renderer__content',
           text: 'This dialog was triggered by a cronjob',
         });
 
-        // try to click on the Ok button and pass test if it works
-        await driver.clickElement({
+        // try to click on the Ok button and pass test if window closes
+        await driver.clickElementAndWaitForWindowToClose({
           text: 'OK',
           tag: 'button',
         });