[FLASK] More Snaps E2E Optimization and Delay Reductions (#18245)

* bip32 delay reduction

* asserts changed to waitFors in 32/44

* scrollTo change

* replaced delay for firefox flake

* more reduced delays

* more delay reductions and changes

* raise paralellism to 4 for snaps tests

* additional delay changes

* fixed update code

* removed comment

* removed another comment

.circleci/config.yml

@@ -701,7 +701,7 @@ jobs:
 
   test-e2e-firefox-snaps:
     executor: node-browsers
-    parallelism: 2
+    parallelism: 4
     steps:
       - checkout
       - run:
@@ -738,7 +738,7 @@ jobs:
 
   test-e2e-chrome-snaps:
     executor: node-browsers
-    parallelism: 2
+    parallelism: 4
     steps:
       - checkout
       - run:

test/e2e/snaps/test-snap-bip-32.spec.js

@@ -1,4 +1,3 @@
-const { strict: assert } = require('assert');
 const { withFixtures } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
 const { TEST_SNAPS_WEBSITE_URL } = require('./enums');
@@ -61,7 +60,7 @@ describe('Test Snap bip-32', function () {
         });
 
         // wait for permissions popover, click checkboxes and confirm
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#key-access-bip32-m-44h-0h-secp256k1-0');
         await driver.clickElement('#key-access-bip32-m-44h-0h-ed25519-1');
         await driver.clickElement(
@@ -73,7 +72,6 @@ describe('Test Snap bip-32', function () {
         });
 
         await driver.waitForSelector({ text: 'Ok' });
-
         await driver.clickElement({
           text: 'Ok',
           tag: 'button',
@@ -90,46 +88,30 @@ describe('Test Snap bip-32', function () {
 
         // scroll to and click get public key
         await driver.delay(1000);
-        const snapButton2 = await driver.findElement('#bip32GetPublic');
+        await driver.waitForSelector({ text: 'Get Public Key' });
-        await driver.scrollToElement(snapButton2);
-        await driver.delay(1000);
         await driver.clickElement('#bip32GetPublic');
 
-        // check for proper public key response
+        // check for proper public key response using waitForSelector
-        await driver.delay(1000);
+        await driver.waitForSelector({
-        const retrievePublicKeyResult1 = await driver.findElement(
+          css: '#bip32PublicKeyResult',
-          '#bip32PublicKeyResult',
+          text: '"0x043e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366606ece56791c361a2320e7fad8bcbb130f66d51c591fc39767ab2856e93f8dfb',
-        );
+        });
-        assert.equal(
-          await retrievePublicKeyResult1.getText(),
-          '"0x043e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366606ece56791c361a2320e7fad8bcbb130f66d51c591fc39767ab2856e93f8dfb"',
-        );
 
         // scroll to and click get compressed public key
-        await driver.delay(1000);
+        await driver.waitForSelector({ text: 'Get Compressed Public Key' });
-        const snapButton3 = await driver.findElement(
-          '#bip32GetCompressedPublic',
-        );
-        await driver.scrollToElement(snapButton3);
-        await driver.delay(1000);
         await driver.clickElement('#bip32GetCompressedPublic');
 
-        // check for proper public key response
+        // check for proper public key response using waitForSelector
-        await driver.delay(1000);
+        await driver.waitForSelector({
-        const retrievePublicKeyResult2 = await driver.findElement(
+          css: '#bip32PublicKeyResult',
-          '#bip32PublicKeyResult',
+          text: '"0x033e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366',
-        );
+        });
-        assert.equal(
-          await retrievePublicKeyResult2.getText(),
-          '"0x033e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366"',
-        );
 
         // wait then run SECP256K1 test
-        await driver.delay(1000);
+        await driver.fill('#bip32Message-secp256k1', 'foo bar');
-        await driver.pasteIntoField('#bip32Message-secp256k1', 'foo bar');
         await driver.clickElement('#sendBip32-secp256k1');
 
-        // hit 'approve' on the custom confirm
+        // hit 'approve' on the signature confirmation
         windowHandles = await driver.waitUntilXWindowHandles(2, 1000, 10000);
         await driver.switchToWindowWithTitle(
           'MetaMask Notification',
@@ -140,28 +122,23 @@ describe('Test Snap bip-32', function () {
           tag: 'button',
         });
 
+        // switch back to the test-snaps window
         windowHandles = await driver.waitUntilXWindowHandles(1, 1000, 10000);
         await driver.switchToWindowWithTitle('Test Snaps', windowHandles);
 
-        // check result
+        // check results of the secp256k1 signature with waitForSelector
-        await driver.delay(1000);
+        await driver.waitForSelector({
-        const secp256k1Result = await driver.findElement(
+          css: '#bip32MessageResult-secp256k1',
-          '#bip32MessageResult-secp256k1',
+          text: '"0x3045022100b3ade2992ea3e5eb58c7550e9bddad356e9554233c8b099ebc3cb418e9301ae2022064746e15ae024808f0ba5d860e44dc4c97e65c8cba6f5ef9ea2e8c819930d2dc',
-        );
+        });
-        assert.equal(
-          await secp256k1Result.getText(),
-          '"0x3045022100b3ade2992ea3e5eb58c7550e9bddad356e9554233c8b099ebc3cb418e9301ae2022064746e15ae024808f0ba5d860e44dc4c97e65c8cba6f5ef9ea2e8c819930d2dc"',
-        );
 
         // scroll further into messages section
-        await driver.delay(1000);
+        const snapButton4 = await driver.findElement('#sendBip32-ed25519');
-        const snapButton4 = await driver.findElement('#bip32Message-ed25519');
         await driver.scrollToElement(snapButton4);
-        await driver.delay(1000);
 
         // wait then run ed25519 test
-        await driver.delay(1000);
+        await driver.delay(500);
-        await driver.pasteIntoField('#bip32Message-ed25519', 'foo bar');
+        await driver.fill('#bip32Message-ed25519', 'foo bar');
         await driver.clickElement('#sendBip32-ed25519');
 
         // hit 'approve' on the custom confirm
@@ -178,15 +155,11 @@ describe('Test Snap bip-32', function () {
         windowHandles = await driver.waitUntilXWindowHandles(1, 1000, 10000);
         await driver.switchToWindowWithTitle('Test Snaps', windowHandles);
 
-        // check result
+        // check results of ed25519 signature with waitForSelector
-        await driver.delay(1000);
+        await driver.waitForSelector({
-        const ed25519Result = await driver.findElement(
+          css: '#bip32MessageResult-ed25519',
-          '#bip32MessageResult-ed25519',
+          text: '"0xf3215b4d6c59aac7e01b4ceef530d1e2abf4857926b85a81aaae3894505699243768a887b7da4a8c2e0f25196196ba290b6531050db8dc15c252bdd508532a0a"',
-        );
+        });
-        assert.equal(
-          await ed25519Result.getText(),
-          '"0xf3215b4d6c59aac7e01b4ceef530d1e2abf4857926b85a81aaae3894505699243768a887b7da4a8c2e0f25196196ba290b6531050db8dc15c252bdd508532a0a"',
-        );
       },
     );
   });

test/e2e/snaps/test-snap-bip-44.spec.js

@@ -1,4 +1,3 @@
-const { strict: assert } = require('assert');
 const { withFixtures } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
 const { TEST_SNAPS_WEBSITE_URL } = require('./enums');
@@ -31,13 +30,15 @@ describe('Test Snap bip-44', function () {
         // navigate to test snaps page and connect
         await driver.driver.get(TEST_SNAPS_WEBSITE_URL);
         await driver.delay(1000);
+
+        // find and scroll to the bip44 test and connect
         const snapButton1 = await driver.findElement('#connectBip44Snap');
         await driver.scrollToElement(snapButton1);
         await driver.delay(1000);
         await driver.clickElement('#connectBip44Snap');
         await driver.delay(1000);
 
-        // switch to metamask extension and click connect
+        // switch to metamask extension and click connect and approve
         let windowHandles = await driver.waitUntilXWindowHandles(
           2,
           1000,
@@ -51,31 +52,26 @@ describe('Test Snap bip-44', function () {
           text: 'Connect',
           tag: 'button',
         });
-
         await driver.waitForSelector({ text: 'Approve & install' });
-
         await driver.clickElement({
           text: 'Approve & install',
           tag: 'button',
         });
 
         // deal with permissions popover
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#key-access-bip44-1-0');
-        await driver.delay(1500);
         await driver.clickElement({
           text: 'Confirm',
           tag: 'button',
         });
-
         await driver.waitForSelector({ text: 'Ok' });
-
         await driver.clickElement({
           text: 'Ok',
           tag: 'button',
         });
 
-        // click send inputs on test snap page
+        // switch back to test-snaps window
         await driver.switchToWindowWithTitle('Test Snaps', windowHandles);
 
         // wait for npm installation success
@@ -84,22 +80,21 @@ describe('Test Snap bip-44', function () {
           text: 'Reconnect to BIP-44 Snap',
         });
 
+        // find and click bip44 test
         await driver.clickElement('#sendBip44Test');
 
-        // check the results of the public key test
+        // check the results of the public key test using waitForSelector
-        await driver.delay(1000);
+        await driver.waitForSelector({
-        const bip44Result = await driver.findElement('#bip44Result');
+          css: '#bip44Result',
-        assert.equal(
+          text: '"0x86debb44fb3a984d93f326131d4c1db0bc39644f1a67b673b3ab45941a1cea6a385981755185ac4594b6521e4d1e08d1"',
-          await bip44Result.getText(),
+        });
-          '"0x86debb44fb3a984d93f326131d4c1db0bc39644f1a67b673b3ab45941a1cea6a385981755185ac4594b6521e4d1e08d1"',
-        );
 
         // enter a message to sign
         await driver.pasteIntoField('#bip44Message', '1234');
-        await driver.delay(1000);
+        await driver.delay(500);
         const snapButton3 = await driver.findElement('#signBip44Message');
         await driver.scrollToElement(snapButton3);
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#signBip44Message');
 
         // Switch to approve signature message window and approve
@@ -116,14 +111,12 @@ describe('Test Snap bip-44', function () {
         // switch back to test-snaps page
         windowHandles = await driver.waitUntilXWindowHandles(1, 1000, 10000);
         await driver.switchToWindowWithTitle('Test Snaps', windowHandles);
-        await driver.delay(1000);
 
-        // check the results of the message signature
+        // check the results of the message signature using waitForSelector
-        const bip44SignResult = await driver.findElement('#bip44SignResult');
+        await driver.waitForSelector({
-        assert.equal(
+          css: '#bip44SignResult',
-          await bip44SignResult.getText(),
+          text: '"0xa41ab87ca50606eefd47525ad90294bbe44c883f6bc53655f1b8a55aa8e1e35df216f31be62e52c7a1faa519420e20810162e07dedb0fde2a4d997ff7180a78232ecd8ce2d6f4ba42ccacad33c5e9e54a8c4d41506bdffb2bb4c368581d8b086"',
-          '"0xa41ab87ca50606eefd47525ad90294bbe44c883f6bc53655f1b8a55aa8e1e35df216f31be62e52c7a1faa519420e20810162e07dedb0fde2a4d997ff7180a78232ecd8ce2d6f4ba42ccacad33c5e9e54a8c4d41506bdffb2bb4c368581d8b086"',
+        });
-        );
       },
     );
   });

test/e2e/snaps/test-snap-dialog.spec.js

@@ -77,7 +77,7 @@ describe('Test Snap Dialog', function () {
 
         // click on alert dialog
         await driver.clickElement('#sendAlertButton');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to dialog popup
         windowHandles = await driver.waitUntilXWindowHandles(3, 1000, 10000);
@@ -85,12 +85,12 @@ describe('Test Snap Dialog', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // check dialog contents
         let result = await driver.findElement('.snap-ui-renderer__panel');
         await driver.scrollToElement(result);
-        await driver.delay(1000);
+        await driver.delay(500);
         assert.equal(await result.getText(), 'Alert Dialog\nText here');
 
         // click ok button
@@ -105,12 +105,12 @@ describe('Test Snap Dialog', function () {
 
         // check result is null
         result = await driver.findElement('#dialogResult');
-        await driver.delay(1000);
+        await driver.delay(500);
         assert.equal(await result.getText(), 'null');
 
         // click conf button
         await driver.clickElement('#sendConfButton');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to dialog popup
         windowHandles = await driver.waitUntilXWindowHandles(3, 1000, 10000);
@@ -118,7 +118,7 @@ describe('Test Snap Dialog', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // click reject
         await driver.clickElement({
@@ -132,12 +132,12 @@ describe('Test Snap Dialog', function () {
 
         // check for false result
         result = await driver.findElement('#dialogResult');
-        await driver.delay(1000);
+        await driver.delay(500);
         assert.equal(await result.getText(), 'false');
 
         // click conf button again
         await driver.clickElement('#sendConfButton');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to dialog popup
         windowHandles = await driver.waitUntilXWindowHandles(3, 1000, 10000);
@@ -145,7 +145,7 @@ describe('Test Snap Dialog', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // click accept
         await driver.clickElement({
@@ -159,12 +159,12 @@ describe('Test Snap Dialog', function () {
 
         // check for true result
         result = await driver.findElement('#dialogResult');
-        await driver.delay(1000);
+        await driver.delay(500);
         assert.equal(await result.getText(), 'true');
 
         // click prompt button
         await driver.clickElement('#sendPromptButton');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to dialog popup
         windowHandles = await driver.waitUntilXWindowHandles(3, 1000, 10000);
@@ -172,7 +172,7 @@ describe('Test Snap Dialog', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // click cancel button
         await driver.clickElement({
@@ -186,12 +186,12 @@ describe('Test Snap Dialog', function () {
 
         // check result is equal to 'null'
         result = await driver.findElement('#dialogResult');
-        await driver.delay(1000);
+        await driver.delay(500);
         assert.equal(await result.getText(), 'null');
 
         // click prompt button
         await driver.clickElement('#sendPromptButton');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to dialog popup
         windowHandles = await driver.waitUntilXWindowHandles(3, 1000, 10000);
@@ -199,7 +199,7 @@ describe('Test Snap Dialog', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // fill '2323' in form field
         await driver.pasteIntoField('.MuiInput-input', '2323');
@@ -216,7 +216,6 @@ describe('Test Snap Dialog', function () {
 
         // check result is equal to '2323'
         result = await driver.findElement('#dialogResult');
-        await driver.delay(1000);
         assert.equal(await result.getText(), '"2323"');
       },
     );

test/e2e/snaps/test-snap-error.spec.js

@@ -81,7 +81,7 @@ describe('Test Snap Error', function () {
 
         // switch back to the extension page
         await driver.switchToWindow(extensionPage);
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // look for the actual error and check if it is correct
         const error = await driver.findElement(

test/e2e/snaps/test-snap-installed.spec.js

@@ -1,4 +1,3 @@
-const { strict: assert } = require('assert');
 const { withFixtures } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
 const { TEST_SNAPS_WEBSITE_URL } = require('./enums');
@@ -33,9 +32,9 @@ describe('Test Snap Installed', function () {
         await driver.delay(1000);
         const confirmButton = await driver.findElement('#connectDialogSnap');
         await driver.scrollToElement(confirmButton);
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#connectDialogSnap');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // switch to metamask extension and click connect
         let windowHandles = await driver.waitUntilXWindowHandles(
@@ -77,7 +76,7 @@ describe('Test Snap Installed', function () {
 
         const errorButton = await driver.findElement('#connectErrorSnap');
         await driver.scrollToElement(errorButton);
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#connectErrorSnap');
 
         // switch to metamask extension and click connect
@@ -109,17 +108,9 @@ describe('Test Snap Installed', function () {
 
         // wait for npm installation success
         await driver.waitForSelector({
-          css: '#connectErrorSnap',
+          css: '#installedSnapsResult',
-          text: 'Reconnect to Error Snap',
+          text: 'npm:@metamask/test-snap-dialog, npm:@metamask/test-snap-error',
         });
-
-        const result = await driver.findElement('#installedSnapsResult');
-        await driver.scrollToElement(result);
-        await driver.delay(1000);
-        assert.equal(
-          await result.getText(),
-          'npm:@metamask/test-snap-dialog, npm:@metamask/test-snap-error',
-        );
       },
     );
   });

test/e2e/snaps/test-snap-notification.spec.js

@@ -82,7 +82,7 @@ describe('Test Snap Notification', function () {
 
         // switch back to the extension page
         await driver.switchToWindow(extensionPage);
-        await driver.delay(1500);
+        await driver.delay(1000);
 
         // check to see that there is one notification
         const notificationResult = await driver.findElement(
@@ -92,14 +92,14 @@ describe('Test Snap Notification', function () {
 
         // try to click on the account menu icon (via xpath)
         await driver.clickElement('.account-menu__icon');
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // try to click on the notification item (via xpath)
         await driver.clickElement({
           text: 'Notifications',
           tag: 'div',
         });
-        await driver.delay(1000);
+        await driver.delay(500);
 
         // look for the correct text in notifications (via xpath)
         const notificationResultMessage = await driver.findElement(

test/e2e/snaps/test-snap-rpc.spec.js

@@ -1,4 +1,3 @@
-const { strict: assert } = require('assert');
 const { withFixtures } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
 const { TEST_SNAPS_WEBSITE_URL } = require('./enums');
@@ -62,7 +61,7 @@ describe('Test Snap RPC', function () {
         });
 
         // wait for permissions popover, click checkboxes and confirm
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#key-access-bip32-m-44h-0h-secp256k1-0');
         await driver.clickElement('#key-access-bip32-m-44h-0h-ed25519-1');
         await driver.clickElement(
@@ -127,14 +126,11 @@ describe('Test Snap RPC', function () {
         await driver.delay(1000);
         await driver.clickElement('#sendRpc');
 
-        // delay for result creation
+        // check result with waitForSelector
-        await driver.delay(2500);
+        await driver.waitForSelector({
-
+          css: '#rpcResult',
-        const confirmResult = await driver.findElement('#rpcResult');
+          text: '"0x033e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366"',
-        assert.equal(
+        });
-          await confirmResult.getText(),
-          '"0x033e98d696ae15caef75fa8dd204a7c5c08d1272b2218ba3c20feeb4c691eec366"',
-        );
       },
     );
   });

test/e2e/snaps/test-snap-txinsights.spec.js

@@ -100,7 +100,7 @@ describe('Test Snap TxInsights', function () {
           'MetaMask Notification',
           windowHandles,
         );
-        await driver.delay(2000);
+        await driver.delay(1000);
         await driver.clickElement({
           text: 'TxInsightsTest',
           tag: 'button',

test/e2e/snaps/test-snap-update.spec.js

@@ -1,4 +1,3 @@
-const { strict: assert } = require('assert');
 const { withFixtures } = require('../helpers');
 const FixtureBuilder = require('../fixture-builder');
 const { TEST_SNAPS_WEBSITE_URL } = require('./enums');
@@ -37,7 +36,7 @@ describe('Test Snap update', function () {
         await driver.scrollToElement(snapButton);
         await driver.delay(1000);
         await driver.clickElement('#connectUpdate');
-        await driver.delay(2000);
+        await driver.delay(1000);
 
         // switch to metamask extension and click connect
         let windowHandles = await driver.waitUntilXWindowHandles(
@@ -62,7 +61,7 @@ describe('Test Snap update', function () {
         });
 
         // wait for permissions popover, click checkboxes and confirm
-        await driver.delay(1000);
+        await driver.delay(500);
         await driver.clickElement('#key-access-bip32-m-44h-0h-secp256k1-0');
         await driver.clickElement('#key-access-bip32-m-44h-0h-ed25519-1');
         await driver.clickElement(
@@ -96,11 +95,8 @@ describe('Test Snap update', function () {
         await driver.clickElement('#connectUpdateNew');
         await driver.delay(1000);
 
-        // switch to metamask extension and click connect
+        // switch to metamask extension and update
         await driver.waitUntilXWindowHandles(2, 1000, 10000);
-        await driver.delay(1000);
-
-        // approve update of snap
         windowHandles = await driver.getAllWindowHandles();
         await driver.switchToWindowWithTitle(
           'MetaMask Notification',
@@ -125,9 +121,10 @@ describe('Test Snap update', function () {
         await driver.switchToWindowWithTitle('Test Snaps', windowHandles);
 
         // look for the correct version text
-        const versionResult = await driver.findElement('#updateSnapVersion');
+        await driver.waitForSelector({
-        await driver.delay(1000);
+          css: '#updateSnapVersion',
-        assert.equal(await versionResult.getText(), '"5.1.2"');
+          text: '"5.1.2"',
+        });
       },
     );
   });