More Firefox stuff (#846)

.github/workflows/build.yml

@@ -67,6 +67,59 @@ jobs:
         with:
           name: rainbowbx-${{ github.sha }}.zip
           path: build/
+  # FIREFOX TESTS - Disabled for now till all tests are passing
+  # firefox-e2e-parallel:
+  #   runs-on: ubuntu-latest
+  #   timeout-minutes: 16
+  #   needs: [build]
+  #   env:
+  #     DISPLAY: :0
+  #     VITEST_SEGFAULT_RETRY: 4
+  #   steps:
+  #     - uses: actions/checkout@v3
+  #     - uses: actions/setup-node@v3
+  #       with:
+  #         node-version: "16.20.0"
+  #     - name: Download deps cache artifacts
+  #       uses: actions/download-artifact@v3
+  #       with:
+  #         name: node_modules.tar.gz
+  #     - name: Unzip node_modules
+  #       shell: 'bash'
+  #       run: tar xzf node_modules.tar.gz
+  #     - name: Download build artifacts
+  #       uses: actions/download-artifact@v3
+  #       with:
+  #           name: rainbowbx-${{ github.sha }}.zip
+  #           path: build
+  #     - name: Setup xvfb
+  #       shell: 'bash'
+  #       run: |
+  #         sudo apt-get install -y xvfb libxkbcommon-x11-0 libxcb-icccm4 libxcb-image0 libxcb-keysyms1 libxcb-randr0 libxcb-render-util0 libxcb-xinerama0 libxcb-xinput0 libxcb-xfixes0
+  #         # start xvfb in the background
+  #         sudo /usr/bin/Xvfb $DISPLAY -screen 0 1280x1024x24 &
+  #     - name: Install Anvil
+  #       uses: foundry-rs/foundry-toolchain@v1
+  #       with:
+  #         version: nightly
+  #     - uses: browser-actions/setup-firefox@v1
+  #       with:
+  #         firefox-version: 'latest-devedition'
+  #     - uses: actions/checkout@v3
+  #       with:
+  #           repository: 'rainbow-me/browser-extension-env'
+  #           token: ${{ secrets.DOTENV_GITHUB_ACCESS_TOKEN }}
+  #           path: tmp
+  #     - name: Copy dotenv
+  #       shell: 'bash'
+  #       run: cat tmp/dotenv >> .env && rm -rf tmp
+  #     - name: Run e2e parallel (Firefox)
+  #       run: |
+  #           export BROWSER=firefox
+  #           export OS=linux
+  #           export FIREFOX_BIN=/opt/hostedtoolcache/firefox/latest-devedition/x64/firefox
+  #           yarn firefox:manifest && yarn firefox:zip
+  #           yarn vitest e2e/parallel/newWalletFlow.test.ts --config ./e2e/parallel/vitest.config.ts
   # CHROME TESTS
   chrome-e2e-parallel:
     runs-on: ubuntu-latest

.gitignore

@@ -15,4 +15,6 @@ build/
 src/core/graphql/__generated__/
 
 # Anvil logs
-anvil*.log
+anvil*.log
+
+rainbowbx.xpi

e2e/helpers.ts

@@ -16,7 +16,8 @@ const BINARY_PATHS = {
   mac: {
     chrome: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
     brave: '/Applications/Brave Browser.app/Contents/MacOS/Brave Browser',
-    firefox: '/Applications/Firefox.app/Contents/MacOS/Firefox',
+    firefox:
+      '/Applications/Firefox Developer Edition.app/Contents/MacOS/firefox',
   },
   linux: {
     chrome: process.env.CHROMIUM_BIN,
@@ -90,6 +91,8 @@ export async function getWindowHandle({ driver }) {
 // setup functions
 
 export async function initDriverWithOptions(opts) {
+  let driver;
+
   const args = [
     'load-extension=build/',
     // '--auto-open-devtools-for-tabs',
@@ -101,12 +104,13 @@ export async function initDriverWithOptions(opts) {
     const options = new firefox.Options()
       .setBinary(BINARY_PATHS[opts.os][opts.browser])
       .addArguments(...args.slice(1))
+      .setPreference('xpinstall.signatures.required', false)
+      .setPreference('extensions.langpacks.signatures.required', false)
       .addExtensions('rainbowbx.xpi');
-    options.setAcceptInsecureCerts(true);
 
     const service = new firefox.ServiceBuilder().setStdio('inherit');
 
-    return await new Builder()
+    driver = await new Builder()
       .setFirefoxService(service)
       .forBrowser('firefox')
       .setFirefoxOptions(options)
@@ -119,29 +123,43 @@ export async function initDriverWithOptions(opts) {
 
     const service = new chrome.ServiceBuilder().setStdio('inherit');
 
-    return await new Builder()
+    driver = await new Builder()
       .setChromeService(service)
       .forBrowser('chrome')
       .setChromeOptions(options)
       .build();
   }
+
+  driver.browser = opts.browser;
+  return driver;
 }
 
 export async function getExtensionIdByName(driver, extensionName) {
-  await driver.get('chrome://extensions');
-  return await driver.executeScript(`
-      const extensions = document.querySelector("extensions-manager").shadowRoot
-        .querySelector("extensions-item-list").shadowRoot
-        .querySelectorAll("extensions-item")
-      for (let i = 0; i < extensions.length; i++) {
-        const extension = extensions[i].shadowRoot
-        const name = extension.querySelector('#name').textContent
-        if (name.startsWith("${extensionName}")) {
-          return extensions[i].getAttribute("id")
+  if (driver?.browser === 'firefox') {
+    await driver.get('about:debugging#addons');
+    const text = await driver
+      .wait(
+        until.elementLocated(By.xpath("//dl/div[contains(., 'UUID')]/dd")),
+        1000,
+      )
+      .getText();
+    return text;
+  } else {
+    await driver.get('chrome://extensions');
+    return await driver.executeScript(`
+        const extensions = document.querySelector("extensions-manager").shadowRoot
+          .querySelector("extensions-item-list").shadowRoot
+          .querySelectorAll("extensions-item")
+        for (let i = 0; i < extensions.length; i++) {
+          const extension = extensions[i].shadowRoot
+          const name = extension.querySelector('#name').textContent
+          if (name.startsWith("${extensionName}")) {
+            return extensions[i].getAttribute("id")
+          }
         }
-      }
-      return undefined
-    `);
+        return undefined
+      `);
+  }
 }
 
 // search functions

package.json

@@ -63,10 +63,11 @@
     "vitest:dappInteractions": "./scripts/e2e-serial-tests.sh 'dappInteractions'",
     "e2e:mac:chrome": "BROWSER=chrome OS=mac yarn vitest:parallel && yarn vitest:serial",
     "e2e:mac:brave": "BROWSER=brave OS=mac yarn vitest:parallel && yarn vitest:serial",
-    "e2e:mac:firefox": "BROWSER=firefox OS=mac yarn vitest:parallel",
+    "e2e:mac:firefox": "yarn firefox:zip && BROWSER=firefox OS=mac yarn vitest:parallel",
     "e2e:mac": "yarn e2e:mac:chrome && yarn e2e:mac:brave",
     "e2e": "yarn e2e:mac",
-    "firefox:build": "yarn build && node scripts/firefox-manifest.js",
+    "firefox:manifest": "node scripts/firefox-manifest.js",
+    "firefox:build": "yarn build && yarn firefox:manifest",
     "firefox:zip": "yarn zip && mv rainbowbx.zip rainbowbx.xpi",
     "firefox:lint": "yarn web-ext lint --source-dir ./build",
     "firefox:run": "yarn web-ext run --source-dir ./build/"
@@ -185,7 +186,7 @@
     "eslint-plugin-prettier": "4.2.1",
     "file-loader": "6.2.0",
     "fs-extra": "10.1.0",
-    "geckodriver": "3.1.0",
+    "geckodriver": "4.1.3",
     "globby": "11.0.4",
     "happy-dom": "8.9.0",
     "html-webpack-plugin": "5.5.0",

scripts/firefox-manifest.js

@@ -11,13 +11,7 @@ const manifestFF = {
         "id": "[email protected]",
         "strict_min_version": "115.0"
       },
-    },
-    "content_security_policy": {
-      "extension_pages": "frame-ancestors 'none'; script-src 'self'; object-src 'self';"
-    },
-    "host_permissions": [
-      "<all_urls>",
-    ],
+    }
 };
 
 require('fs').writeFileSync(

src/design-system/components/Alert/Alert.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 
 import { i18n } from '~/core/languages';
 import { shortcuts } from '~/core/references/shortcuts';
@@ -16,11 +16,13 @@ export const Alert = () => {
   const alertCallback = useRef<() => void>();
   const { trackShortcut } = useKeyboardAnalytics();
 
-  listenAlert(async ({ text, callback }: AlertProps) => {
-    setText(text);
-    setVisible(true);
-    alertCallback.current = callback;
-  });
+  useEffect(() => {
+    listenAlert(async ({ text, callback }: AlertProps) => {
+      setText(text);
+      setVisible(true);
+      alertCallback.current = callback;
+    });
+  }, []);
 
   const onClose = useCallback(() => {
     setVisible(false);

static/allowlist.json

@@ -1,29 +1,29 @@
 {
     "urls": [
-        "http://localhost:8545",
-        "http://127.0.0.1:8545",
-        "https://*.alchemyapi.io",
-        "https://*.g.alchemy.com",
-        "wss://*.rainbow.me",
-        "https://*.rainbow.me",
-        "https://*.flashbots.net",
-        "https://gateway.ipfs.io",
-        "wss://*.alchemyapi.io",
-        "wss://*.g.alchemy.com",
-        "https://*.infura.io",
-        "https://burned-solitary-breeze.bsc.quiknode.pro",
-        "ws://localhost:9090",
-        "https://o331974.ingest.sentry.io",
-        "https://api.segment.io",
-        "https://cdn.segment.com",
-        "https://rainbow.imgix.net",
-        "https://firebaseinstallations.googleapis.com/v1/projects/rainbow-me",
-        "https://firebaseremoteconfig.googleapis.com/v1/projects/rainbow-me",
-        "https://fcmregistrations.googleapis.com/v1/projects/rainbow-me",
-        "https://rainbow-me.firebaseapp.com",
-        "https://icons.duckduckgo.com",
-        "https://*.live.ledger.com",
-        "https://rpc.zora.co",
-        "https://falling-wandering-film.base-mainnet.quiknode.pro"
+          "http://127.0.0.1:*",
+          "https://*.g.alchemy.com",
+          "wss://refraction.api.p.rainbow.me",
+          "https://*.p.rainbow.me",
+          "https://aha.rainbow.me",
+          "https://beta-invites.rainbow.me",
+          "https://token-search.rainbow.me",
+          "https://rpc.flashbots.net",
+          "https://protect.flashbots.net",
+          "https://gateway.ipfs.io",
+          "wss://*.g.alchemy.com",
+          "https://*.infura.io",
+          "https://burned-solitary-breeze.bsc.quiknode.pro",
+          "https://o331974.ingest.sentry.io",
+          "https://api.segment.io",
+          "https://cdn.segment.com",
+          "https://rainbow.imgix.net",
+          "https://firebaseinstallations.googleapis.com",
+          "https://firebaseremoteconfig.googleapis.com",
+          "https://fcmregistrations.googleapis.com",
+          "https://rainbow-me.firebaseapp.com",
+          "https://icons.duckduckgo.com",
+          "https://*.live.ledger.com",
+          "https://rpc.zora.co",
+          "https://falling-wandering-film.base-mainnet.quiknode.pro"
     ]
 }