Update nested initialization parameters passed via message rather than using the URL query string

4 files changed, 24 insertions, 28 deletions

diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js
index c0ec8a15..3c521714 100644
--- a/ext/fg/js/float.js
+++ b/ext/fg/js/float.js
@@ -72,6 +72,10 @@ class DisplayFloat extends Display {
                 if (css) {
                     this.setStyle(css);
                 }
+            },
+
+            popupNestedInitialize: ({id, depth, parentFrameId}) => {
+                popupNestedInitialize(id, depth, parentFrameId);
             }
         };
 
diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 9c511d8a..3605dffd 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -37,23 +37,9 @@ class Frontend {
     }
 
     static create() {
-        const floatUrl = chrome.extension.getURL('/fg/float.html');
-        const currentUrl = location.href.replace(/[\?#][\w\W]*$/, "");
-        const isNested = (currentUrl === floatUrl);
-
-        let id = null;
-        let parentFrameId = null;
-        if (isNested) {
-            let match = /[&?]id=([^&]*?)(?:&|$)/.exec(location.href);
-            if (match !== null) {
-                id = match[1];
-            }
-
-            match = /[&?]parent=(\d+)(?:&|$)/.exec(location.href);
-            if (match !== null) {
-                parentFrameId = parseInt(match[1], 10);
-            }
-        }
+        const initializationData = window.frontendInitializationData;
+        const isNested = (initializationData !== null && typeof initializationData === 'object');
+        const {id, parentFrameId} = initializationData || {};
 
         const popup = isNested ? new PopupProxy(id, parentFrameId) : PopupProxyHost.instance.createPopup(null);
         const frontend = new Frontend(popup);
diff --git a/ext/fg/js/popup-nested.js b/ext/fg/js/popup-nested.js
index 7df4e4e2..ad235cc6 100644
--- a/ext/fg/js/popup-nested.js
+++ b/ext/fg/js/popup-nested.js
@@ -17,20 +17,23 @@
  */
 
 
-async function popupNestedSetup() {
-    const options = await apiOptionsGet();
-    const popupNestingMaxDepth = options.scanning.popupNestingMaxDepth;
+let popupNestedInitialized = false;
 
-    let depth = null;
-    const match = /[&?]depth=([^&]*?)(?:&|$)/.exec(location.href);
-    if (match !== null) {
-        depth = parseInt(match[1], 10);
+async function popupNestedInitialize(id, depth, parentFrameId) {
+    if (popupNestedInitialized) {
+        return;
     }
+    popupNestedInitialized = true;
+
+    const options = await apiOptionsGet();
+    const popupNestingMaxDepth = options.scanning.popupNestingMaxDepth;
 
     if (!(typeof popupNestingMaxDepth === 'number' && typeof depth === 'number' && depth < popupNestingMaxDepth)) {
         return;
     }
 
+    window.frontendInitializationData = {id, depth, parentFrameId};
+
     const scriptSrcs = [
         '/fg/js/frontend-api-sender.js',
         '/fg/js/popup.js',
@@ -44,5 +47,3 @@ async function popupNestedSetup() {
         document.body.appendChild(script);
     }
 }
-
-popupNestedSetup();
diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 24b5684d..ab1dbbed 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -29,6 +29,7 @@ class Popup {
         this.container.id = 'yomichan-float';
         this.container.addEventListener('mousedown', e => e.stopPropagation());
         this.container.addEventListener('scroll', e => e.stopPropagation());
+        this.container.setAttribute('src', chrome.extension.getURL('/fg/float.html'));
         this.container.style.width = '0px';
         this.container.style.height = '0px';
         this.injectPromise = null;
@@ -53,9 +54,13 @@ class Popup {
         }
 
         return new Promise((resolve) => {
-            const parent = (typeof this.frameId === 'number' ? this.frameId : '');
-            this.container.setAttribute('src', chrome.extension.getURL(`/fg/float.html?id=${this.id}&depth=${this.depth}&parent=${parent}`));
+            const parentFrameId = (typeof this.frameId === 'number' ? this.frameId : null);
             this.container.addEventListener('load', () => {
+                this.invokeApi('popupNestedInitialize', {
+                    id: this.id,
+                    depth: this.depth,
+                    parentFrameId
+                });
                 this.invokeApi('setOptions', {
                     general: {
                         customPopupCss: options.general.customPopupCss