diff --git a/lib/mixins/element-mixin.js b/lib/mixins/element-mixin.js index 4e302c75a0..7a2dcc1486 100644 --- a/lib/mixins/element-mixin.js +++ b/lib/mixins/element-mixin.js @@ -16,6 +16,7 @@ import { pathFromUrl, resolveCss, resolveUrl } from '../utils/resolve-url.js'; import { DomModule } from '../elements/dom-module.js'; import { PropertyEffects } from './property-effects.js'; import { PropertiesMixin } from './properties-mixin.js'; +import { skipStyleIncludesAndUrls } from '../utils/settings.js'; /** * Current Polymer version in Semver notation. @@ -252,31 +253,33 @@ export const ElementMixin = dedupingMixin(base => { * @private */ function processElementStyles(klass, template, is, baseURI) { - const templateStyles = template.content.querySelectorAll('style'); - const stylesWithImports = stylesFromTemplate(template); - // insert styles from at the top of the template - const linkedStyles = stylesFromModuleImports(is); - const firstTemplateChild = template.content.firstElementChild; - for (let idx = 0; idx < linkedStyles.length; idx++) { - let s = linkedStyles[idx]; - s.textContent = klass._processStyleText(s.textContent, baseURI); - template.content.insertBefore(s, firstTemplateChild); - } - // keep track of the last "concrete" style in the template we have encountered - let templateStyleIndex = 0; - // ensure all gathered styles are actually in this template. - for (let i = 0; i < stylesWithImports.length; i++) { - let s = stylesWithImports[i]; - let templateStyle = templateStyles[templateStyleIndex]; - // if the style is not in this template, it's been "included" and - // we put a clone of it in the template before the style that included it - if (templateStyle !== s) { - s = s.cloneNode(true); - templateStyle.parentNode.insertBefore(s, templateStyle); - } else { - templateStyleIndex++; + if (!skipStyleIncludesAndUrls) { + const templateStyles = template.content.querySelectorAll('style'); + const stylesWithImports = stylesFromTemplate(template); + // insert styles from at the top of the template + const linkedStyles = stylesFromModuleImports(is); + const firstTemplateChild = template.content.firstElementChild; + for (let idx = 0; idx < linkedStyles.length; idx++) { + let s = linkedStyles[idx]; + s.textContent = klass._processStyleText(s.textContent, baseURI); + template.content.insertBefore(s, firstTemplateChild); + } + // keep track of the last "concrete" style in the template we have encountered + let templateStyleIndex = 0; + // ensure all gathered styles are actually in this template. + for (let i = 0; i < stylesWithImports.length; i++) { + let s = stylesWithImports[i]; + let templateStyle = templateStyles[templateStyleIndex]; + // if the style is not in this template, it's been "included" and + // we put a clone of it in the template before the style that included it + if (templateStyle !== s) { + s = s.cloneNode(true); + templateStyle.parentNode.insertBefore(s, templateStyle); + } else { + templateStyleIndex++; + } + s.textContent = klass._processStyleText(s.textContent, baseURI); } - s.textContent = klass._processStyleText(s.textContent, baseURI); } if (window.ShadyCSS) { window.ShadyCSS.prepareTemplate(template, is); diff --git a/lib/utils/settings.js b/lib/utils/settings.js index 5094b58a50..5f4c0e443c 100644 --- a/lib/utils/settings.js +++ b/lib/utils/settings.js @@ -113,10 +113,30 @@ export let allowTemplateFromDomModule = false; /** * Sets `lookupTemplateFromDomModule` globally for all elements * - * @param {boolean} allowDomModule enable or disable template lookup + * @param {boolean} allowDomModule enable or disable template lookup * globally * @return {void} */ export const setAllowTemplateFromDomModule = function(allowDomModule) { allowTemplateFromDomModule = allowDomModule; }; + +/** + * Setting to skip processing style includes and re-writing urls in css styles. + * Normally "included" styles are pulled into the element and all urls in styles + * are re-written to be relative to the containing script url. + * If no includes or relative urls are used in styles, these steps can be + * skipped as an optimization. + */ +export let skipStyleIncludesAndUrls = false; + +/** + * Sets `setSkipRewriteStyleUrls` globally for all elements + * + * @param {boolean} skipIncludesAndUrls enable or disable skipping style + * includes and url rewriting + * @return {void} + */ +export const setSkipStyleIncludesAndUrls = function(skipIncludesAndUrls) { + skipStyleIncludesAndUrls = skipIncludesAndUrls; +}; \ No newline at end of file