Popup setup refactoring (#1054)

* Pass childrenSupported as a parameter to Frontend/Popup constructors

* Remove setChildrenSupported

* Use event listener instead of function override

* Update options order

* Expand options and use object for clarity

* Fix childrenSupported not being fully propagated

1 files changed, 9 insertions, 16 deletions

diff --git a/ext/bg/js/settings/popup-preview-frame.js b/ext/bg/js/settings/popup-preview-frame.js
index d9b05368..5a402a71 100644
--- a/ext/bg/js/settings/popup-preview-frame.js
+++ b/ext/bg/js/settings/popup-preview-frame.js
@@ -29,7 +29,6 @@ class PopupPreviewFrame {
         this._popupFactory = popupFactory;
         this._frontend = null;
         this._apiOptionsGetOld = null;
-        this._popupSetCustomOuterCssOld = null;
         this._popupShown = false;
         this._themeChangeTimeout = null;
         this._textSource = null;
@@ -75,18 +74,14 @@ class PopupPreviewFrame {
             parentFrameId: null,
             useProxyPopup: false,
             pageType: 'web',
-            allowRootFramePopupProxy: false
+            allowRootFramePopupProxy: false,
+            childrenSupported: false
         });
         this._frontend.setOptionsContextOverride(this._optionsContext);
         await this._frontend.prepare();
         this._frontend.setDisabledOverride(true);
         this._frontend.canClearSelection = false;
-
-        const popup = this._frontend.popup;
-        popup.setChildrenSupported(false);
-
-        this._popupSetCustomOuterCssOld = popup.setCustomOuterCss.bind(popup);
-        popup.setCustomOuterCss = this._popupSetCustomOuterCss.bind(this);
+        this._frontend.popup.on('customOuterCssChanged', this._onCustomOuterCssChanged.bind(this));
 
         // Update search
         this._updateSearch();
@@ -110,16 +105,14 @@ class PopupPreviewFrame {
         return options;
     }
 
-    async _popupSetCustomOuterCss(...args) {
-        // This simulates the stylesheet priorities when injecting using the web extension API.
-        const result = await this._popupSetCustomOuterCssOld(...args);
+    _onCustomOuterCssChanged({node}) {
+        if (node === null) { return; }
 
-        const node = document.querySelector('#client-css');
-        if (node !== null && result !== null) {
-            node.parentNode.insertBefore(result, node);
-        }
+        const node2 = document.querySelector('#client-css');
+        if (node2 === null) { return; }
 
-        return result;
+        // This simulates the stylesheet priorities when injecting using the web extension API.
+        node2.parentNode.insertBefore(node, node2);
     }
 
     _onMessage(e) {