Add: implement exposeIframe

background/background.js

@@ -14,6 +14,11 @@ window.API_METHODS = Object.assign(window.API_METHODS || {}, {
   installStyle: styleManager.installStyle,
   editSave: styleManager.editSave,
 
+  getTabDomain() {
+    return getTab(this.sender.tabId)
+      .then(tab => tab.url.match(/^[\w-]+:\/\/(?:[\w:-]+@)?([^:/#]+)/)[1]);
+  },
+
   getStyleFromDB: id =>
     db.exec('get', id).then(event => event.target.result),
 

background/style-manager.js

@@ -464,7 +464,6 @@ const styleManager = (() => {
   }
 
   function getDomain(url) {
-    // FIXME: use a naive regexp
     return url.match(/^[\w-]+:\/\/(?:[\w:-]+@)?([^:/#]+)/)[1];
   }
 

content/apply.js

@@ -12,7 +12,6 @@
   var ROOT = document.documentElement;
   var isOwnPage = location.protocol.endsWith('-extension:');
   var disableAll = false;
-  var exposeIframes = false;
   var styleElements = new Map();
   var disabledElements = new Map();
   var retiredStyleTimers = new Map();
@@ -50,9 +49,13 @@
     window.addEventListener(chrome.runtime.id, orphanCheck, true);
   }
 
+  let parentDomain;
+
   // FIXME: does it work with styleViaAPI?
   prefs.subscribe(['disableAll'], (key, value) => doDisableAll(value));
-  prefs.subscribe(['exposeIframes'], (key, value) => doExposeIframes(value));
+  if (window !== parent) {
+    prefs.subscribe(['exposeIframes'], updateExposeIframes);
+  }
 
   function getMatchUrl() {
     var matchUrl = location.href;
@@ -164,18 +167,23 @@
     });
   }
 
-  function doExposeIframes(state = exposeIframes) {
+  function fetchParentDomain() {
-    if (state === exposeIframes ||
+    if (parentDomain) {
-        state === true && typeof exposeIframes === 'string' ||
+      return Promise.resolve();
-        window === parent) {
-      return;
     }
-    exposeIframes = state;
+    return API.getTabDomain()
-    const attr = document.documentElement.getAttribute('stylus-iframe');
+      .then(newDomain => {
-    if (state && state !== attr) {
+        parentDomain = newDomain;
-      document.documentElement.setAttribute('stylus-iframe', state);
+      });
-    } else if (!state && attr !== undefined) {
+  }
+
+  function updateExposeIframes() {
+    if (!prefs.get('exposeIframes') || window !== parent || !styleElements.size) {
       document.documentElement.removeAttribute('stylus-iframe');
+    } else {
+      fetchParentDomain().then(() => {
+        document.documentElement.setAttribute('stylus-iframe', parentDomain);
+      });
     }
   }
 
@@ -222,12 +230,6 @@
   }
 
   function applyStyles(styles) {
-    // if (!styles) {
-      // Chrome is starting up
-      // requestStyles();
-      // return;
-    // }
-
     if (!document.documentElement) {
       new MutationObserver((mutations, observer) => {
         if (document.documentElement) {
@@ -238,14 +240,6 @@
       return;
     }
 
-    // FIXME: switch to prefs
-    // if ('disableAll' in styles) {
-      // doDisableAll(styles.disableAll);
-    // }
-    // if ('exposeIframes' in styles) {
-      // doExposeIframes(styles.exposeIframes);
-    // }
-
     const gotNewStyles = styles.length || styles.needTransitionPatch;
     if (gotNewStyles) {
       if (docRootObserver) {
@@ -279,6 +273,8 @@
         }
       });
     }
+
+    updateExposeIframes();
   }
 
   function applySections(styleId, code) {