@stencil/core 3.0.0-beta.1 → 3.0.0-rc.0

package/internal/hydrate/index.js

@@ -1,3 +1,8 @@
+function queryNonceMetaTagContent(e) {
+ var t, o, n;
+ return null !== (n = null === (o = null === (t = e.head) || void 0 === t ? void 0 : t.querySelector('meta[name="csp-nonce"]')) || void 0 === o ? void 0 : o.getAttribute("content")) && void 0 !== n ? n : void 0;
+}
+
 function componentOnReady() {
  return getHostRef(this).$onReadyPromise$;
 }
@@ -316,26 +321,28 @@ const createTime = (e, t = "") => {
  let n = styles.get(e);
  n = t, styles.set(e, n);
 }, addStyle = (e, t, o, n) => {
- let s = getScopeId(t, o);
- const l = styles.get(s);
- if (!BUILD.attachStyles) return s;
- if (e = 11 === e.nodeType ? e : doc, l) if ("string" == typeof l) {
+ var s;
+ let l = getScopeId(t, o);
+ const a = styles.get(l);
+ if (!BUILD.attachStyles) return l;
+ if (e = 11 === e.nodeType ? e : doc, a) if ("string" == typeof a) {
   e = e.head || e;
-  let o, a = rootAppliedStyles.get(e);
-  if (a || rootAppliedStyles.set(e, a = new Set), !a.has(s)) {
-   if (BUILD.hydrateClientSide && e.host && (o = e.querySelector(`[sty-id="${s}"]`))) o.innerHTML = l; else {
+  let o, r = rootAppliedStyles.get(e);
+  if (r || rootAppliedStyles.set(e, r = new Set), !r.has(l)) {
+   if (BUILD.hydrateClientSide && e.host && (o = e.querySelector(`[sty-id="${l}"]`))) o.innerHTML = a; else {
     if (BUILD.cssVarShim && plt.$cssShim$) {
-     o = plt.$cssShim$.createHostStyle(n, s, l, !!(10 & t.$flags$));
+     o = plt.$cssShim$.createHostStyle(n, l, a, !!(10 & t.$flags$));
      const e = o["s-sc"];
-     e && (s = e, a = null);
-    } else o = doc.createElement("style"), o.innerHTML = l;
-    (BUILD.hydrateServerSide || BUILD.hotModuleReplacement) && o.setAttribute("sty-id", s), 
+     e && (l = e, r = null);
+    } else o = doc.createElement("style"), o.innerHTML = a;
+    const i = null !== (s = plt.$nonce$) && void 0 !== s ? s : queryNonceMetaTagContent(doc);
+    null != i && o.setAttribute("nonce", i), (BUILD.hydrateServerSide || BUILD.hotModuleReplacement) && o.setAttribute("sty-id", l), 
     e.insertBefore(o, e.querySelector("link"));
    }
-   a && a.add(s);
+   r && r.add(l);
   }
- } else BUILD.constructableCSS && !e.adoptedStyleSheets.includes(l) && (e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, l ]);
- return s;
+ } else BUILD.constructableCSS && !e.adoptedStyleSheets.includes(a) && (e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, a ]);
+ return l;
 }, attachStyles = e => {
  const t = e.$cmpMeta$, o = e.$hostElement$, n = t.$flags$, s = createTime("attachStyles", t.$tagName$), l = addStyle(BUILD.shadowDom && supportsShadow && o.shadowRoot ? o.shadowRoot : o.getRootNode(), t, e.$modeName$, o);
  (BUILD.shadowDom || BUILD.scoped) && BUILD.cssAnnotations && 10 & n && (o["s-sc"] = l, 
@@ -855,6 +862,7 @@ const callRender = (e, t, o) => {
  for (;(e = e.nextSibling) && e["s-sn"] === t; ) o.push(e);
  return o;
 }, bootstrapLazy = (e, t = {}) => {
+ var o;
  BUILD.profile && performance.mark && performance.mark("st:app:start"), (() => {
   if (BUILD.devTools) {
    const e = win.stencil = win.stencil || {}, t = e.inspect;
@@ -902,29 +910,29 @@ const callRender = (e, t, o) => {
    };
   }
  })();
- const o = createTime("bootstrapLazy"), n = [], s = t.exclude || [], l = win.customElements, a = doc.head, r = a.querySelector("meta[charset]"), i = doc.createElement("style"), d = [], c = doc.querySelectorAll("[sty-id]");
- let $, m = !0, p = 0;
+ const n = createTime("bootstrapLazy"), s = [], l = t.exclude || [], a = win.customElements, r = doc.head, i = r.querySelector("meta[charset]"), d = doc.createElement("style"), c = [], $ = doc.querySelectorAll("[sty-id]");
+ let m, p = !0, h = 0;
  if (Object.assign(plt, t), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc.baseURI).href, 
  BUILD.asyncQueue && t.syncQueue && (plt.$flags$ |= 4), BUILD.hydrateClientSide && (plt.$flags$ |= 2), 
- BUILD.hydrateClientSide && BUILD.shadowDom) for (;p < c.length; p++) registerStyle(c[p].getAttribute("sty-id"), c[p].innerHTML.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{"));
- e.map((e => {
+ BUILD.hydrateClientSide && BUILD.shadowDom) for (;h < $.length; h++) registerStyle($[h].getAttribute("sty-id"), $[h].innerHTML.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{"));
+ if (e.map((e => {
   e[1].map((o => {
-   const a = {
+   const n = {
     $flags$: o[0],
     $tagName$: o[1],
     $members$: o[2],
     $listeners$: o[3]
    };
-   BUILD.member && (a.$members$ = o[2]), BUILD.hostListener && (a.$listeners$ = o[3]), 
-   BUILD.reflect && (a.$attrsToReflect$ = []), BUILD.watchCallback && (a.$watchers$ = {}), 
-   BUILD.shadowDom && !supportsShadow && 1 & a.$flags$ && (a.$flags$ |= 8);
-   const r = BUILD.transformTagName && t.transformTagName ? t.transformTagName(a.$tagName$) : a.$tagName$, i = class extends HTMLElement {
+   BUILD.member && (n.$members$ = o[2]), BUILD.hostListener && (n.$listeners$ = o[3]), 
+   BUILD.reflect && (n.$attrsToReflect$ = []), BUILD.watchCallback && (n.$watchers$ = {}), 
+   BUILD.shadowDom && !supportsShadow && 1 & n.$flags$ && (n.$flags$ |= 8);
+   const r = BUILD.transformTagName && t.transformTagName ? t.transformTagName(n.$tagName$) : n.$tagName$, i = class extends HTMLElement {
     constructor(e) {
-     super(e), registerHost(e = this, a), BUILD.shadowDom && 1 & a.$flags$ && (BUILD.hydrateServerSide || "shadowRoot" in e || (e.shadowRoot = e)), 
-     BUILD.slotChildNodesFix && patchChildSlotNodes(e, a);
+     super(e), registerHost(e = this, n), BUILD.shadowDom && 1 & n.$flags$ && (BUILD.hydrateServerSide || "shadowRoot" in e || (e.shadowRoot = e)), 
+     BUILD.slotChildNodesFix && patchChildSlotNodes(e, n);
     }
     connectedCallback() {
-     $ && (clearTimeout($), $ = null), m ? d.push(this) : plt.jmp((() => connectedCallback(this)));
+     m && (clearTimeout(m), m = null), p ? c.push(this) : plt.jmp((() => connectedCallback(this)));
     }
     disconnectedCallback() {
      plt.jmp((() => disconnectedCallback(this)));
@@ -940,14 +948,17 @@ const callRender = (e, t, o) => {
      n.$flags$ = 1, e["s-hmr-load"] = () => {
       delete e["s-hmr-load"];
      }, initializeComponent(e, n, t);
-    })(this, a);
-   }), BUILD.scopedSlotTextContentFix && patchTextContent(i.prototype, a), a.$lazyBundleId$ = e[0], 
-   s.includes(r) || l.get(r) || (n.push(r), l.define(r, proxyComponent(i, a, 1)));
+    })(this, n);
+   }), BUILD.scopedSlotTextContentFix && patchTextContent(i.prototype, n), n.$lazyBundleId$ = e[0], 
+   l.includes(r) || a.get(r) || (s.push(r), a.define(r, proxyComponent(i, n, 1)));
   }));
- })), BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute) && (i.innerHTML = n + "{visibility:hidden}.hydrated{visibility:inherit}", 
- i.setAttribute("data-styles", ""), a.insertBefore(i, r ? r.nextSibling : a.firstChild)), 
- m = !1, d.length ? d.map((e => e.connectedCallback())) : BUILD.profile ? plt.jmp((() => $ = setTimeout(appDidLoad, 30, "timeout"))) : plt.jmp((() => $ = setTimeout(appDidLoad, 30))), 
- o();
+ })), BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute)) {
+  d.innerHTML = s + "{visibility:hidden}.hydrated{visibility:inherit}", d.setAttribute("data-styles", "");
+  const e = null !== (o = plt.$nonce$) && void 0 !== o ? o : queryNonceMetaTagContent(doc);
+  null != e && d.setAttribute("nonce", e), r.insertBefore(d, i ? i.nextSibling : r.firstChild);
+ }
+ p = !1, c.length ? c.map((e => e.connectedCallback())) : BUILD.profile ? plt.jmp((() => m = setTimeout(appDidLoad, 30, "timeout"))) : plt.jmp((() => m = setTimeout(appDidLoad, 30))), 
+ n();
 }, getConnect = (e, t) => {
  const o = () => {
   let e = doc.querySelector(t);
@@ -975,7 +986,7 @@ const callRender = (e, t, o) => {
  } catch (e) {
   consoleError(e);
  }
-}, getHostListenerTarget = (e, t) => BUILD.hostListenerTargetDocument && 4 & t ? doc : BUILD.hostListenerTargetWindow && 8 & t ? win : BUILD.hostListenerTargetBody && 16 & t ? doc.body : BUILD.hostListenerTargetParent && 32 & t ? e.parentElement : e, hostListenerOpts = e => 0 != (2 & e), insertVdomAnnotations = (e, t) => {
+}, getHostListenerTarget = (e, t) => BUILD.hostListenerTargetDocument && 4 & t ? doc : BUILD.hostListenerTargetWindow && 8 & t ? win : BUILD.hostListenerTargetBody && 16 & t ? doc.body : BUILD.hostListenerTargetParent && 32 & t ? e.parentElement : e, hostListenerOpts = e => 0 != (2 & e), setNonce = e => plt.$nonce$ = e, insertVdomAnnotations = (e, t) => {
  if (null != e) {
   const o = {
    hostIds: 0,
@@ -1129,4 +1140,4 @@ const cmpModules = new Map, getModule = e => {
  isTesting: !1
 }, styles = new Map, modeResolutionChain = [];
 
-export { Build, Context, Fragment, Host, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate$1 as forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, hAsync as h, hydrateApp, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, proxyComponent, proxyCustomElement, readTask, registerComponents, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setPlatformHelpers, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };
+export { Build, Context, Fragment, Host, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate$1 as forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, hAsync as h, hydrateApp, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, proxyComponent, proxyCustomElement, readTask, registerComponents, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setNonce, setPlatformHelpers, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };

package/internal/hydrate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/hydrate",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil internal hydrate platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil internals only to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/internal/stencil-core/index.d.ts

@@ -43,6 +43,7 @@ export {
   setAssetPath,
   setErrorHandler,
   setMode,
+  setNonce,
   setPlatformHelpers,
   State,
   Watch,

package/internal/stencil-private.d.ts

@@ -1445,6 +1445,11 @@ export interface PlatformRuntime {
     $flags$: number;
     $orgLocNodes$?: Map<string, RenderNode>;
     $resourcesUrl$: string;
+    /**
+     * The nonce value to be applied to all script/style tags at runtime.
+     * If `null`, the nonce attribute will not be applied.
+     */
+    $nonce$?: string | null;
     jmp: (c: Function) => any;
     raf: (c: FrameRequestCallback) => number;
     ael: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
@@ -2072,6 +2077,11 @@ export interface NewSpecPageOptions {
      */
     attachStyles?: boolean;
     strictBuild?: boolean;
+    /**
+     * Default values to be set on the platform runtime object (@see PlatformRuntime) when creating
+     * the spec page.
+     */
+    platform?: Partial<PlatformRuntime>;
 }
 /**
  * A record of `TypesMemberNameData` entities.

package/internal/stencil-public-runtime.d.ts

@@ -257,6 +257,15 @@ export declare function getAssetPath(path: string): string;
  * @returns the set path
  */
 export declare function setAssetPath(path: string): string;
+/**
+ * Used to specify a nonce value that corresponds with an application's
+ * [Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a `meta` tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) and will result in the same behavior.
+ * @param nonce The value to be used for the nonce attribute.
+ */
+export declare function setNonce(nonce: string): void;
 /**
  * Retrieve a Stencil element for a given reference
  * @param ref the ref to get the Stencil element for

package/internal/testing/index.js

@@ -1,3 +1,8 @@
+function queryNonceMetaTagContent(e) {
+ var t, a, o;
+ return null !== (o = null === (a = null === (t = e.head) || void 0 === t ? void 0 : t.querySelector('meta[name="csp-nonce"]')) || void 0 === a ? void 0 : a.getAttribute("content")) && void 0 !== o ? o : void 0;
+}
+
 function writeTask(e) {
  queuedWriteTasks.push(e);
 }
@@ -213,26 +218,28 @@ const createTime = (e, t = "") => {
  let o = styles.get(e);
  o = t, styles.set(e, o);
 }, addStyle = (e, t, a, o) => {
- let s = getScopeId(t, a);
- const n = styles.get(s);
- if (!appData.BUILD.attachStyles) return s;
- if (e = 11 === e.nodeType ? e : doc, n) if ("string" == typeof n) {
+ var s;
+ let n = getScopeId(t, a);
+ const l = styles.get(n);
+ if (!appData.BUILD.attachStyles) return n;
+ if (e = 11 === e.nodeType ? e : doc, l) if ("string" == typeof l) {
   e = e.head || e;
-  let a, l = rootAppliedStyles.get(e);
-  if (l || rootAppliedStyles.set(e, l = new Set), !l.has(s)) {
-   if (appData.BUILD.hydrateClientSide && e.host && (a = e.querySelector(`[sty-id="${s}"]`))) a.innerHTML = n; else {
+  let a, r = rootAppliedStyles.get(e);
+  if (r || rootAppliedStyles.set(e, r = new Set), !r.has(n)) {
+   if (appData.BUILD.hydrateClientSide && e.host && (a = e.querySelector(`[sty-id="${n}"]`))) a.innerHTML = l; else {
     if (appData.BUILD.cssVarShim && plt.$cssShim$) {
-     a = plt.$cssShim$.createHostStyle(o, s, n, !!(10 & t.$flags$));
+     a = plt.$cssShim$.createHostStyle(o, n, l, !!(10 & t.$flags$));
      const e = a["s-sc"];
-     e && (s = e, l = null);
-    } else a = doc.createElement("style"), a.innerHTML = n;
-    (appData.BUILD.hydrateServerSide || appData.BUILD.hotModuleReplacement) && a.setAttribute("sty-id", s), 
+     e && (n = e, r = null);
+    } else a = doc.createElement("style"), a.innerHTML = l;
+    const p = null !== (s = plt.$nonce$) && void 0 !== s ? s : queryNonceMetaTagContent(doc);
+    null != p && a.setAttribute("nonce", p), (appData.BUILD.hydrateServerSide || appData.BUILD.hotModuleReplacement) && a.setAttribute("sty-id", n), 
     e.insertBefore(a, e.querySelector("link"));
    }
-   l && l.add(s);
+   r && r.add(n);
   }
- } else appData.BUILD.constructableCSS && !e.adoptedStyleSheets.includes(n) && (e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, n ]);
- return s;
+ } else appData.BUILD.constructableCSS && !e.adoptedStyleSheets.includes(l) && (e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, l ]);
+ return n;
 }, attachStyles = e => {
  const t = e.$cmpMeta$, a = e.$hostElement$, o = t.$flags$, s = createTime("attachStyles", t.$tagName$), n = addStyle(appData.BUILD.shadowDom && exports.supportsShadow && a.shadowRoot ? a.shadowRoot : a.getRootNode(), t, e.$modeName$, a);
  (appData.BUILD.shadowDom || appData.BUILD.scoped) && appData.BUILD.cssAnnotations && 10 & o && (a["s-sc"] = n, 
@@ -884,6 +891,7 @@ Object.defineProperty(exports, "Env", {
  isTesting: !0
 }, exports.Context = Context, exports.Fragment = (e, t) => t, exports.Host = Host, 
 exports.addHostEventListeners = addHostEventListeners, exports.bootstrapLazy = (e, t = {}) => {
+ var a;
  appData.BUILD.profile && performance.mark && performance.mark("st:app:start"), (() => {
   if (appData.BUILD.devTools) {
    const e = win.stencil = win.stencil || {}, t = e.inspect;
@@ -931,34 +939,34 @@ exports.addHostEventListeners = addHostEventListeners, exports.bootstrapLazy = (
    };
   }
  })();
- const a = createTime("bootstrapLazy"), o = [], s = t.exclude || [], n = win.customElements, l = doc.head, r = l.querySelector("meta[charset]"), p = doc.createElement("style"), i = [], d = doc.querySelectorAll("[sty-id]");
- let c, $ = !0, u = 0;
+ const o = createTime("bootstrapLazy"), s = [], n = t.exclude || [], l = win.customElements, r = doc.head, p = r.querySelector("meta[charset]"), i = doc.createElement("style"), d = [], c = doc.querySelectorAll("[sty-id]");
+ let $, u = !0, m = 0;
  if (Object.assign(plt, t), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc.baseURI).href, 
  appData.BUILD.asyncQueue && t.syncQueue && (plt.$flags$ |= 4), appData.BUILD.hydrateClientSide && (plt.$flags$ |= 2), 
- appData.BUILD.hydrateClientSide && appData.BUILD.shadowDom) for (;u < d.length; u++) registerStyle(d[u].getAttribute("sty-id"), d[u].innerHTML.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{"));
- e.map((e => {
+ appData.BUILD.hydrateClientSide && appData.BUILD.shadowDom) for (;m < c.length; m++) registerStyle(c[m].getAttribute("sty-id"), c[m].innerHTML.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{"));
+ if (e.map((e => {
   e[1].map((a => {
-   const l = {
+   const o = {
     $flags$: a[0],
     $tagName$: a[1],
     $members$: a[2],
     $listeners$: a[3]
    };
-   appData.BUILD.member && (l.$members$ = a[2]), appData.BUILD.hostListener && (l.$listeners$ = a[3]), 
-   appData.BUILD.reflect && (l.$attrsToReflect$ = []), appData.BUILD.watchCallback && (l.$watchers$ = {}), 
-   appData.BUILD.shadowDom && !exports.supportsShadow && 1 & l.$flags$ && (l.$flags$ |= 8);
-   const r = appData.BUILD.transformTagName && t.transformTagName ? t.transformTagName(l.$tagName$) : l.$tagName$, p = class extends HTMLElement {
+   appData.BUILD.member && (o.$members$ = a[2]), appData.BUILD.hostListener && (o.$listeners$ = a[3]), 
+   appData.BUILD.reflect && (o.$attrsToReflect$ = []), appData.BUILD.watchCallback && (o.$watchers$ = {}), 
+   appData.BUILD.shadowDom && !exports.supportsShadow && 1 & o.$flags$ && (o.$flags$ |= 8);
+   const r = appData.BUILD.transformTagName && t.transformTagName ? t.transformTagName(o.$tagName$) : o.$tagName$, p = class extends HTMLElement {
     constructor(e) {
-     super(e), registerHost(e = this, l), appData.BUILD.shadowDom && 1 & l.$flags$ && (exports.supportsShadow ? appData.BUILD.shadowDelegatesFocus ? e.attachShadow({
+     super(e), registerHost(e = this, o), appData.BUILD.shadowDom && 1 & o.$flags$ && (exports.supportsShadow ? appData.BUILD.shadowDelegatesFocus ? e.attachShadow({
       mode: "open",
-      delegatesFocus: !!(16 & l.$flags$)
+      delegatesFocus: !!(16 & o.$flags$)
      }) : e.attachShadow({
       mode: "open"
      }) : appData.BUILD.hydrateServerSide || "shadowRoot" in e || (e.shadowRoot = e)), 
-     appData.BUILD.slotChildNodesFix && patchChildSlotNodes(e, l);
+     appData.BUILD.slotChildNodesFix && patchChildSlotNodes(e, o);
     }
     connectedCallback() {
-     c && (clearTimeout(c), c = null), $ ? i.push(this) : plt.jmp((() => connectedCallback(this)));
+     $ && (clearTimeout($), $ = null), u ? d.push(this) : plt.jmp((() => connectedCallback(this)));
     }
     disconnectedCallback() {
      plt.jmp((() => disconnectedCallback(this)));
@@ -974,14 +982,17 @@ exports.addHostEventListeners = addHostEventListeners, exports.bootstrapLazy = (
      o.$flags$ = 1, e["s-hmr-load"] = () => {
       delete e["s-hmr-load"];
      }, initializeComponent(e, o, t);
-    })(this, l);
-   }), appData.BUILD.scopedSlotTextContentFix && patchTextContent(p.prototype, l), 
-   l.$lazyBundleId$ = e[0], s.includes(r) || n.get(r) || (o.push(r), n.define(r, proxyComponent(p, l, 1)));
+    })(this, o);
+   }), appData.BUILD.scopedSlotTextContentFix && patchTextContent(p.prototype, o), 
+   o.$lazyBundleId$ = e[0], n.includes(r) || l.get(r) || (s.push(r), l.define(r, proxyComponent(p, o, 1)));
   }));
- })), appData.BUILD.invisiblePrehydration && (appData.BUILD.hydratedClass || appData.BUILD.hydratedAttribute) && (p.innerHTML = o + "{visibility:hidden}.hydrated{visibility:inherit}", 
- p.setAttribute("data-styles", ""), l.insertBefore(p, r ? r.nextSibling : l.firstChild)), 
- $ = !1, i.length ? i.map((e => e.connectedCallback())) : appData.BUILD.profile ? plt.jmp((() => c = setTimeout(appDidLoad, 30, "timeout"))) : plt.jmp((() => c = setTimeout(appDidLoad, 30))), 
- a();
+ })), appData.BUILD.invisiblePrehydration && (appData.BUILD.hydratedClass || appData.BUILD.hydratedAttribute)) {
+  i.innerHTML = s + "{visibility:hidden}.hydrated{visibility:inherit}", i.setAttribute("data-styles", "");
+  const e = null !== (a = plt.$nonce$) && void 0 !== a ? a : queryNonceMetaTagContent(doc);
+  null != e && i.setAttribute("nonce", e), r.insertBefore(i, p ? p.nextSibling : r.firstChild);
+ }
+ u = !1, d.length ? d.map((e => e.connectedCallback())) : appData.BUILD.profile ? plt.jmp((() => $ = setTimeout(appDidLoad, 30, "timeout"))) : plt.jmp((() => $ = setTimeout(appDidLoad, 30))), 
+ o();
 }, exports.connectedCallback = connectedCallback, exports.consoleDevError = consoleDevError, 
 exports.consoleDevInfo = (...e) => {}, exports.consoleDevWarn = consoleDevWarn, 
 exports.consoleError = consoleError, exports.createEvent = (e, t, a) => {
@@ -1069,16 +1080,17 @@ exports.readTask = readTask, exports.registerComponents = e => {
  return t.$lazyInstance$ = e, hostRefs.set(e, t);
 }, exports.registerModule = function registerModule(e, t) {
  moduleLoaded.set(e, t);
-}, exports.renderVdom = renderVdom, exports.resetPlatform = function resetPlatform() {
+}, exports.renderVdom = renderVdom, exports.resetPlatform = function resetPlatform(e = {}) {
  win && "function" == typeof win.close && win.close(), hostRefs.clear(), styles.clear(), 
- plt.$flags$ = 0, Object.keys(Context).forEach((e => delete Context[e])), null != plt.$orgLocNodes$ && (plt.$orgLocNodes$.clear(), 
- plt.$orgLocNodes$ = void 0), win.location.href = plt.$resourcesUrl$ = "http://testing.stenciljs.com/", 
- function e() {
+ plt.$flags$ = 0, Object.keys(Context).forEach((e => delete Context[e])), Object.assign(plt, e), 
+ null != plt.$orgLocNodes$ && (plt.$orgLocNodes$.clear(), plt.$orgLocNodes$ = void 0), 
+ win.location.href = plt.$resourcesUrl$ = "http://testing.stenciljs.com/", function t() {
   queuedTicks.length = 0, queuedWriteTasks.length = 0, queuedReadTasks.length = 0, 
   moduleLoaded.clear(), queuedLoadModules.length = 0, caughtErrors.length = 0;
  }(), stopAutoApplyChanges(), cstrs.clear();
 }, exports.setAssetPath = e => plt.$resourcesUrl$ = e, exports.setErrorHandler = e => customError = e, 
-exports.setMode = e => modeResolutionChain.push(e), exports.setPlatformHelpers = e => {
+exports.setMode = e => modeResolutionChain.push(e), exports.setNonce = e => plt.$nonce$ = e, 
+exports.setPlatformHelpers = e => {
  Object.assign(plt, e);
 }, exports.setPlatformOptions = e => Object.assign(plt, e), exports.setSupportsShadowDom = e => {
  exports.supportsShadow = e;

package/internal/testing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/testing",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil internal testing platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/mock-doc/index.cjs

@@ -1,5 +1,5 @@
 /*!
- Stencil Mock Doc (CommonJS) v3.0.0-beta.1 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc (CommonJS) v3.0.0-rc.0 | MIT Licensed | https://stenciljs.com
  */
 var mockDoc = (function(exports) {
 'use strict';

package/mock-doc/index.js

@@ -1,5 +1,5 @@
 /*!
- Stencil Mock Doc v3.0.0-beta.1 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc v3.0.0-rc.0 | MIT Licensed | https://stenciljs.com
  */
 const CONTENT_REF_ID = 'r';
 const ORG_LOCATION_ID = 'o';

package/mock-doc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/mock-doc",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Mock window, document and DOM outside of a browser environment.",
   "main": "./index.cjs",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "license": "MIT",
   "main": "./internal/stencil-core/index.cjs",
   "module": "./internal/stencil-core/index.js",
@@ -91,7 +91,7 @@
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-jest": "^27.0.4",
     "eslint-plugin-jsdoc": "^39.3.1",
-    "eslint-plugin-simple-import-sort": "^8.0.0",
+    "eslint-plugin-simple-import-sort": "^9.0.0",
     "execa": "4.1.0",
     "exit": "^0.1.2",
     "fs-extra": "^11.0.0",
@@ -114,9 +114,9 @@
     "path-browserify": "^1.0.1",
     "pixelmatch": "5.3.0",
     "postcss": "^8.2.8",
-    "prettier": "2.8.2",
+    "prettier": "2.8.3",
     "prompts": "2.4.2",
-    "puppeteer": "^19.4.1",
+    "puppeteer": "^19.5.0",
     "rollup": "2.42.3",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "semver": "^7.3.7",

package/screenshot/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/screenshot",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil Screenshot.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/sys/node/index.js

@@ -1,5 +1,5 @@
 /*!
- Stencil Node System v3.0.0-beta.1 | MIT Licensed | https://stenciljs.com
+ Stencil Node System v3.0.0-rc.0 | MIT Licensed | https://stenciljs.com
  */
 function _interopDefaultLegacy(e) {
  return e && "object" == typeof e && "default" in e ? e : {

package/sys/node/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/sys/node",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil Node System.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/sys/node/worker.js

@@ -1,5 +1,5 @@
 /*!
- Stencil Node System Worker v3.0.0-beta.1 | MIT Licensed | https://stenciljs.com
+ Stencil Node System Worker v3.0.0-rc.0 | MIT Licensed | https://stenciljs.com
  */
 function _interopNamespace(e) {
  if (e && e.__esModule) return e;

package/testing/index.js

@@ -1,5 +1,5 @@
 /*!
- Stencil Testing v3.0.0-beta.1 | MIT Licensed | https://stenciljs.com
+ Stencil Testing v3.0.0-rc.0 | MIT Licensed | https://stenciljs.com
  */
 function _lazyRequire(e) {
  return new Proxy({}, {
@@ -3148,7 +3148,7 @@ const COMMON_DIR_MODULE_EXTS = [ ".tsx", ".ts", ".mjs", ".js", ".jsx", ".json",
  d("/");
  const C = {
   name: "in-memory",
-  version: "3.0.0-beta.1",
+  version: "3.0.0-rc.0",
   events: a,
   access: async e => u(e),
   accessSync: u,
@@ -4169,27 +4169,28 @@ exports.createJestPuppeteerEnvironment = function createJestPuppeteerEnvironment
  }
  return t;
 }, exports.newSpecPage = async function newSpecPage(e) {
+ var t;
  if (null == e) throw new Error("NewSpecPageOptions required");
- testing.resetPlatform(), resetBuildConditionals(appData.BUILD), Array.isArray(e.components) && testing.registerComponents(e.components), 
- e.hydrateClientSide && (e.includeAnnotations = !0), e.hydrateServerSide ? (e.includeAnnotations = !0, 
- testing.setSupportsShadowDom(!1)) : (e.includeAnnotations = !!e.includeAnnotations, 
+ testing.resetPlatform(null !== (t = e.platform) && void 0 !== t ? t : {}), resetBuildConditionals(appData.BUILD), 
+ Array.isArray(e.components) && testing.registerComponents(e.components), e.hydrateClientSide && (e.includeAnnotations = !0), 
+ e.hydrateServerSide ? (e.includeAnnotations = !0, testing.setSupportsShadowDom(!1)) : (e.includeAnnotations = !!e.includeAnnotations, 
  !1 === e.supportsShadowDom ? testing.setSupportsShadowDom(!1) : testing.setSupportsShadowDom(!0)), 
  appData.BUILD.cssAnnotations = e.includeAnnotations;
- const t = new Set;
+ const r = new Set;
  testing.win.__stencil_spec_options = e;
- const r = testing.win.document, s = {
+ const s = testing.win.document, n = {
   win: testing.win,
-  doc: r,
-  body: r.body,
+  doc: s,
+  body: s.body,
   build: appData.BUILD,
   styles: testing.styles,
-  setContent: e => (r.body.innerHTML = e, testing.flushAll()),
+  setContent: e => (s.body.innerHTML = e, testing.flushAll()),
   waitForChanges: testing.flushAll,
   flushLoadModule: testing.flushLoadModule,
   flushQueue: testing.flushQueue
- }, n = e.components.map((e => {
+ }, i = e.components.map((e => {
   if (null == e.COMPILER_META) throw new Error('Invalid component class: Missing static "COMPILER_META" property.');
-  t.add(e.COMPILER_META.tagName), e.isProxied = !1, function r(e) {
+  r.add(e.COMPILER_META.tagName), e.isProxied = !1, function t(e) {
    var t, r, s, n, i, o;
    "function" == typeof (null === (t = e.prototype) || void 0 === t ? void 0 : t.__componentWillLoad) && (e.prototype.componentWillLoad = e.prototype.__componentWillLoad, 
    e.prototype.__componentWillLoad = null), "function" == typeof (null === (r = e.prototype) || void 0 === r ? void 0 : r.__componentWillUpdate) && (e.prototype.componentWillUpdate = e.prototype.__componentWillUpdate, 
@@ -4227,7 +4228,7 @@ exports.createJestPuppeteerEnvironment = function createJestPuppeteerEnvironment
    return trimFalsy([ r, e.tagName, Object.keys(s).length > 0 ? s : void 0, n.length > 0 ? n : void 0 ]);
   })(e, !0))) ])(s, [ e.COMPILER_META ]);
   return i;
- })), i = (e => {
+ })), o = (e => {
   const t = e.some((e => e.htmlTagNames.includes("slot"))), r = e.some((e => "shadow" === e.encapsulation)), s = e.some((e => "shadow" !== e.encapsulation && e.htmlTagNames.includes("slot"))), n = {
    allRenderFn: e.every((e => e.hasRenderFn)),
    cmpDidLoad: e.some((e => e.hasComponentDidLoadFn)),
@@ -4287,24 +4288,24 @@ exports.createJestPuppeteerEnvironment = function createJestPuppeteerEnvironment
   return n.asyncLoading = n.cmpWillUpdate || n.cmpWillLoad || n.cmpWillRender, n.vdomAttribute = n.vdomAttribute || n.reflect, 
   n.vdomPropOrAttr = n.vdomPropOrAttr || n.reflect, n;
  })(e.components.map((e => e.COMPILER_META)));
- if (e.strictBuild ? Object.assign(appData.BUILD, i) : Object.keys(i).forEach((e => {
-  !0 === i[e] && (appData.BUILD[e] = !0);
+ if (e.strictBuild ? Object.assign(appData.BUILD, o) : Object.keys(o).forEach((e => {
+  !0 === o[e] && (appData.BUILD[e] = !0);
  })), appData.BUILD.asyncLoading = !0, e.hydrateClientSide ? (appData.BUILD.hydrateClientSide = !0, 
  appData.BUILD.hydrateServerSide = !1) : e.hydrateServerSide && (appData.BUILD.hydrateServerSide = !0, 
  appData.BUILD.hydrateClientSide = !1), appData.BUILD.cloneNodeFix = !1, appData.BUILD.shadowDomShim = !1, 
- appData.BUILD.safari10 = !1, appData.BUILD.attachStyles = !!e.attachStyles, "string" == typeof e.url && (s.win.location.href = e.url), 
- "string" == typeof e.direction && s.doc.documentElement.setAttribute("dir", e.direction), 
- "string" == typeof e.language && s.doc.documentElement.setAttribute("lang", e.language), 
+ appData.BUILD.safari10 = !1, appData.BUILD.attachStyles = !!e.attachStyles, "string" == typeof e.url && (n.win.location.href = e.url), 
+ "string" == typeof e.direction && n.doc.documentElement.setAttribute("dir", e.direction), 
+ "string" == typeof e.language && n.doc.documentElement.setAttribute("lang", e.language), 
  "string" == typeof e.cookie) try {
-  s.doc.cookie = e.cookie;
+  n.doc.cookie = e.cookie;
  } catch (e) {}
  if ("string" == typeof e.referrer) try {
-  s.doc.referrer = e.referrer;
+  n.doc.referrer = e.referrer;
  } catch (e) {}
  if ("string" == typeof e.userAgent) try {
-  s.win.navigator.userAgent = e.userAgent;
+  n.win.navigator.userAgent = e.userAgent;
  } catch (e) {}
- if (testing.bootstrapLazy(n), "function" == typeof e.template) {
+ if (testing.bootstrapLazy(i), "function" == typeof e.template) {
   const t = {
    $ancestorComponent$: void 0,
    $flags$: 0,
@@ -4313,26 +4314,26 @@ exports.createJestPuppeteerEnvironment = function createJestPuppeteerEnvironment
     $flags$: 0,
     $tagName$: "body"
    },
-   $hostElement$: s.body
+   $hostElement$: n.body
   };
   testing.renderVdom(t, e.template());
- } else "string" == typeof e.html && (s.body.innerHTML = e.html);
- !1 !== e.flushQueue && await s.waitForChanges();
- let o = null;
- return Object.defineProperty(s, "root", {
+ } else "string" == typeof e.html && (n.body.innerHTML = e.html);
+ !1 !== e.flushQueue && await n.waitForChanges();
+ let a = null;
+ return Object.defineProperty(n, "root", {
   get() {
-   if (null == o && (o = findRootComponent(t, s.body)), null != o) return o;
-   const e = s.body.firstElementChild;
+   if (null == a && (a = findRootComponent(r, n.body)), null != a) return a;
+   const e = n.body.firstElementChild;
    return null != e ? e : null;
   }
- }), Object.defineProperty(s, "rootInstance", {
+ }), Object.defineProperty(n, "rootInstance", {
   get() {
-   const e = testing.getHostRef(s.root);
+   const e = testing.getHostRef(n.root);
    return null != e ? e.$lazyInstance$ : null;
   }
- }), e.hydrateServerSide && testing.insertVdomAnnotations(r, []), e.autoApplyChanges && (testing.startAutoApplyChanges(), 
- s.waitForChanges = () => (console.error('waitForChanges() cannot be used manually if the "startAutoApplyChanges" option is enabled'), 
- Promise.resolve())), s;
+ }), e.hydrateServerSide && testing.insertVdomAnnotations(s, []), e.autoApplyChanges && (testing.startAutoApplyChanges(), 
+ n.waitForChanges = () => (console.error('waitForChanges() cannot be used manually if the "startAutoApplyChanges" option is enabled'), 
+ Promise.resolve())), n;
 }, exports.shuffleArray = function shuffleArray(e) {
  let t, r, s = e.length;
  for (;0 !== s; ) r = Math.floor(Math.random() * s), s -= 1, t = e[s], e[s] = e[r], 

package/testing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/testing",
-  "version": "3.0.0-beta.1",
+  "version": "3.0.0-rc.0",
   "description": "Stencil testing suite.",
   "main": "./index.js",
   "types": "./index.d.ts",