Prep for processing of shady-unscoped moving to ShadyCSS

Polymer · Nov 13, 2017 · 08c3a02 · 08c3a02
1 parent 9a46833
commit 08c3a02
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 37 deletions.
diff --git a/lib/mixins/element-mixin.html b/lib/mixins/element-mixin.html
@@ -414,6 +414,7 @@
         Polymer.StyleGather.stylesFromTemplate(template));
       let templateStyles = template.content.querySelectorAll('style');
       let lastStyle = templateStyles[templateStyles.length-1];
+      // ensure all gathered styles are actually in this template.
       for (let i=0; i < styles.length; i++) {
         let s = styles[i];
         // if the style is not in this template, it's been "included" and

diff --git a/lib/utils/style-gather.html b/lib/utils/style-gather.html
@@ -24,6 +24,18 @@
     return PolymerDomModule.import(moduleId);
   }
 
+  function styleForImport(importDoc) {
+    // NOTE: polyfill affordance.
+    // under the HTMLImports polyfill, there will be no 'body',
+    // but the import pseudo-doc can be used directly.
+    let container = importDoc.body ? importDoc.body : importDoc;
+    const importCss = Polymer.ResolveUrl.resolveCss(container.textContent,
+      importDoc.baseURI);
+    const style = document.createElement('style');
+    style.textContent = importCss;
+    return style;
+  }
+
   /** @typedef {{assetpath: string}} */
   let templateWithAssetPath; // eslint-disable-line no-unused-vars
 
@@ -108,13 +120,10 @@
           if (include) {
             styles.push(...this.stylesFromModules(include));
           }
-          if (window.ShadyDOM && e.hasAttribute(SHADY_UNSCOPED_ATTR)) {
-            e.textContent = baseURI ?
-              Polymer.ResolveUrl.resolveCss(e.textContent, baseURI) : e.textContent;
-            document.head.insertBefore(e, document.head.firstChild);
-          } else {
-            styles.push(e);
+          if (baseURI) {
+            e.textContent = Polymer.ResolveUrl.resolveCss(e.textContent, baseURI);
           }
+          styles.push(e);
         }
         template._styles = styles;
       }
@@ -147,28 +156,15 @@
         let p = p$[i];
         if (p.import) {
           const importDoc = p.import;
-          if (!importDoc._style) {
-            // NOTE: polyfill affordance.
-            // under the HTMLImports polyfill, there will be no 'body',
-            // but the import pseudo-doc can be used directly.
-            let container = importDoc.body ? importDoc.body : importDoc;
-            const importCss = Polymer.ResolveUrl.resolveCss(container.textContent,
-              importDoc.baseURI);
-            const style = document.createElement('style');
-            if (p.hasAttribute(SHADY_UNSCOPED_ATTR)) {
-              style.setAttribute(SHADY_UNSCOPED_ATTR, '');
-            }
-            style.textContent = importCss;
-            importDoc._style = style;
-          }
-          // support the shady-unscoped promoting styles to main document
-          if (window.ShadyDOM &&
-            importDoc._style.hasAttribute(SHADY_UNSCOPED_ATTR) &&
-            !importDoc._style.parentNode) {
-            document.head.insertBefore(importDoc._style, document.head.firstChild);
-          } else {
-            styles.push(importDoc._style);
+          const unscoped = p.hasAttribute(SHADY_UNSCOPED_ATTR);
+          if (unscoped && !importDoc._unscopedStyle) {
+            const style = styleForImport(importDoc);
+            style.setAttribute(SHADY_UNSCOPED_ATTR, '');
+            importDoc._unscopedStyle = style;
+          } else if (!importDoc._style) {
+            importDoc._style = styleForImport(importDoc);
           }
+          styles.push(unscoped ? importDoc._unscopedStyle : importDoc._style);
         }
       }
       return styles;
@@ -218,7 +214,8 @@
         // include css from the first template in the module
         let t = m.querySelector('template');
         if (t) {
-          cssText += this.cssFromTemplate(t, /** @type {templateWithAssetPath} */(m).assetpath);
+          cssText += this.cssFromTemplate(t,
+            /** @type {templateWithAssetPath} */(m).assetpath);
         }
         m._cssText = cssText || null;
       }
@@ -250,14 +247,7 @@
         if (e.parentNode) {
           e.parentNode.removeChild(e);
         }
-        const styleCss = baseURI ?
-          Polymer.ResolveUrl.resolveCss(e.textContent, baseURI) : e.textContent;
-        if (window.ShadyDOM && e.hasAttribute(SHADY_UNSCOPED_ATTR)) {
-          e.textContent = styleCss;
-          document.head.insertBefore(e, document.head.firstChild);
-        } else {
-          cssText += styleCss;
-        }
+        cssText += e.textContent;
       }
       return cssText;
     },
@@ -294,7 +284,7 @@
         cssText += styles[i].textContent;
       }
       return cssText;
-    },
+    }
   };
 
   Polymer.StyleGather = StyleGather;