show iframe popups in root frame

ext/fg/js/frontend-initialize.js

@@ -20,6 +20,7 @@
  * Frontend
  * PopupProxy
  * PopupProxyHost
+ * apiForward
  */
 
 async function main() {
@@ -29,7 +30,25 @@ async function main() {
     const {id, depth=0, parentFrameId, url, proxy=false} = data;
 
     let popup;
-    if (proxy) {
+    if (!proxy && (window !== window.parent)) {
+        let rootPopupInformationResolve;
+        const rootPopupInformationPromise = new Promise((resolve) => (rootPopupInformationResolve = resolve));
+
+        const runtimeMessageCallback = ({action, params}, sender, callback) => {
+            if (action === 'rootPopupInformation') {
+                chrome.runtime.onMessage.removeListener(runtimeMessageCallback);
+                callback();
+                rootPopupInformationResolve(params);
+                return false;
+            }
+        };
+        chrome.runtime.onMessage.addListener(runtimeMessageCallback);
+        apiForward('rootPopupInformationGet');
+
+        const {popupId, frameId} = await rootPopupInformationPromise;
+
+        popup = new PopupProxy(popupId, 0, null, frameId, url);
+    } else if (proxy) {
         popup = new PopupProxy(null, depth + 1, id, parentFrameId, url);
     } else {
         const popupHost = new PopupProxyHost();

ext/fg/js/frontend.js

@@ -52,7 +52,8 @@ class Frontend extends TextScanner {
         ]);
 
         this._runtimeMessageHandlers = new Map([
-            ['popupSetVisibleOverride', ({visible}) => { this.popup.setVisibleOverride(visible); }]
+            ['popupSetVisibleOverride', ({visible}) => { this.popup.setVisibleOverride(visible); }],
+            ['rootPopupInformationGet', () => { this.popup.broadcastRootPopupInformation(); }]
         ]);
     }
 

ext/fg/js/popup.js

@@ -17,6 +17,7 @@
  */
 
 /* global
+ * apiForward
  * apiGetMessageToken
  * apiInjectStylesheet
  */
@@ -79,6 +80,20 @@ class Popup {
         return false;
     }
 
+    async broadcastRootPopupInformation() {
+        if (this._depth === 0) {
+            try {
+                const {frameId} = await this._frameIdPromise;
+                if (typeof frameId === 'number') {
+                    this._frameId = frameId;
+                }
+            } catch (e) {
+                // NOP
+            }
+            apiForward('rootPopupInformation', {popupId: this._id, frameId: this._frameId});
+        }
+    }
+
     async setOptions(options) {
         this._options = options;
         this.updateTheme();
@@ -202,6 +217,10 @@ class Popup {
             // NOP
         }
 
+        if (this._depth === 0) {
+            apiForward('rootPopupInformation', {popupId: this._id, frameId: this._frameId});
+        }
+
         if (this._messageToken === null) {
             this._messageToken = await apiGetMessageToken();
         }

ext/manifest.json

@@ -23,9 +23,11 @@
             "mixed/js/api.js",
             "mixed/js/text-scanner.js",
             "fg/js/document.js",
+            "fg/js/frontend-api-sender.js",
             "fg/js/frontend-api-receiver.js",
             "fg/js/popup.js",
             "fg/js/source.js",
+            "fg/js/popup-proxy.js",
             "fg/js/popup-proxy-host.js",
             "fg/js/frontend.js",
             "fg/js/frontend-initialize.js"