Merge pull request #48 from gnosis/various-bugfixes

Various bugfixes

extension/.cspell.json

@@ -34,6 +34,7 @@
     "Sindre",
     "Sorhus",
     "Sourcify",
+    "Stakewise",
     "Sushiswap",
     "toastify",
     "typechain",

extension/public/manifest.json

@@ -16,15 +16,6 @@
   "background": {
     "service_worker": "build/background.js"
   },
-  "declarative_net_request": {
-    "rule_resources": [
-      {
-        "id": "rules1",
-        "enabled": true,
-        "path": "requestRules.json"
-      }
-    ]
-  },
   "host_permissions": ["<all_urls>"],
   "content_scripts": [
     {

extension/src/background.ts

@@ -1,13 +1,49 @@
 // Attention: The URL must also be updated in manifest.json
 const PILOT_URL = 'https://pilot.gnosisguild.org/'
 
+// Track tabs showing our extension, so we can dynamically adjust the declarativeNetRequest rule.
+// This rule removes some headers so foreign pages can be loaded in iframes. We don't want to
+// generally circumvent this security mechanism, so we only apply it to extension tabs.
+const activeExtensionTabs = new Set<number>()
+
+const updateRule = () => {
+  const RULE_ID = 1
+  chrome.declarativeNetRequest.updateSessionRules({
+    addRules: [
+      {
+        id: RULE_ID,
+        priority: 1,
+        action: {
+          // @ts-expect-error @types/chrome has not been updated for Chrome Extensions Manifest V3
+          type: 'modifyHeaders',
+          responseHeaders: [
+            // @ts-expect-error @types/chrome has not been updated for Chrome Extensions Manifest V3
+            { header: 'x-frame-options', operation: 'remove' },
+            // @ts-expect-error @types/chrome has not been updated for Chrome Extensions Manifest V3
+            { header: 'content-security-policy', operation: 'remove' },
+          ],
+        },
+        condition: {
+          // @ts-expect-error @types/chrome has not been updated for Chrome Extensions Manifest V3
+          resourceTypes: ['sub_frame'],
+          tabIds: Array.from(activeExtensionTabs),
+        },
+      },
+    ],
+    removeRuleIds: [RULE_ID],
+  })
+}
+
 // When clicking the extension button, load the current tab's page in the simulation browser
 const toggle = async (tab: chrome.tabs.Tab) => {
   if (!tab.id || !tab.url) return
 
   if (!tab.url.startsWith(PILOT_URL)) {
     console.log('activate Zodiac Pilot')
 
+    // add to tracked list
+    activeExtensionTabs.add(tab.id)
+
     const url =
       tab.url.startsWith('chrome://') || tab.url.startsWith('about:')
         ? ''
@@ -18,6 +54,9 @@ const toggle = async (tab: chrome.tabs.Tab) => {
   } else {
     console.log('deactivate Zodiac Pilot')
 
+    // remove from tracked list
+    activeExtensionTabs.delete(tab.id)
+
     const url = new URL(tab.url)
     const appUrl = decodeURIComponent(url.hash.slice(1))
 
@@ -28,9 +67,20 @@ const toggle = async (tab: chrome.tabs.Tab) => {
 }
 chrome.action.onClicked.addListener(toggle)
 
-// launch extension script on matching URLs
-chrome.tabs.onUpdated.addListener(function (tabId, changeInfo) {
-  if (changeInfo.status === 'complete') {
+chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
+  const isExtensionTab = !!tab.url?.startsWith(PILOT_URL)
+  const wasExtensionTab = activeExtensionTabs.has(tabId)
+
+  if (isExtensionTab && !wasExtensionTab) {
+    activeExtensionTabs.add(tabId)
+    updateRule()
+  }
+  if (!isExtensionTab && wasExtensionTab) {
+    activeExtensionTabs.delete(tabId)
+    updateRule()
+  }
+
+  if (changeInfo.status === 'complete' && isExtensionTab) {
     chrome.tabs.sendMessage(tabId, { type: 'navigationDetected' })
   }
 })

extension/src/bridge/iframe.ts

@@ -94,4 +94,12 @@ export default class BridgeIframe extends EventEmitter {
   }
 
   isZodiacPilot = true
+
+  // This is required for connecting to Etherscan
+  enable() {
+    return Promise.resolve()
+  }
+
+  // Stakewise only supports MetaMask and Tally as injected providers, so we pretend to be MetaMask
+  isMetaMask = window.location.hostname === 'app.stakewise.io'
 }

extension/src/settings/connectionHooks.tsx

@@ -36,9 +36,9 @@ export const ProvideConnections: React.FC<{ children: ReactNode }> = ({
     DEFAULT_VALUE,
     'connections'
   )
-  console.log({ storedConnections })
+
   const connections = migrateConnections(storedConnections)
-  console.log({ connections })
+
   const [selectedConnectionId, setSelectedConnectionId] =
     useStickyState<string>(connections[0].id, 'selectedConnection')