diff --git a/.travis.yml b/.travis.yml index 872d303..cec4724 100644 --- a/.travis.yml +++ b/.travis.yml @@ -12,7 +12,8 @@ addons: script: - npm install -g bower - bower install -- xvfb-run wct +- xvfb-run wct -l chrome +- xvfb-run wct -l firefox - if [ "${TRAVIS_PULL_REQUEST}" = "false" ]; then wct -s 'windows 10/microsoftedge@14' -s 'windows 8.1/internet explorer@11' -s 'os x 10.11/safari@10' -s 'os x 10.11/safari@9'; fi env: global: diff --git a/README.md b/README.md index 3a9255b..3987b99 100644 --- a/README.md +++ b/README.md @@ -3,40 +3,36 @@ webcomponents.js [![Build Status](https://travis-ci.org/webcomponents/webcomponentsjs.svg?branch=master)](https://travis-ci.org/webcomponents/webcomponentsjs) -A suite of polyfills supporting the [Web Components](http://webcomponents.org) specs: +A suite of polyfills supporting the [Web Components](http://webcomponents.org) specs. -**Custom Elements**: allows authors to define their own custom tags ([spec](https://w3c.github.io/webcomponents/spec/custom/)). - -**HTML Imports**: a way to include and reuse HTML documents via other HTML documents ([spec](https://w3c.github.io/webcomponents/spec/imports/)). - -**Shadow DOM**: provides encapsulation by hiding DOM subtrees under shadow roots ([spec](https://w3c.github.io/webcomponents/spec/shadow/)). +- **Custom Elements**: allows authors to define their own custom tags ([spec](https://w3c.github.io/webcomponents/spec/custom/)). +- **HTML Imports**: a way to include and reuse HTML documents via other HTML documents ([spec](https://w3c.github.io/webcomponents/spec/imports/)). +- **Shadow DOM**: provides encapsulation by hiding DOM subtrees under shadow roots ([spec](https://w3c.github.io/webcomponents/spec/shadow/)). ## Releases -Pre-built (concatenated & minified) versions of the polyfills are maintained in the [tagged versions](https://github.com/webcomponents/webcomponentsjs/releases) of this repo. There are two variants: - -`webcomponents.js` includes all of the polyfills. - -`webcomponents-lite.js` includes all polyfills except for shadow DOM. +Pre-built (concatenated & minified) versions of the polyfills are maintained in the [tagged versions](https://github.com/webcomponents/webcomponentsjs/releases) of this repo. There are several variants: +- `webcomponents-lite.js` includes all of the polyfills. +- `webcomponents-loader.js` is a custom loader that dynamically load a minified polyfill +bundle, using feature detection. The bundles that can be loaded are: + - `webcomponents-hi` -- HTML Imports (needed by Safari Tech Preview) + - `webcomponents-hi-ce` -- HTML Imports and Custom Elements (needed by Safari 10) + - `webcomponents-hi-ce-sd` -- HTML Imports, Custom Elements and Shady DOM/CSS (needed by Safari 9, Firefox, Edge) + - `webcomponents-lite` -- HTML Imports, Custom Elements, Shady DOM/CSS and generic platform polyfills (such as URL, Template, ES6 Promise, Constructable events, etc.) (needed by Internet Explorer 11) ## Browser Support Our polyfills are intended to work in the latest versions of evergreen browsers. See below for our complete browser support matrix: -| Polyfill | IE10 | IE11+ | Chrome* | Firefox* | Safari 7+* | Chrome Android* | Mobile Safari* | -| ---------- |:----:|:-----:|:-------:|:--------:|:----------:|:---------------:|:--------------:| -| Custom Elements | ~ | ✓ | ✓ | ✓ | ✓ | ✓| ✓ | -| HTML Imports | ~ | ✓ | ✓ | ✓ | ✓| ✓| ✓ | -| Shadow DOM | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | -| Templates | ✓ | ✓ | ✓ | ✓| ✓ | ✓ | ✓ | +| Polyfill | IE11+ | Chrome* | Firefox* | Safari 9+* | Chrome Android* | Mobile Safari* | +| ---------- |:-----:|:-------:|:--------:|:----------:|:---------------:|:--------------:| +| Custom Elements | ✓ | ✓ | ✓ | ✓ | ✓| ✓ | +| HTML Imports | ✓ | ✓ | ✓ | ✓| ✓| ✓ | +| Shady CSS/DOM | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | - -*Indicates the current version of the browser - -~Indicates support may be flaky. If using Custom Elements or HTML Imports with Shadow DOM, -you will get the non-flaky Mutation Observer polyfill that Shadow DOM includes. +\*Indicates the current version of the browser The polyfills may work in older browsers, however require additional polyfills (such as classList) to be used. We cannot guarantee support for browsers outside of our compatibility matrix. @@ -44,7 +40,7 @@ to be used. We cannot guarantee support for browsers outside of our compatibilit ### Manually Building -If you wish to build the polyfills yourself, you'll need `node` and `gulp` on your system: +If you wish to build the polyfills yourself, you'll need `node` and `npm` on your system: * install [node.js](http://nodejs.org/) using the instructions on their website * use `npm` to install [gulp.js](http://gulpjs.com/): `npm install -g gulp` @@ -53,10 +49,11 @@ Now you are ready to build the polyfills with: # install dependencies npm install + bower install # build gulp build -The builds will be placed into the `dist/` directory. +The builds will be placed into the root directory. ## Contribute @@ -74,9 +71,9 @@ Copyright (c) 2015 The Polymer Authors. All rights reserved. Under native HTML Imports, ` - + - + diff --git a/tests/ce-import.html b/tests/ce-import.html index 5200d32..4324af1 100644 --- a/tests/ce-import.html +++ b/tests/ce-import.html @@ -13,7 +13,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN - + diff --git a/tests/ce-upgrade-order.html b/tests/ce-upgrade-order.html index 9777940..6a28c3b 100644 --- a/tests/ce-upgrade-order.html +++ b/tests/ce-upgrade-order.html @@ -12,22 +12,24 @@ Custom Element Upgrade Order + - diff --git a/tests/ce-upgradedocumenttree.html b/tests/ce-upgradedocumenttree.html index d0429d5..fd3b1d5 100644 --- a/tests/ce-upgradedocumenttree.html +++ b/tests/ce-upgradedocumenttree.html @@ -20,7 +20,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN } - + diff --git a/tests/dev-loader-swizzled.html b/tests/dev-loader-swizzled.html index c6da9cf..5edb485 100644 --- a/tests/dev-loader-swizzled.html +++ b/tests/dev-loader-swizzled.html @@ -12,18 +12,20 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN - + diff --git a/tests/dev-loader.html b/tests/dev-loader.html index 0c02c8c..19564d4 100644 --- a/tests/dev-loader.html +++ b/tests/dev-loader.html @@ -12,18 +12,20 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN - + diff --git a/tests/integration.html b/tests/integration.html index 36827b8..ad52963 100644 --- a/tests/integration.html +++ b/tests/integration.html @@ -10,8 +10,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN --> - Template with HTMLImports Test - + Integration Test + diff --git a/tests/load.html b/tests/load.html index 67dcb1e..f498d86 100644 --- a/tests/load.html +++ b/tests/load.html @@ -12,18 +12,28 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN - - - - - + + + + + + diff --git a/tests/smoke.html b/tests/smoke.html index 465f6ca..b913eeb 100644 --- a/tests/smoke.html +++ b/tests/smoke.html @@ -13,7 +13,7 @@ - + plain diff --git a/tests/template-and-CE.html b/tests/template-and-CE.html index 5613919..45f9588 100644 --- a/tests/template-and-CE.html +++ b/tests/template-and-CE.html @@ -58,12 +58,14 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN window.customElements.define('x-after', XAfter); }); - test('elements within templates not upgraded', function() { - assert(!childCreated); - }); + suite('template and custom elements', function() { + test('elements within templates not upgraded', function() { + assert(!childCreated); + }); - test('templates before elements are bootstrapped before createdCallback', function() { - assert(foundTemplate); + test('templates before elements are bootstrapped before createdCallback', function() { + assert(foundTemplate); + }); }); diff --git a/src/boot-lite.js b/webcomponents-debug.js similarity index 68% rename from src/boot-lite.js rename to webcomponents-debug.js index b039e47..8127393 100644 --- a/src/boot-lite.js +++ b/webcomponents-debug.js @@ -14,7 +14,7 @@ window.WebComponents = window.WebComponents || {flags:{}}; // loading script - var file = 'webcomponents-lite.js'; + var file = 'webcomponents-debug.js'; var script = document.querySelector('script[src*="' + file + '"]'); // Flags. Convert url arguments to flags @@ -48,6 +48,28 @@ } } + // construct full dependency list + var modules = [ + '../../webcomponents-platform/webcomponents-platform.js', + '../../URL/url.js', + '../../template/template.js', + '../../es6-promise/dist/es6-promise.auto.min.js', + '../../html-imports/src/html-imports.js', + 'pre-polyfill.js', + '../../shadydom/shadydom.min.js', + '../../custom-elements/custom-elements.min.js', + '../../shadycss/shadycss.min.js', + 'post-polyfill.js', + 'unresolved.js' + ]; + + var src = script.getAttribute('src'); + var path = src.slice(0, src.lastIndexOf(file)); + + modules.forEach(function(f) { + document.write(''); + }); + // exports WebComponents.flags = flags; diff --git a/webcomponents-hi-ce.js b/webcomponents-hi-ce.js new file mode 100644 index 0000000..ba05716 --- /dev/null +++ b/webcomponents-hi-ce.js @@ -0,0 +1,6 @@ +(function(){'use strict';function _(Ot){return Ot=$(Ot),te(ee(Ot),Ot)}function $(Ot){return Ot.replace(Re.comments,'').replace(Re.port,'')}function ee(Ot){let Pt={start:0,end:Ot.length},Lt=Pt;for(let wt=0,kt=Ot.length;wt{'complete'===document.readyState&&Ae()}))}function Ae(){requestAnimationFrame(()=>{(Tt||xt._elementsHaveApplied)&&xt.updateStyles(),Tt=!1})}(Ot=>{const Pt=!!('import'in document.createElement('link'));let Lt=null;!1=='currentScript'in document&&Object.defineProperty(document,'currentScript',{get(){return Lt||('complete'===document.readyState?null:document.scripts[document.scripts.length-1])},configurable:!0});const wt=/(^\/)|(^#)|(^[\w-\d]*:)/,kt=/(url\()([^)]*)(\))/g,Dt=/(@import[\s]+(?!url\())([^;]*)(;)/g,Ht=/(]*)(rel=['|"]?stylesheet['|"]?[^>]*>)/g,Ut={fixUrls(or,nr){or.href&&or.setAttribute('href',Ut.replaceAttrUrl(or.getAttribute('href'),nr)),or.src&&or.setAttribute('src',Ut.replaceAttrUrl(or.getAttribute('src'),nr)),'style'===or.localName&&Ut.resolveUrlsInStyle(or,nr)},fixUrlAttributes(or,nr){const lr=['action','src','href','url','style'];for(let ar,sr=0;srpr.search(/({{|\[\[)/)&&(ir.value='style'===ar?Ut.resolveUrlsInCssText(pr,nr):Ut.replaceAttrUrl(pr,nr))}},fixUrlsInTemplates(or,nr){const lr=or.querySelectorAll('template');for(let sr=0;sr{let dr=ir.replace(/["']/g,'');return nr&&(dr=Ut.resolveUrl(dr,nr)),ar+'\''+dr+'\''+pr})},replaceAttrUrl(or,nr){return or&&wt.test(or)?or:Ut.resolveUrl(or,nr)},resolveUrl(or,nr){if(void 0===Ut.__workingURL){Ut.__workingURL=!1;try{const sr=new URL('b','http://a');sr.pathname='c%20d',Ut.__workingURL='http://a/c%20d'===sr.href}catch(sr){}}if(Ut.__workingURL)return new URL(or,nr).href;let lr=Ut.__tempDoc;return lr||(lr=document.implementation.createHTMLDocument('temp'),Ut.__tempDoc=lr,lr.__base=lr.createElement('base'),lr.head.appendChild(lr.__base),lr.__anchor=lr.createElement('a')),lr.__base.href=nr,lr.__anchor.href=or,lr.__anchor.href||or}},Ft={async:!0,load(or,nr,lr){if(!or)lr('error: href must be specified');else if(or.match(/^data:/)){const sr=or.split(','),ar=sr[0];let ir=sr[1];ir=-1{let ar=sr.getResponseHeader('Location');if(ar&&0===ar.indexOf('/')){const pr=location.origin||location.protocol+'//'+location.host;ar=pr+ar}const ir=sr.response||sr.responseText;304===sr.status||0===sr.status||200<=sr.status&&300>sr.status?nr(ir,ar):lr(ir)},sr.send()}}},jt=/Trident/.test(navigator.userAgent)||/Edge\/\d./i.test(navigator.userAgent),qt='link[rel=import]',Bt='import-disable',Kt=`link[rel=stylesheet][href][type=${Bt}]`,Xt=`${qt}, ${Kt}, + style:not([type]), link[rel=stylesheet][href]:not([type]), + script:not([type]), script[type="application/javascript"], + script[type="text/javascript"]`,Wt='import-dependency',Vt=`${qt}:not(${Wt})`,Gt=`script[${Wt}]`,Yt=`style[${Wt}], + link[rel=stylesheet][${Wt}]`;const $t=or=>{return or.nodeType===Node.ELEMENT_NODE&&'link'===or.localName&&'import'===or.rel},Jt=(or,nr)=>{if(or.__loaded)nr&&nr();else if('script'===or.localName&&!or.src)or.__loaded=!0,nr&&nr();else{const lr=sr=>{or.removeEventListener(sr.type,lr),or.__loaded=!0,nr&&nr()};or.addEventListener('load',lr),jt&&'style'===or.localName||or.addEventListener('error',lr)}},Zt=or=>{Qt(()=>er(()=>or&&or()))},Qt=or=>{if('loading'!==document.readyState)or();else{const nr=()=>{'loading'!==document.readyState&&(document.removeEventListener('readystatechange',nr),or())};document.addEventListener('readystatechange',nr)}},er=or=>{let nr=document.querySelectorAll(Vt),lr=nr.length;if(!lr)return void or();for(let ir,sr=0,ar=nr.length;sr{0==--lr&&or()})},tr=or=>{if(Pt)return or.ownerDocument;let nr=or.__ownerImport;if(!nr){for(nr=or;(nr=nr.parentNode||nr.host)&&!$t(nr););or.__ownerImport=nr}return nr},rr=(or,nr)=>{if('function'==typeof window.CustomEvent)return new CustomEvent(or,nr);const lr=document.createEvent('CustomEvent');return lr.initCustomEvent(or,!!nr.bubbles,!!nr.cancelable,nr.detail),lr};if(Pt){const or=document.querySelectorAll(qt);for(let ar,lr=0,sr=or.length;lr{const sr=lr.target;$t(sr)&&(sr.__loaded=!0)};document.addEventListener('load',nr,!0),document.addEventListener('error',nr,!0)}else new class{constructor(){this.documents={},this.inflight=0,this.dynamicImportsMO=new MutationObserver(or=>this.handleMutations(or)),Qt(()=>{this.dynamicImportsMO.observe(document.head,{childList:!0,subtree:!0}),this.loadImports(document)})}loadImports(or){const nr=or.querySelectorAll(qt);for(let lr=0,sr=nr.length;lr{const ar=this.makeDocument(lr,sr||nr);this.documents[nr]=ar,this.inflight--,this.loadImports(ar)},()=>{this.documents[nr]=null,this.inflight--,this.processImportsIfLoadingDone()})}makeDocument(or,nr){if(!or)return document.createDocumentFragment();jt&&(or=or.replace(Ht,(cr,mr,ur)=>{return-1===cr.indexOf('type=')?`${mr} type=${Bt} ${ur}`:cr}));let lr;const sr=document.createElement('template');if(sr.innerHTML=or,sr.content)lr=sr.content;else for(lr=document.createDocumentFragment();sr.firstChild;)lr.appendChild(sr.firstChild);const ar=lr.querySelector('base');ar&&(nr=Ut.replaceAttrUrl(ar.getAttribute('href'),nr),ar.removeAttribute('href'));const ir=lr.querySelectorAll('dom-module');for(let mr,cr=0;cr{nr&&or&&(this.dynamicImportsMO.observe(document.head,{childList:!0,subtree:!0}),this.fireEvents())};this.waitForStyles(()=>{nr=!0,lr()}),this.runScripts(()=>{or=!0,lr()})}}flatten(or){const nr=or.querySelectorAll(qt);for(let ar,lr=0,sr=nr.length;lr{if(ar{Lt=null,sr(ar+1)})}else or()};sr(0)}waitForStyles(or){const nr=document.querySelectorAll(Yt);let lr=nr.length;if(!lr)return void or();const sr=jt&&!!document.querySelector(Kt);for(let pr,ar=0,ir=nr.length;ar{pr.removeAttribute(Wt),0==--lr&&or()}),sr&&pr.parentNode!==document.head){let dr=tr(pr);for(;dr&&tr(dr);)dr=tr(dr);const cr=pr.parentNode,mr=pr.nextSibling,ur=document.createElement(pr.localName);ur.__appliedElement=pr,ur.setAttribute('type','import-placeholder'),dr.parentNode===document.head?document.head.insertBefore(pr,dr):document.head.appendChild(pr),cr.insertBefore(ur,mr),pr.removeAttribute('type')}}fireEvents(){const or=document.querySelectorAll(qt);for(let lr,nr=or.length-1;0<=nr&&(lr=or[nr]);nr--)this.fireEventIfNeeded(lr)}fireEventIfNeeded(or){if(!or.__loaded){or.__loaded=!0,or.import&&(or.import.readyState='complete');const nr=or.import?'load':'error';or.dispatchEvent(rr(nr,{bubbles:!1,cancelable:!1,detail:void 0}))}}handleMutations(or){for(let nr=0;nrdocument.dispatchEvent(rr('HTMLImportsLoaded',{cancelable:!0,bubbles:!0,detail:void 0}))),Ot.useNative=Pt,Ot.whenReady=Zt,Ot.importForElement=tr})(window.HTMLImports=window.HTMLImports||{}),function(){'use strict';function Ot(Dr){var Hr=or.has(Dr);return Dr=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(Dr),!Hr&&Dr}function Pt(Dr){var Hr=Dr.isConnected;if(void 0!==Hr)return Hr;for(;Dr&&!(Dr.__CE_isImportDocument||Dr instanceof Document);)Dr=Dr.parentNode||(window.ShadowRoot&&Dr instanceof ShadowRoot?Dr.host:void 0);return Dr&&(Dr.__CE_isImportDocument||Dr instanceof Document)}function Lt(Dr,Hr){for(;Hr&&Hr!==Dr&&!Hr.nextSibling;)Hr=Hr.parentNode;return Hr&&Hr!==Dr?Hr.nextSibling:null}function wt(Dr,Hr,Ur){Ur=Ur?Ur:new Set;for(var Fr=Dr;Fr;){if(Fr.nodeType===Node.ELEMENT_NODE){var jr=Fr;Hr(jr);var qr=jr.localName;if('link'===qr&&'import'===jr.getAttribute('rel')){if(Fr=jr.import,Fr instanceof Node&&!Ur.has(Fr))for(Ur.add(Fr),Fr=Fr.firstChild;Fr;Fr=Fr.nextSibling)wt(Fr,Hr,Ur);Fr=Lt(Dr,jr);continue}else if('template'===qr){Fr=Lt(Dr,jr);continue}if(jr=jr.__CE_shadowRoot)for(jr=jr.firstChild;jr;jr=jr.nextSibling)wt(jr,Hr,Ur)}Fr=Fr.firstChild?Fr.firstChild:Lt(Dr,Fr)}}function kt(Dr,Hr,Ur){Dr[Hr]=Ur}function Dt(){this.a=new Map,this.f=new Map,this.c=[],this.b=!1}function Ht(Dr,Hr,Ur){Dr.a.set(Hr,Ur),Dr.f.set(Ur.constructor,Ur)}function Ut(Dr,Hr){Dr.b=!0,Dr.c.push(Hr)}function Ft(Dr,Hr){Dr.b&&wt(Hr,function(Ur){return jt(Dr,Ur)})}function jt(Dr,Hr){if(Dr.b&&!Hr.__CE_patched){Hr.__CE_patched=!0;for(var Ur=0;Ur+~])'};const He='style-scope';class Ue{get SCOPE_NAME(){return He}dom(Ot,Pt,Lt){Ot.__styleScoped?Ot.__styleScoped=null:this._transformDom(Ot,Pt||'',Lt)}_transformDom(Ot,Pt,Lt){Ot.nodeType===Node.ELEMENT_NODE&&this.element(Ot,Pt,Lt);let wt='template'===Ot.localName?(Ot.content||Ot._content).childNodes:Ot.children||Ot.childNodes;if(wt)for(let kt=0;kt`:${Dt}(${Ht.replace(/\s/g,'')})`),Ot=Ot.replace(Ge,`${Xe} $1`),Ot=Ot.replace(Be,(kt,Dt,Ht)=>{if(!wt){let Ut=this._transformCompoundSelector(Ht,Dt,Pt,Lt);wt=wt||Ut.stop,Dt=Ut.combinator,Ht=Ut.value}return Dt+Ht}),Ot}_transformCompoundSelector(Ot,Pt,Lt,wt){let kt=Ot.indexOf(Ve);0<=Ot.indexOf(Xe)?Ot=this._transformHostSelector(Ot,wt):0!==kt&&(Ot=Lt?this._transformSimpleSelector(Ot,Lt):Ot);let Dt=!1;0<=kt&&(Pt='',Dt=!0);let Ht;return Dt&&(Ht=!0,Dt&&(Ot=Ot.replace(ze,(Ut,Ft)=>` > ${Ft}`))),Ot=Ot.replace($e,(Ut,Ft,jt)=>`[dir="${jt}"] ${Ft}, ${Ft}[dir="${jt}"]`),{value:Ot,combinator:Pt,stop:Ht}}_transformSimpleSelector(Ot,Pt){let Lt=Ot.split(Ze);return Lt[0]+=Pt,Lt.join(Ze)}_transformHostSelector(Ot,Pt){let Lt=Ot.match(Ye),wt=Lt&&Lt[2].trim()||'';if(wt){if(!wt[0].match(Ke)){let kt=wt.split(Ke)[0];return kt===Pt?wt:'should_not_match'}return Ot.replace(Ye,function(kt,Dt,Ht){return Pt+Ht})}return Ot.replace(Xe,Pt)}documentRule(Ot){Ot.selector=Ot.parsedSelector,this.normalizeRootSelector(Ot),this._transformRule(Ot,this._transformDocumentSelector)}normalizeRootSelector(Ot){Ot.selector===':root'&&(Ot.selector='html')}_transformDocumentSelector(Ot){return Ot.match(Ve)?this._transformComplexSelector(Ot,je):this._transformSimpleSelector(Ot.trim(),je)}}let Fe=/:(nth[-\w]+)\(([^)]+)\)/,je=`:not(.${He})`,qe=',',Be=/(^|[\s>+~]+)((?:\[.+?\]|[^\s>+~=\[])+)/g,Ke=/[[.:#*]/,Xe=':host',Ve='::slotted',Ge=/^(::slotted)/,Ye=/(:host)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/,ze=/(?:::slotted)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/,$e=/(.*):dir\((?:(ltr|rtl))\)/,Ze=':';var tt=new Ue,rt={};const ot=Promise.resolve();class nt{static get(Ot){return Ot.__styleInfo}static set(Ot,Pt){return Ot.__styleInfo=Pt,Pt}static invalidate(Ot){rt[Ot]&&(rt[Ot]._applyShimInvalid=!0)}static startValidating(Ot){const Pt=rt[Ot];Pt._validating||(Pt._validating=!0,ot.then(()=>{Pt._applyShimInvalid=!1,Pt._validating=!1}))}constructor(Ot,Pt,Lt,wt,kt,Dt){this.styleRules=Ot||null,this.placeholder=Pt||null,this.ownStylePropertyNames=Lt||[],this.overrideStyleProperties=null,this.elementName=wt||'',this.cssBuild=Dt||'',this.typeExtension=kt||'',this.styleProperties=null,this.scopeSelector=null,this.customStyle=null}}const lt=window.Element.prototype,st=lt.matches||lt.matchesSelector||lt.mozMatchesSelector||lt.msMatchesSelector||lt.oMatchesSelector||lt.webkitMatchesSelector,it=navigator.userAgent.match('Trident'),pt='x-scope';class dt{get XSCOPE_NAME(){return pt}decorateStyles(Ot){let Pt=this,Lt={},wt=[],kt=0;ye(Ot,function(Ht){Pt.decorateRule(Ht),Ht.index=kt++,Pt.collectPropertiesInCssText(Ht.propertyInfo.cssText,Lt)},function(Ut){wt.push(Ut)}),Ot._keyframes=wt;let Dt=[];for(let Ht in Lt)Dt.push(Ht);return Dt}decorateRule(Ot){if(Ot.propertyInfo)return Ot.propertyInfo;let Pt={},Lt={},wt=this.collectProperties(Ot,Lt);return wt&&(Pt.properties=Lt,Ot.rules=null),Pt.cssText=this.collectCssText(Ot),Ot.propertyInfo=Pt,Pt}collectProperties(Ot,Pt){let Lt=Ot.propertyInfo;if(!Lt){let wt,kt=De.VAR_ASSIGN,Dt=Ot.parsedCssText,Ht,Ut;for(;wt=kt.exec(Dt);)Ht=(wt[2]||wt[3]).trim(),('inherit'!==Ht||'unset'!==Ht)&&(Pt[wt[1].trim()]=Ht),Ut=!0;return Ut}else if(Lt.properties)return Object.assign(Pt,Lt.properties),!0}collectCssText(Ot){return this.collectConsumingCssText(Ot.parsedCssText)}collectConsumingCssText(Ot){return Ot.replace(De.BRACKETED,'').replace(De.VAR_ASSIGN,'')}collectPropertiesInCssText(Ot,Pt){for(let Lt,wt;Lt=De.VAR_CONSUMED.exec(Ot);)wt=Lt[1],':'!==Lt[2]&&(Pt[wt]=!0)}reify(Ot){let Pt=Object.getOwnPropertyNames(Ot);for(let wt,Lt=0;Lt *'===Dt||'html'===Dt,Ut=0===Dt.indexOf(':host')&&!Ht;if('shady'===Lt&&(Ht=Dt===kt+' > *.'+kt||-1!==Dt.indexOf('html'),Ut=!Ht&&0===Dt.indexOf(kt)),'shadow'===Lt&&(Ht=':host > *'===Dt||'html'===Dt,Ut=Ut&&!Ht),Ht||Ut){let Ft=kt;Ut&&(Pe&&!Pt.transformedSelector&&(Pt.transformedSelector=tt._transformRuleCss(Pt,tt._transformComplexSelector,tt._calcElementScope(Ot.is),kt)),Ft=Pt.transformedSelector||kt),wt({selector:Ft,isHost:Ut,isRoot:Ht})}}}hostAndRootPropertiesForScope(Ot,Pt){let Lt={},wt={},kt=this,Dt=Pt&&Pt.__cssBuild;return ye(Pt,function(Ht){kt.whenHostOrRootRule(Ot,Ht,Dt,function(Ut){let Ft=Ot._element||Ot;st.call(Ft,Ut.selector)&&(Ut.isHost?kt.collectProperties(Ht,Lt):kt.collectProperties(Ht,wt))})},null,!0),{rootProps:wt,hostProps:Lt}}transformStyles(Ot,Pt,Lt){let wt=this,kt=tt._calcHostScope(Ot.is,Ot.extends),Dt=Ot.extends?'\\'+kt.slice(0,-1)+'\\]':kt,Ht=new RegExp(De.HOST_PREFIX+Dt+De.HOST_SUFFIX),Ut=nt.get(Ot).styleRules,Ft=this._elementKeyframeTransforms(Ot,Ut,Lt);return tt.elementStyles(Ot,Ut,function(jt){wt.applyProperties(jt,Pt),Pe||ue(jt)||!jt.cssText||(wt.applyKeyframeTransforms(jt,Ft),wt._scopeSelector(jt,Ht,kt,Lt))})}_elementKeyframeTransforms(Ot,Pt,Lt){let wt=Pt._keyframes,kt={};if(!Pe&&wt)for(let Dt=0,Ht=wt[Dt];Dt=Ht._useCount&&Ht.parentNode&&Ht.parentNode.removeChild(Ht)),Pe?Dt.customStyle?(Dt.customStyle.textContent=kt,wt=Dt.customStyle):kt&&(wt=he(kt,Lt,Ot.shadowRoot,Dt.placeholder)):wt?!wt.parentNode&&fe(wt,null,Dt.placeholder):kt&&(wt=he(kt,Lt,null,Dt.placeholder)),wt&&(wt._useCount=wt._useCount||0,Dt.customStyle!=wt&&wt._useCount++,Dt.customStyle=wt),it&&(wt.textContent=wt.textContent),wt}applyCustomStyle(Ot,Pt){let Lt=me(Ot),wt=this;Ot.textContent=de(Lt,function(kt){let Dt=kt.cssText=kt.parsedCssText;kt.propertyInfo&&kt.propertyInfo.cssText&&(Dt=se(Dt),kt.cssText=wt.valueForProperties(Dt,Pt))})}}var ct=new dt;let mt={};const ut=window.customElements;if(ut&&!Pe){const Ot=ut.define;ut.define=function(Pt,Lt,wt){return mt[Pt]=ge(Pt),Ot.call(ut,Pt,Lt,wt)}}let ht=De.MIXIN_MATCH,ft=De.VAR_ASSIGN,_t=/;\s*/m,gt=/^\s*(initial)|(inherit)\s*$/,St='_-_';class Ct{constructor(){this._map={}}set(Ot,Pt){Ot=Ot.trim(),this._map[Ot]={properties:Pt,dependants:{}}}get(Ot){return Ot=Ot.trim(),this._map[Ot]}}class bt{constructor(){this._currentTemplate=null,this._measureElement=null,this._map=new Ct,this._separator=St,this._boundProduceCssProperties=(Ot,Pt,Lt,wt)=>this._produceCssProperties(Ot,Pt,Lt,wt)}detectMixin(Ot){const Pt=ht.test(Ot)||ft.test(Ot);return ht.lastIndex=0,ft.lastIndex=0,Pt}transformStyle(Ot,Pt){let Lt=me(Ot);return this.transformRules(Lt,Pt),Lt}transformRules(Ot,Pt){this._currentTemplate=rt[Pt],ye(Ot,Lt=>{this.transformRule(Lt)}),this._currentTemplate=null}transformRule(Ot){Ot.cssText=this.transformCssText(Ot.parsedCssText),':root'===Ot.selector&&(Ot.selector=':host > *')}transformCssText(Ot){return Ot=Ot.replace(ft,this._boundProduceCssProperties),this._consumeCssProperties(Ot)}_getInitialValueForProperty(Ot){return this._measureElement||(this._measureElement=document.createElement('meta'),this._measureElement.style.all='initial',document.head.appendChild(this._measureElement)),window.getComputedStyle(this._measureElement).getPropertyValue(Ot)}_consumeCssProperties(Ot){for(let Pt;Pt=ht.exec(Ot);){let Lt=Pt[0],wt=Pt[1],kt=Pt.index,Dt=kt+Lt.indexOf('@apply'),Ht=kt+Lt.length,Ut=Ot.slice(0,Dt),Ft=Ot.slice(Ht),jt=this._cssTextToMap(Ut),qt=this._atApplyToCssProperties(wt,jt);Ot=[Ut,qt,Ft].join(''),ht.lastIndex=kt+qt.length}return Ot}_atApplyToCssProperties(Ot,Pt){Ot=Ot.replace(_t,'');let Lt=[],wt=this._map.get(Ot);if(wt||(this._map.set(Ot,{}),wt=this._map.get(Ot)),wt){this._currentTemplate&&(wt.dependants[this._currentTemplate.name]=this._currentTemplate);let kt,Dt,Ht;for(kt in wt.properties)Ht=Pt&&Pt[kt],Dt=[kt,': var(',Ot,St,kt],Ht&&Dt.push(',',Ht),Dt.push(')'),Lt.push(Dt.join(''))}return Lt.join('; ')}_replaceInitialOrInherit(Ot,Pt){let Lt=gt.exec(Pt);return Lt&&(Lt[1]?Pt=bt._getInitialValueForProperty(Ot):Pt='apply-shim-inherit'),Pt}_cssTextToMap(Ot){let Pt=Ot.split(';'),Lt,wt,kt={};for(let Ht,Ut,Dt=0;Dt{Vt&&this._map.get(Vt)&&(wt='@apply '+Vt+';')}),!wt)return Ot;let kt=this._consumeCssProperties(wt),Dt=Ot.slice(0,Ot.indexOf('--')),Ht=this._cssTextToMap(kt),Ut=Ht,Ft=this._map.get(Pt),jt=Ft&&Ft.properties;jt?Ut=Object.assign(Object.create(jt),Ht):this._map.set(Pt,Ut);let Bt,Kt,qt=[],Xt=!1;for(Bt in Ut)Kt=Ht[Bt],void 0==Kt&&(Kt='initial'),jt&&!(Bt in jt)&&(Xt=!0),qt.push(Pt+St+Bt+': '+Kt);return Xt&&this._invalidateMixinEntry(Ft),Ft&&(Ft.properties=Ut),Lt&&(Dt=Ot+';'+Dt),Dt+qt.join('; ')+';'}}let Et=new bt;window.ApplyShim=Et;let Nt=function(){};if(!Pe){let Ot=Dt=>{return Dt.classList&&!Dt.classList.contains(tt.SCOPE_NAME)||Dt instanceof SVGElement&&(!Dt.hasAttribute('class')||0>Dt.getAttribute('class').indexOf(tt.SCOPE_NAME))},Pt=Dt=>{for(let Ut,Ht=0;Ht{Lt.observe(Dt,{childList:!0,subtree:!0})},kt=window.customElements&&!window.customElements.flush;if(kt)wt(document);else{let Dt=()=>{wt(document.body)};window.HTMLImports?window.HTMLImports.whenReady(Dt):requestAnimationFrame(function(){if('loading'===document.readyState){let Ht=function(){Dt(),document.removeEventListener('readystatechange',Ht)};document.addEventListener('readystatechange',Ht)}else Dt()})}Nt=function(){Pt(Lt.takeRecords())}}let At=new class{constructor(Ot=100){this.cache={},this.typeMax=Ot}_validate(Ot,Pt,Lt){for(let kt,wt=0;wtthis.typeMax&&kt.shift(),this.cache[Ot]=kt}fetch(Ot,Pt,Lt){let wt=this.cache[Ot];if(wt)for(let Dt,kt=wt.length-1;0<=kt;kt--)if(Dt=wt[kt],this._validate(Dt,Pt,Lt))return Dt}};class vt{constructor(){this._scopeCounter={},this._documentOwner=document.documentElement,this._documentOwnerStyleInfo=nt.set(document.documentElement,new nt({rules:[]})),this._elementsHaveApplied=!1}get nativeShadow(){return Pe}get nativeCss(){return Le}get nativeCssApply(){return!1}flush(){Nt()}_generateScopeSelector(Ot){let Pt=this._scopeCounter[Ot]=(this._scopeCounter[Ot]||0)+1;return`${Ot}-${Pt}`}getStyleAst(Ot){return me(Ot)}styleAstToString(Ot){return de(Ot)}_gatherStyles(Ot){let Pt=Ot.content.querySelectorAll('style'),Lt=[];for(let kt,wt=0;wt{Pe?tt.normalizeRootSelector(Lt):tt.documentRule(Lt),this.nativeCss&&!this.nativeCssApply&&Et.transformRule(Lt)}),this.nativeCss?Ot.textContent=de(Pt):this._documentOwnerStyleInfo.styleRules.rules.push(Pt)}_revalidateApplyShim(Ot){if(this.nativeCss&&!this.nativeCssApply){let Pt=me(Ot);Et.transformRules(Pt),Ot.textContent=de(Pt)}}_applyCustomStyleToDocument(Ot){this.nativeCss||ct.applyCustomStyle(Ot,this._documentOwnerStyleInfo.styleProperties)}getComputedStyleValue(Ot,Pt){let Lt;if(!this.nativeCss){let wt=nt.get(Ot)||nt.get(this._styleOwnerForNode(Ot));Lt=wt.styleProperties[Pt]}return Lt=Lt||window.getComputedStyle(Ot).getPropertyValue(Pt),Lt.trim()}setElementClass(Ot,Pt){let Lt=Ot.getRootNode(),wt=Pt?Pt.split(/\s/):[],kt=Lt.host&&Lt.host.localName;if(!kt){var Dt=Ot.getAttribute('class');if(Dt){let Ht=Dt.split(/\s/);for(let Ut=0;Ut {\n\n /********************* base setup *********************/\n const useNative = Boolean('import' in document.createElement('link'));\n\n // Polyfill `currentScript` for browsers without it.\n let currentScript = null;\n if ('currentScript' in document === false) {\n Object.defineProperty(document, 'currentScript', {\n get() {\n return currentScript ||\n // NOTE: only works when called in synchronously executing code.\n // readyState should check if `loading` but IE10 is\n // interactive when scripts run so we cheat. This is not needed by\n // html-imports polyfill but helps generally polyfill `currentScript`.\n (document.readyState !== 'complete' ?\n document.scripts[document.scripts.length - 1] : null);\n },\n configurable: true\n });\n }\n\n /********************* path fixup *********************/\n const ABS_URL_TEST = /(^\\/)|(^#)|(^[\\w-\\d]*:)/;\n const CSS_URL_REGEXP = /(url\\()([^)]*)(\\))/g;\n const CSS_IMPORT_REGEXP = /(@import[\\s]+(?!url\\())([^;]*)(;)/g;\n const STYLESHEET_REGEXP = /(]*)(rel=['|\"]?stylesheet['|\"]?[^>]*>)/g;\n\n // path fixup: style elements in imports must be made relative to the main\n // document. We fixup url's in url() and @import.\n const Path = {\n\n fixUrls(element, base) {\n if (element.href) {\n element.setAttribute('href',\n Path.replaceAttrUrl(element.getAttribute('href'), base));\n }\n if (element.src) {\n element.setAttribute('src',\n Path.replaceAttrUrl(element.getAttribute('src'), base));\n }\n if (element.localName === 'style') {\n Path.resolveUrlsInStyle(element, base);\n }\n },\n\n fixUrlAttributes(element, base) {\n const attrs = ['action', 'src', 'href', 'url', 'style'];\n for (let i = 0, a; i < attrs.length && (a = attrs[i]); i++) {\n const at = element.attributes[a];\n const v = at && at.value;\n // Skip bound attribute values (assume binding is done via {} and []).\n // TODO(valdrin) consider exposing a library-implementable hook.\n if (v && (v.search(/({{|\\[\\[)/) < 0)) {\n at.value = (a === 'style') ?\n Path.resolveUrlsInCssText(v, base) :\n Path.replaceAttrUrl(v, base);\n }\n }\n },\n\n fixUrlsInTemplates(element, base) {\n const t$ = element.querySelectorAll('template');\n for (let i = 0; i < t$.length; i++) {\n Path.fixUrlsInTemplate(t$[i], base);\n }\n },\n\n fixUrlsInTemplate(template, base) {\n // If template is not supported, still resolve urls within it.\n const content = template.content || template;\n const n$ = content.querySelectorAll(\n 'style, form[action], [src], [href], [url], [style]');\n for (let i = 0; i < n$.length; i++) {\n const n = n$[i];\n if (n.localName == 'style') {\n Path.resolveUrlsInStyle(n, base);\n } else {\n Path.fixUrlAttributes(n, base);\n }\n }\n Path.fixUrlsInTemplates(content, base);\n },\n\n resolveUrlsInStyle(style, linkUrl) {\n style.textContent = Path.resolveUrlsInCssText(style.textContent, linkUrl);\n },\n\n resolveUrlsInCssText(cssText, linkUrl) {\n let r = Path.replaceUrls(cssText, linkUrl, CSS_URL_REGEXP);\n r = Path.replaceUrls(r, linkUrl, CSS_IMPORT_REGEXP);\n return r;\n },\n\n replaceUrls(text, linkUrl, regexp) {\n return text.replace(regexp, (m, pre, url, post) => {\n let urlPath = url.replace(/[\"']/g, '');\n if (linkUrl) {\n urlPath = Path.resolveUrl(urlPath, linkUrl);\n }\n return pre + '\\'' + urlPath + '\\'' + post;\n });\n },\n\n replaceAttrUrl(text, linkUrl) {\n if (text && ABS_URL_TEST.test(text)) {\n return text;\n } else {\n return Path.resolveUrl(text, linkUrl);\n }\n },\n\n resolveUrl(url, base) {\n // Lazy feature detection.\n if (Path.__workingURL === undefined) {\n Path.__workingURL = false;\n try {\n const u = new URL('b', 'http://a');\n u.pathname = 'c%20d';\n Path.__workingURL = (u.href === 'http://a/c%20d');\n } catch (e) {}\n }\n\n if (Path.__workingURL) {\n return (new URL(url, base)).href;\n }\n\n // Fallback to creating an anchor into a disconnected document.\n let doc = Path.__tempDoc;\n if (!doc) {\n doc = document.implementation.createHTMLDocument('temp');\n Path.__tempDoc = doc;\n doc.__base = doc.createElement('base');\n doc.head.appendChild(doc.__base);\n doc.__anchor = doc.createElement('a');\n }\n doc.__base.href = base;\n doc.__anchor.href = url;\n return doc.__anchor.href || url;\n }\n };\n\n /********************* Xhr processor *********************/\n const Xhr = {\n\n async: true,\n\n /**\n * @param {!string} url\n * @param {!function(!string, string=)} success\n * @param {!function(!string)} fail\n */\n load(url, success, fail) {\n if (!url) {\n fail('error: href must be specified');\n } else if (url.match(/^data:/)) {\n // Handle Data URI Scheme\n const pieces = url.split(',');\n const header = pieces[0];\n let resource = pieces[1];\n if (header.indexOf(';base64') > -1) {\n resource = atob(resource);\n } else {\n resource = decodeURIComponent(resource);\n }\n success(resource);\n } else {\n const request = new XMLHttpRequest();\n request.open('GET', url, Xhr.async);\n request.onload = () => {\n // Servers redirecting an import can add a Location header to help us\n // polyfill correctly. Handle relative and full paths.\n let redirectedUrl = request.getResponseHeader('Location');\n if (redirectedUrl && redirectedUrl.indexOf('/') === 0) {\n // In IE location.origin might not work\n // https://connect.microsoft.com/IE/feedback/details/1763802/location-origin-is-undefined-in-ie-11-on-windows-10-but-works-on-windows-7\n const origin = (location.origin || location.protocol + '//' + location.host);\n redirectedUrl = origin + redirectedUrl;\n }\n const resource = /** @type {string} */ (request.response || request.responseText);\n if (request.status === 304 || request.status === 0 ||\n request.status >= 200 && request.status < 300) {\n success(resource, redirectedUrl);\n } else {\n fail(resource);\n }\n };\n request.send();\n }\n }\n };\n\n /********************* importer *********************/\n\n const isIE = /Trident/.test(navigator.userAgent) ||\n /Edge\\/\\d./i.test(navigator.userAgent);\n\n const importSelector = 'link[rel=import]';\n\n // Used to disable loading of resources.\n const importDisableType = 'import-disable';\n\n const disabledLinkSelector = `link[rel=stylesheet][href][type=${importDisableType}]`;\n\n const importDependenciesSelector = `${importSelector}, ${disabledLinkSelector},\n style:not([type]), link[rel=stylesheet][href]:not([type]),\n script:not([type]), script[type=\"application/javascript\"],\n script[type=\"text/javascript\"]`;\n\n const importDependencyAttr = 'import-dependency';\n\n const rootImportSelector = `${importSelector}:not(${importDependencyAttr})`;\n\n const pendingScriptsSelector = `script[${importDependencyAttr}]`;\n\n const pendingStylesSelector = `style[${importDependencyAttr}],\n link[rel=stylesheet][${importDependencyAttr}]`;\n\n /**\n * Importer will:\n * - load any linked import documents (with deduping)\n * - whenever an import is loaded, prompt the parser to try to parse\n * - observe imported documents for new elements (these are handled via the\n * dynamic importer)\n */\n class Importer {\n constructor() {\n this.documents = {};\n // Used to keep track of pending loads, so that flattening and firing of\n // events can be done when all resources are ready.\n this.inflight = 0;\n this.dynamicImportsMO = new MutationObserver(m => this.handleMutations(m));\n // 1. Load imports contents\n // 2. Assign them to first import links on the document\n // 3. Wait for import styles & scripts to be done loading/running\n // 4. Fire load/error events\n whenDocumentReady(() => {\n // Observe changes on .\n this.dynamicImportsMO.observe(document.head, {\n childList: true,\n subtree: true\n });\n this.loadImports(document);\n });\n }\n\n /**\n * @param {!(HTMLDocument|DocumentFragment|Element)} doc\n */\n loadImports(doc) {\n const links = /** @type {!NodeList} */\n (doc.querySelectorAll(importSelector));\n for (let i = 0, l = links.length; i < l; i++) {\n this.loadImport(links[i]);\n }\n this.processImportsIfLoadingDone();\n }\n\n /**\n * @param {!HTMLLinkElement} link\n */\n loadImport(link) {\n const url = link.href;\n // This resource is already being handled by another import.\n if (this.documents[url] !== undefined) {\n // If import is already loaded, we can safely associate it to the link\n // and fire the load/error event.\n const imp = this.documents[url];\n if (imp && imp['__loaded']) {\n link.import = imp;\n this.fireEventIfNeeded(link);\n }\n return;\n }\n this.inflight++;\n // Mark it as pending to notify others this url is being loaded.\n this.documents[url] = 'pending';\n Xhr.load(url, (resource, redirectedUrl) => {\n const doc = this.makeDocument(resource, redirectedUrl || url);\n this.documents[url] = doc;\n this.inflight--;\n // Load subtree.\n this.loadImports(doc);\n }, () => {\n // If load fails, handle error.\n this.documents[url] = null;\n this.inflight--;\n this.processImportsIfLoadingDone();\n });\n }\n\n /**\n * Creates a new document containing resource and normalizes urls accordingly.\n * @param {string=} resource\n * @param {string=} url\n * @return {!DocumentFragment}\n */\n makeDocument(resource, url) {\n if (!resource) {\n return document.createDocumentFragment();\n }\n\n if (isIE) {\n // should be appended to . Not doing so\n // in IE/Edge breaks the cascading order. We disable the loading by\n // setting the type before setting innerHTML to avoid loading\n // resources twice.\n resource = resource.replace(STYLESHEET_REGEXP, (match, p1, p2) => {\n if (match.indexOf('type=') === -1) {\n return `${p1} type=${importDisableType} ${p2}`;\n }\n return match;\n });\n }\n\n let content;\n const template = /** @type {!HTMLTemplateElement} */\n (document.createElement('template'));\n template.innerHTML = resource;\n if (template.content) {\n // This creates issues in Safari10 when used with shadydom (see #12).\n content = template.content;\n } else {\n //