Merge pull request #821 from Synthetixio/extension-id

use extension-id for metamask / get extension data
Synthetixio · Aug 2, 2023 · 6fa125f · 6fa125f
2 parents 14630d6 + 1b15990
commit 6fa125f
Show file tree

Hide file tree

Showing 3 changed files with 110 additions and 12 deletions.
diff --git a/commands/metamask.js b/commands/metamask.js
@@ -40,8 +40,8 @@ const {
   getCurrentNetwork,
 } = require('../helpers');
 
-let extensionInitialUrl;
 let extensionId;
+let extensionVersion;
 let extensionHomeUrl;
 let extensionSettingsUrl;
 let extensionAdvancedSettingsUrl;
@@ -59,7 +59,6 @@ const metamask = {
   },
   extensionUrls: () => {
     return {
-      extensionInitialUrl,
       extensionHomeUrl,
       extensionSettingsUrl,
       extensionAdvancedSettingsUrl,
@@ -105,8 +104,11 @@ const metamask = {
     await module.exports.goTo(extensionImportTokenUrl);
   },
   async getExtensionDetails() {
-    extensionInitialUrl = await playwright.metamaskWindow().url();
-    extensionId = extensionInitialUrl.match('//(.*?)/')[1];
+    const metamaskExtensionData = (await playwright.getExtensionsData())
+      .metamask;
+
+    extensionId = metamaskExtensionData.id;
+    extensionVersion = metamaskExtensionData.version;
     extensionHomeUrl = `chrome-extension://${extensionId}/home.html`;
     extensionSettingsUrl = `${extensionHomeUrl}#settings`;
     extensionAdvancedSettingsUrl = `${extensionSettingsUrl}/advanced`;
@@ -117,8 +119,8 @@ const metamask = {
     extensionImportTokenUrl = `${extensionHomeUrl}#import-token`;
 
     return {
-      extensionInitialUrl,
       extensionId,
+      extensionVersion,
       extensionSettingsUrl,
       extensionAdvancedSettingsUrl,
       extensionExperimentalSettingsUrl,

diff --git a/commands/playwright.js b/commands/playwright.js
@@ -7,17 +7,20 @@ const { pageElements } = require('../pages/metamask/page');
 const {
   onboardingWelcomePageElements,
 } = require('../pages/metamask/first-time-flow-page');
-// const metamask = require('./metamask');
 const sleep = require('util').promisify(setTimeout);
+const _ = require('underscore');
 
 let browser;
 let mainWindow;
 let metamaskWindow;
 let metamaskNotificationWindow;
+let metamaskPopupWindow;
 let activeTabName;
 
 let retries = 0;
 
+let extensionsData = {};
+
 module.exports = {
   browser() {
     return browser;
@@ -31,6 +34,9 @@ module.exports = {
   metamaskNotificationWindow() {
     return metamaskNotificationWindow;
   },
+  metamaskPopupWindow() {
+    return metamaskPopupWindow;
+  },
   activeTabName() {
     return activeTabName;
   },
@@ -61,14 +67,33 @@ module.exports = {
     return true;
   },
   async assignWindows() {
+    const metamaskExtensionData = (await module.exports.getExtensionsData())
+      .metamask;
+
     let pages = await browser.contexts()[0].pages();
     for (const page of pages) {
-      if (page.url().includes('runner')) {
+      if (page.url().includes('specs/runner')) {
         mainWindow = page;
-      } else if (page.url().includes('extension')) {
+      } else if (
+        page
+          .url()
+          .includes(`chrome-extension://${metamaskExtensionData.id}/home.html`)
+      ) {
         metamaskWindow = page;
-      } else if (page.url().includes('notification')) {
+      } else if (
+        page
+          .url()
+          .includes(
+            `chrome-extension://${metamaskExtensionData.id}/notification.html`,
+          )
+      ) {
         metamaskNotificationWindow = page;
+      } else if (
+        page
+          .url()
+          .includes(`chrome-extension://${metamaskExtensionData.id}/popup.html`)
+      ) {
+        metamaskPopupWindow = page;
       }
     }
     return true;
@@ -81,6 +106,7 @@ module.exports = {
     mainWindow = null;
     metamaskWindow = null;
     metamaskNotificationWindow = null;
+    metamaskPopupWindow = null;
     return true;
   },
   async isCypressWindowActive() {
@@ -109,10 +135,24 @@ module.exports = {
     await module.exports.assignActiveTabName('metamask-notif');
     return true;
   },
+  async switchToMetamaskPopupWindow() {
+    await metamaskPopupWindow.bringToFront();
+    await module.exports.assignActiveTabName('metamask-popup');
+    return true;
+  },
   async switchToMetamaskNotification() {
+    const metamaskExtensionData = (await module.exports.getExtensionsData())
+      .metamask;
+
     let pages = await browser.contexts()[0].pages();
     for (const page of pages) {
-      if (page.url().includes('notification')) {
+      if (
+        page
+          .url()
+          .includes(
+            `chrome-extension://${metamaskExtensionData.id}/notification.html`,
+          )
+      ) {
         metamaskNotificationWindow = page;
         retries = 0;
         await page.bringToFront();
@@ -270,7 +310,17 @@ module.exports = {
     }
   },
   async waitUntilStable(page) {
-    if (page && page.url().includes('notification')) {
+    const metamaskExtensionData = (await module.exports.getExtensionsData())
+      .metamask;
+
+    if (
+      page &&
+      page
+        .url()
+        .includes(
+          `chrome-extension://${metamaskExtensionData.id}/notification.html`,
+        )
+    ) {
       await page.waitForLoadState('load');
       await page.waitForLoadState('domcontentloaded');
       await page.waitForLoadState('networkidle');
@@ -365,4 +415,50 @@ module.exports = {
       }
     }
   },
+  async getExtensionsData() {
+    if (!_.isEmpty(extensionsData)) {
+      return extensionsData;
+    }
+
+    const context = await browser.contexts()[0];
+    const page = await context.newPage();
+
+    await page.goto('chrome://extensions');
+    await page.waitForLoadState('load');
+    await page.waitForLoadState('domcontentloaded');
+
+    const devModeButton = page.locator('#devMode');
+    await devModeButton.waitFor();
+    await devModeButton.focus();
+    await devModeButton.click();
+
+    const extensionDataItems = await page.locator('extensions-item').all();
+    for (const extensionData of extensionDataItems) {
+      const extensionName = (
+        await extensionData
+          .locator('#name-and-version')
+          .locator('#name')
+          .textContent()
+      ).toLowerCase();
+
+      const extensionVersion = (
+        await extensionData
+          .locator('#name-and-version')
+          .locator('#version')
+          .textContent()
+      ).replace(/(\n| )/g, '');
+
+      const extensionId = (
+        await extensionData.locator('#extension-id').textContent()
+      ).replace('ID: ', '');
+
+      extensionsData[extensionName] = {
+        version: extensionVersion,
+        id: extensionId,
+      };
+    }
+    await page.close();
+
+    return extensionsData;
+  },
 };
diff --git a/tests/e2e/specs/metamask-spec.js b/tests/e2e/specs/metamask-spec.js
@@ -78,7 +78,7 @@ describe('Metamask', () => {
         }).then(networkAdded => {
           expect(networkAdded).to.be.true;
         });
-        cy.get('#network').contains('10');
+        cy.get('#network').contains('0xa');
         cy.get('#chainId').contains('0xa');
       }
     });