@stencil/core 4.18.3 → 4.19.0

package/internal/testing/index.js

@@ -113,6 +113,275 @@ var queuedLoadModules = [];
 var caughtErrors = [];
 var hostRefs = /* @__PURE__ */ new Map();
 
+// src/testing/platform/testing-host-ref.ts
+var getHostRef = (elm) => {
+  return hostRefs.get(elm);
+};
+var registerInstance = (lazyInstance, hostRef) => {
+  if (lazyInstance == null || lazyInstance.constructor == null) {
+    throw new Error(`Invalid component constructor`);
+  }
+  if (hostRef == null) {
+    const Cstr = lazyInstance.constructor;
+    const tagName = Cstr.COMPILER_META && Cstr.COMPILER_META.tagName ? Cstr.COMPILER_META.tagName : "div";
+    const elm = document.createElement(tagName);
+    registerHost(elm, { $flags$: 0, $tagName$: tagName });
+    hostRef = getHostRef(elm);
+  }
+  hostRef.$lazyInstance$ = lazyInstance;
+  return hostRefs.set(lazyInstance, hostRef);
+};
+var registerHost = (elm, cmpMeta) => {
+  const hostRef = {
+    $flags$: 0,
+    $hostElement$: elm,
+    $cmpMeta$: cmpMeta,
+    $instanceValues$: /* @__PURE__ */ new Map(),
+    $renderCount$: 0
+  };
+  hostRef.$onInstancePromise$ = new Promise((r) => hostRef.$onInstanceResolve$ = r);
+  hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
+  elm["s-p"] = [];
+  elm["s-rc"] = [];
+  hostRefs.set(elm, hostRef);
+};
+
+// src/testing/platform/testing-log.ts
+var customError;
+var defaultConsoleError = (e) => {
+  caughtErrors.push(e);
+};
+var consoleError = (e, el) => (customError || defaultConsoleError)(e, el);
+var consoleDevError = (...e) => {
+  caughtErrors.push(new Error(e.join(", ")));
+};
+var consoleDevWarn = (...args) => {
+  const params = args.filter((a) => typeof a === "string" || typeof a === "number" || typeof a === "boolean");
+  console.warn(...params);
+};
+var consoleDevInfo = (..._) => {
+};
+var setErrorHandler = (handler) => customError = handler;
+
+// src/testing/platform/testing-task-queue.ts
+function resetTaskQueue() {
+  queuedTicks.length = 0;
+  queuedWriteTasks.length = 0;
+  queuedReadTasks.length = 0;
+  moduleLoaded.clear();
+  queuedLoadModules.length = 0;
+  caughtErrors.length = 0;
+}
+var nextTick = (cb) => {
+  queuedTicks.push(cb);
+};
+function flushTicks() {
+  return new Promise((resolve, reject) => {
+    function drain() {
+      try {
+        if (queuedTicks.length > 0) {
+          const writeTasks = queuedTicks.slice();
+          queuedTicks.length = 0;
+          let cb;
+          while (cb = writeTasks.shift()) {
+            cb(Date.now());
+          }
+        }
+        if (queuedTicks.length > 0) {
+          process.nextTick(drain);
+        } else {
+          resolve();
+        }
+      } catch (e) {
+        reject(`flushTicks: ${e}`);
+      }
+    }
+    process.nextTick(drain);
+  });
+}
+function writeTask(cb) {
+  queuedWriteTasks.push(cb);
+}
+function readTask(cb) {
+  queuedReadTasks.push(cb);
+}
+function flushQueue() {
+  return new Promise((resolve, reject) => {
+    async function drain() {
+      try {
+        if (queuedReadTasks.length > 0) {
+          const readTasks = queuedReadTasks.slice();
+          queuedReadTasks.length = 0;
+          let cb;
+          while (cb = readTasks.shift()) {
+            const result = cb(Date.now());
+            if (result != null && typeof result.then === "function") {
+              await result;
+            }
+          }
+        }
+        if (queuedWriteTasks.length > 0) {
+          const writeTasks = queuedWriteTasks.slice();
+          queuedWriteTasks.length = 0;
+          let cb;
+          while (cb = writeTasks.shift()) {
+            const result = cb(Date.now());
+            if (result != null && typeof result.then === "function") {
+              await result;
+            }
+          }
+        }
+        if (queuedReadTasks.length + queuedWriteTasks.length > 0) {
+          process.nextTick(drain);
+        } else {
+          resolve();
+        }
+      } catch (e) {
+        reject(`flushQueue: ${e}`);
+      }
+    }
+    process.nextTick(drain);
+  });
+}
+async function flushAll() {
+  while (queuedTicks.length + queuedLoadModules.length + queuedWriteTasks.length + queuedReadTasks.length > 0) {
+    await flushTicks();
+    await flushLoadModule();
+    await flushQueue();
+  }
+  if (caughtErrors.length > 0) {
+    const err2 = caughtErrors[0];
+    if (err2 == null) {
+      throw new Error("Error!");
+    }
+    if (typeof err2 === "string") {
+      throw new Error(err2);
+    }
+    throw err2;
+  }
+  return new Promise((resolve) => process.nextTick(resolve));
+}
+function loadModule(cmpMeta, _hostRef, _hmrVersionId) {
+  return new Promise((resolve) => {
+    queuedLoadModules.push({
+      bundleId: cmpMeta.$lazyBundleId$,
+      resolve: () => resolve(moduleLoaded.get(cmpMeta.$lazyBundleId$))
+    });
+  });
+}
+function flushLoadModule(bundleId) {
+  return new Promise((resolve, reject) => {
+    try {
+      process.nextTick(() => {
+        if (bundleId != null) {
+          for (let i2 = 0; i2 < queuedLoadModules.length; i2++) {
+            if (queuedLoadModules[i2].bundleId === bundleId) {
+              queuedLoadModules[i2].resolve();
+              queuedLoadModules.splice(i2, 1);
+              i2--;
+            }
+          }
+        } else {
+          let queuedLoadModule;
+          while (queuedLoadModule = queuedLoadModules.shift()) {
+            queuedLoadModule.resolve();
+          }
+        }
+        resolve();
+      });
+    } catch (e) {
+      reject(`flushLoadModule: ${e}`);
+    }
+  });
+}
+
+// src/testing/platform/testing-window.ts
+var import_mock_doc = require("../../mock-doc/index.cjs");
+var win = (0, import_mock_doc.setupGlobal)(global);
+var doc = win.document;
+
+// src/testing/platform/testing-platform.ts
+var supportsShadow = true;
+var plt = {
+  $flags$: 0,
+  $resourcesUrl$: "",
+  jmp: (h2) => h2(),
+  raf: (h2) => requestAnimationFrame(h2),
+  ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
+  rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
+  ce: (eventName, opts) => new win.CustomEvent(eventName, opts)
+};
+var setPlatformHelpers = (helpers) => {
+  Object.assign(plt, helpers);
+};
+var supportsListenerOptions = true;
+var supportsConstructableStylesheets = false;
+var setSupportsShadowDom = (supports) => {
+  supportsShadow = supports;
+};
+function resetPlatform(defaults = {}) {
+  if (win && typeof win.close === "function") {
+    win.close();
+  }
+  hostRefs.clear();
+  styles.clear();
+  plt.$flags$ = 0;
+  Object.assign(plt, defaults);
+  if (plt.$orgLocNodes$ != null) {
+    plt.$orgLocNodes$.clear();
+    plt.$orgLocNodes$ = void 0;
+  }
+  win.location.href = plt.$resourcesUrl$ = `http://testing.stenciljs.com/`;
+  resetTaskQueue();
+  stopAutoApplyChanges();
+  cstrs.clear();
+}
+var isAutoApplyingChanges = false;
+var autoApplyTimer = void 0;
+function stopAutoApplyChanges() {
+  isAutoApplyingChanges = false;
+  if (autoApplyTimer) {
+    clearTimeout(autoApplyTimer);
+    autoApplyTimer = void 0;
+  }
+}
+async function startAutoApplyChanges() {
+  isAutoApplyingChanges = true;
+  flushAll().then(() => {
+    if (isAutoApplyingChanges) {
+      autoApplyTimer = setTimeout(() => {
+        startAutoApplyChanges();
+      }, 100);
+    }
+  });
+}
+var registerComponents = (Cstrs) => {
+  Cstrs.filter((Cstr) => Cstr.COMPILER_META).forEach((Cstr) => {
+    cstrs.set(Cstr.COMPILER_META.tagName, Cstr);
+  });
+};
+function registerModule(bundleId, Cstr) {
+  moduleLoaded.set(bundleId, Cstr);
+}
+var isMemberInElement = (elm, memberName) => {
+  if (elm != null) {
+    if (memberName in elm) {
+      return true;
+    }
+    const nodeName = elm.nodeName;
+    if (nodeName) {
+      const cstr = cstrs.get(nodeName.toLowerCase());
+      if (cstr != null && cstr.COMPILER_META != null && cstr.COMPILER_META.properties != null) {
+        return cstr.COMPILER_META.properties.some((p) => p.name === memberName);
+      }
+    }
+  }
+  return false;
+};
+
+// src/testing/platform/index.ts
+var import_app_data21 = require("@stencil/core/internal/app-data");
+
 // src/runtime/asset-path.ts
 var getAssetPath = (path) => {
   const assetUrl = new URL(path, plt.$resourcesUrl$);
@@ -718,6 +987,8 @@ var registerStyle = (scopeId2, cssText, allowCS) => {
 };
 var addStyle = (styleContainerNode, cmpMeta, mode) => {
   var _a;
+  const styleContainerDocument = styleContainerNode;
+  const styleContainerShadowRoot = styleContainerNode;
   const scopeId2 = getScopeId(cmpMeta, mode);
   const style = styles.get(scopeId2);
   if (!import_app_data7.BUILD.attachStyles) {
@@ -726,14 +997,14 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
   styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc;
   if (style) {
     if (typeof style === "string") {
-      styleContainerNode = styleContainerNode.head || styleContainerNode;
+      styleContainerNode = styleContainerDocument.head || styleContainerNode;
       let appliedStyles = rootAppliedStyles.get(styleContainerNode);
       let styleElm;
       if (!appliedStyles) {
         rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
       }
       if (!appliedStyles.has(scopeId2)) {
-        if (import_app_data7.BUILD.hydrateClientSide && styleContainerNode.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
+        if (import_app_data7.BUILD.hydrateClientSide && styleContainerShadowRoot.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
           styleElm.innerHTML = style;
         } else {
           styleElm = doc.createElement("style");
@@ -754,8 +1025,8 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
           appliedStyles.add(scopeId2);
         }
       }
-    } else if (import_app_data7.BUILD.constructableCSS && !styleContainerNode.adoptedStyleSheets.includes(style)) {
-      styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
+    } else if (import_app_data7.BUILD.constructableCSS && !styleContainerDocument.adoptedStyleSheets.includes(style)) {
+      styleContainerDocument.adoptedStyleSheets = [...styleContainerDocument.adoptedStyleSheets, style];
     }
   }
   return scopeId2;
@@ -966,9 +1237,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
     }
     elm = newVNode2.$elm$ = import_app_data10.BUILD.svg ? doc.createElementNS(
       isSvgMode ? SVG_NS : HTML_NS,
-      import_app_data10.BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
+      !useNativeShadowDom && import_app_data10.BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
     ) : doc.createElement(
-      import_app_data10.BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
+      !useNativeShadowDom && import_app_data10.BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
     );
     if (import_app_data10.BUILD.svg && isSvgMode && newVNode2.$tag$ === "foreignObject") {
       isSvgMode = false;
@@ -1555,7 +1826,10 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
   endSchedule();
   return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
 };
-var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn) : fn();
+var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn).catch((err2) => {
+  console.error(err2);
+  fn();
+}) : fn();
 var isPromisey = (maybePromise) => maybePromise instanceof Promise || maybePromise && maybePromise.then && typeof maybePromise.then === "function";
 var updateComponent = async (hostRef, instance, isInitialLoad) => {
   var _a;
@@ -1844,7 +2118,7 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
 
 // src/runtime/proxy-component.ts
 var proxyComponent = (Cstr, cmpMeta, flags) => {
-  var _a;
+  var _a, _b;
   const prototype = Cstr.prototype;
   if (import_app_data13.BUILD.formAssociated && cmpMeta.$flags$ & 64 /* formAssociated */ && flags & 1 /* isElementConstructor */) {
     FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS.forEach(
@@ -1866,11 +2140,11 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
       })
     );
   }
-  if (import_app_data13.BUILD.member && cmpMeta.$members$) {
-    if (import_app_data13.BUILD.watchCallback && Cstr.watchers) {
+  if (import_app_data13.BUILD.member && cmpMeta.$members$ || import_app_data13.BUILD.watchCallback && (cmpMeta.$watchers$ || Cstr.watchers)) {
+    if (import_app_data13.BUILD.watchCallback && Cstr.watchers && !cmpMeta.$watchers$) {
       cmpMeta.$watchers$ = Cstr.watchers;
     }
-    const members = Object.entries(cmpMeta.$members$);
+    const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
     members.map(([memberName, [memberFlags]]) => {
       if ((import_app_data13.BUILD.prop || import_app_data13.BUILD.state) && (memberFlags & 31 /* Prop */ || (!import_app_data13.BUILD.lazyLoad || flags & 2 /* proxyState */) && memberFlags & 32 /* State */)) {
         Object.defineProperty(prototype, memberName, {
@@ -1942,7 +2216,7 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
       };
       Cstr.observedAttributes = Array.from(
         /* @__PURE__ */ new Set([
-          ...Object.keys((_a = cmpMeta.$watchers$) != null ? _a : {}),
+          ...Object.keys((_b = cmpMeta.$watchers$) != null ? _b : {}),
           ...members.filter(([_, m]) => m[0] & 15 /* HasAttribute */).map(([propName, m]) => {
             var _a2;
             const attrName = m[1] || propName;
@@ -2010,11 +2284,13 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
       customElements.whenDefined(cmpTag).then(() => hostRef.$flags$ |= 128 /* isWatchReady */);
     }
     if (import_app_data14.BUILD.style && Cstr && Cstr.style) {
-      let style = Cstr.style;
-      if (import_app_data14.BUILD.mode && typeof style !== "string") {
+      let style;
+      if (typeof Cstr.style === "string") {
+        style = Cstr.style;
+      } else if (import_app_data14.BUILD.mode && typeof Cstr.style !== "string") {
         hostRef.$modeName$ = computeMode(elm);
         if (hostRef.$modeName$) {
-          style = style[hostRef.$modeName$];
+          style = Cstr.style[hostRef.$modeName$];
         }
         if (import_app_data14.BUILD.hydrateServerSide && hostRef.$modeName$) {
           elm.setAttribute("s-mode", hostRef.$modeName$);
@@ -2507,6 +2783,8 @@ var proxyCustomElement = (Cstr, compactMeta) => {
       registerHost(this, cmpMeta);
     },
     connectedCallback() {
+      const hostRef = getHostRef(this);
+      addHostEventListeners(this, hostRef, cmpMeta.$listeners$, false);
       connectedCallback(this);
       if (import_app_data18.BUILD.connectedCallback && originalConnectedCallback) {
         originalConnectedCallback.call(this);
@@ -2520,13 +2798,21 @@ var proxyCustomElement = (Cstr, compactMeta) => {
     },
     __attachShadow() {
       if (supportsShadow) {
-        if (import_app_data18.BUILD.shadowDelegatesFocus) {
-          this.attachShadow({
-            mode: "open",
-            delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
-          });
+        if (!this.shadowRoot) {
+          if (import_app_data18.BUILD.shadowDelegatesFocus) {
+            this.attachShadow({
+              mode: "open",
+              delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
+            });
+          } else {
+            this.attachShadow({ mode: "open" });
+          }
         } else {
-          this.attachShadow({ mode: "open" });
+          if (this.shadowRoot.mode !== "open") {
+            throw new Error(
+              `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`
+            );
+          }
         }
       } else {
         this.shadowRoot = this;
@@ -2636,17 +2922,26 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
         // StencilLazyHost
         constructor(self) {
           super(self);
+          this.hasRegisteredEventListeners = false;
           self = this;
           registerHost(self, cmpMeta);
           if (import_app_data19.BUILD.shadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
             if (supportsShadow) {
-              if (import_app_data19.BUILD.shadowDelegatesFocus) {
-                self.attachShadow({
-                  mode: "open",
-                  delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
-                });
+              if (!self.shadowRoot) {
+                if (import_app_data19.BUILD.shadowDelegatesFocus) {
+                  self.attachShadow({
+                    mode: "open",
+                    delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
+                  });
+                } else {
+                  self.attachShadow({ mode: "open" });
+                }
               } else {
-                self.attachShadow({ mode: "open" });
+                if (self.shadowRoot.mode !== "open") {
+                  throw new Error(
+                    `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${self.shadowRoot.mode} but Stencil only supports open shadow roots.`
+                  );
+                }
               }
             } else if (!import_app_data19.BUILD.hydrateServerSide && !("shadowRoot" in self)) {
               self.shadowRoot = self;
@@ -2654,6 +2949,11 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
           }
         }
         connectedCallback() {
+          const hostRef = getHostRef(this);
+          if (!this.hasRegisteredEventListeners) {
+            this.hasRegisteredEventListeners = true;
+            addHostEventListeners(this, hostRef, cmpMeta.$listeners$, false);
+          }
           if (appLoadFallback) {
             clearTimeout(appLoadFallback);
             appLoadFallback = null;
@@ -2712,7 +3012,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
       dataStyles.textContent += SLOT_FB_CSS;
     }
     if (import_app_data19.BUILD.invisiblePrehydration && (import_app_data19.BUILD.hydratedClass || import_app_data19.BUILD.hydratedAttribute)) {
-      dataStyles.textContent += cmpTags + HYDRATED_CSS;
+      dataStyles.textContent += cmpTags.sort() + HYDRATED_CSS;
     }
     if (dataStyles.innerHTML.length) {
       dataStyles.setAttribute("data-styles", "");
@@ -2803,402 +3103,134 @@ var insertVdomAnnotations = (doc2, staticComponents) => {
       staticComponents: new Set(staticComponents)
     };
     const orgLocationNodes = [];
-    parseVNodeAnnotations(doc2, doc2.body, docData, orgLocationNodes);
-    orgLocationNodes.forEach((orgLocationNode) => {
-      var _a;
-      if (orgLocationNode != null && orgLocationNode["s-nr"]) {
-        const nodeRef = orgLocationNode["s-nr"];
-        let hostId = nodeRef["s-host-id"];
-        let nodeId = nodeRef["s-node-id"];
-        let childId = `${hostId}.${nodeId}`;
-        if (hostId == null) {
-          hostId = 0;
-          docData.rootLevelIds++;
-          nodeId = docData.rootLevelIds;
-          childId = `${hostId}.${nodeId}`;
-          if (nodeRef.nodeType === 1 /* ElementNode */) {
-            nodeRef.setAttribute(HYDRATE_CHILD_ID, childId);
-          } else if (nodeRef.nodeType === 3 /* TextNode */) {
-            if (hostId === 0) {
-              const textContent = (_a = nodeRef.nodeValue) == null ? void 0 : _a.trim();
-              if (textContent === "") {
-                orgLocationNode.remove();
-                return;
-              }
-            }
-            const commentBeforeTextNode = doc2.createComment(childId);
-            commentBeforeTextNode.nodeValue = `${TEXT_NODE_ID}.${childId}`;
-            insertBefore(nodeRef.parentNode, commentBeforeTextNode, nodeRef);
-          }
-        }
-        let orgLocationNodeId = `${ORG_LOCATION_ID}.${childId}`;
-        const orgLocationParentNode = orgLocationNode.parentElement;
-        if (orgLocationParentNode) {
-          if (orgLocationParentNode["s-en"] === "") {
-            orgLocationNodeId += `.`;
-          } else if (orgLocationParentNode["s-en"] === "c") {
-            orgLocationNodeId += `.c`;
-          }
-        }
-        orgLocationNode.nodeValue = orgLocationNodeId;
-      }
-    });
-  }
-};
-var parseVNodeAnnotations = (doc2, node, docData, orgLocationNodes) => {
-  if (node == null) {
-    return;
-  }
-  if (node["s-nr"] != null) {
-    orgLocationNodes.push(node);
-  }
-  if (node.nodeType === 1 /* ElementNode */) {
-    node.childNodes.forEach((childNode) => {
-      const hostRef = getHostRef(childNode);
-      if (hostRef != null && !docData.staticComponents.has(childNode.nodeName.toLowerCase())) {
-        const cmpData = {
-          nodeIds: 0
-        };
-        insertVNodeAnnotations(doc2, childNode, hostRef.$vnode$, docData, cmpData);
-      }
-      parseVNodeAnnotations(doc2, childNode, docData, orgLocationNodes);
-    });
-  }
-};
-var insertVNodeAnnotations = (doc2, hostElm, vnode, docData, cmpData) => {
-  if (vnode != null) {
-    const hostId = ++docData.hostIds;
-    hostElm.setAttribute(HYDRATE_ID, hostId);
-    if (hostElm["s-cr"] != null) {
-      hostElm["s-cr"].nodeValue = `${CONTENT_REF_ID}.${hostId}`;
-    }
-    if (vnode.$children$ != null) {
-      const depth = 0;
-      vnode.$children$.forEach((vnodeChild, index) => {
-        insertChildVNodeAnnotations(doc2, vnodeChild, cmpData, hostId, depth, index);
-      });
-    }
-    if (hostElm && vnode && vnode.$elm$ && !hostElm.hasAttribute(HYDRATE_CHILD_ID)) {
-      const parent = hostElm.parentElement;
-      if (parent && parent.childNodes) {
-        const parentChildNodes = Array.from(parent.childNodes);
-        const comment = parentChildNodes.find(
-          (node) => node.nodeType === 8 /* CommentNode */ && node["s-sr"]
-        );
-        if (comment) {
-          const index = parentChildNodes.indexOf(hostElm) - 1;
-          vnode.$elm$.setAttribute(
-            HYDRATE_CHILD_ID,
-            `${comment["s-host-id"]}.${comment["s-node-id"]}.0.${index}`
-          );
-        }
-      }
-    }
-  }
-};
-var insertChildVNodeAnnotations = (doc2, vnodeChild, cmpData, hostId, depth, index) => {
-  const childElm = vnodeChild.$elm$;
-  if (childElm == null) {
-    return;
-  }
-  const nodeId = cmpData.nodeIds++;
-  const childId = `${hostId}.${nodeId}.${depth}.${index}`;
-  childElm["s-host-id"] = hostId;
-  childElm["s-node-id"] = nodeId;
-  if (childElm.nodeType === 1 /* ElementNode */) {
-    childElm.setAttribute(HYDRATE_CHILD_ID, childId);
-  } else if (childElm.nodeType === 3 /* TextNode */) {
-    const parentNode = childElm.parentNode;
-    const nodeName = parentNode == null ? void 0 : parentNode.nodeName;
-    if (nodeName !== "STYLE" && nodeName !== "SCRIPT") {
-      const textNodeId = `${TEXT_NODE_ID}.${childId}`;
-      const commentBeforeTextNode = doc2.createComment(textNodeId);
-      insertBefore(parentNode, commentBeforeTextNode, childElm);
-    }
-  } else if (childElm.nodeType === 8 /* CommentNode */) {
-    if (childElm["s-sr"]) {
-      const slotName = childElm["s-sn"] || "";
-      const slotNodeId = `${SLOT_NODE_ID}.${childId}.${slotName}`;
-      childElm.nodeValue = slotNodeId;
-    }
-  }
-  if (vnodeChild.$children$ != null) {
-    const childDepth = depth + 1;
-    vnodeChild.$children$.forEach((vnode, index2) => {
-      insertChildVNodeAnnotations(doc2, vnode, cmpData, hostId, childDepth, index2);
-    });
-  }
-};
-
-// src/testing/platform/testing-host-ref.ts
-var getHostRef = (elm) => {
-  return hostRefs.get(elm);
-};
-var registerInstance = (lazyInstance, hostRef) => {
-  if (lazyInstance == null || lazyInstance.constructor == null) {
-    throw new Error(`Invalid component constructor`);
-  }
-  if (hostRef == null) {
-    const Cstr = lazyInstance.constructor;
-    const tagName = Cstr.COMPILER_META && Cstr.COMPILER_META.tagName ? Cstr.COMPILER_META.tagName : "div";
-    const elm = document.createElement(tagName);
-    registerHost(elm, { $flags$: 0, $tagName$: tagName });
-    hostRef = getHostRef(elm);
-  }
-  hostRef.$lazyInstance$ = lazyInstance;
-  return hostRefs.set(lazyInstance, hostRef);
-};
-var registerHost = (elm, cmpMeta) => {
-  const hostRef = {
-    $flags$: 0,
-    $hostElement$: elm,
-    $cmpMeta$: cmpMeta,
-    $instanceValues$: /* @__PURE__ */ new Map(),
-    $renderCount$: 0
-  };
-  hostRef.$onInstancePromise$ = new Promise((r) => hostRef.$onInstanceResolve$ = r);
-  hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
-  elm["s-p"] = [];
-  elm["s-rc"] = [];
-  addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false);
-  hostRefs.set(elm, hostRef);
-};
-
-// src/testing/platform/testing-log.ts
-var customError;
-var defaultConsoleError = (e) => {
-  caughtErrors.push(e);
-};
-var consoleError = (e, el) => (customError || defaultConsoleError)(e, el);
-var consoleDevError = (...e) => {
-  caughtErrors.push(new Error(e.join(", ")));
-};
-var consoleDevWarn = (...args) => {
-  const params = args.filter((a) => typeof a === "string" || typeof a === "number" || typeof a === "boolean");
-  console.warn(...params);
-};
-var consoleDevInfo = (..._) => {
-};
-var setErrorHandler = (handler) => customError = handler;
-
-// src/testing/platform/testing-task-queue.ts
-function resetTaskQueue() {
-  queuedTicks.length = 0;
-  queuedWriteTasks.length = 0;
-  queuedReadTasks.length = 0;
-  moduleLoaded.clear();
-  queuedLoadModules.length = 0;
-  caughtErrors.length = 0;
-}
-var nextTick = (cb) => {
-  queuedTicks.push(cb);
-};
-function flushTicks() {
-  return new Promise((resolve, reject) => {
-    function drain() {
-      try {
-        if (queuedTicks.length > 0) {
-          const writeTasks = queuedTicks.slice();
-          queuedTicks.length = 0;
-          let cb;
-          while (cb = writeTasks.shift()) {
-            cb(Date.now());
-          }
-        }
-        if (queuedTicks.length > 0) {
-          process.nextTick(drain);
-        } else {
-          resolve();
-        }
-      } catch (e) {
-        reject(`flushTicks: ${e}`);
-      }
-    }
-    process.nextTick(drain);
-  });
-}
-function writeTask(cb) {
-  queuedWriteTasks.push(cb);
-}
-function readTask(cb) {
-  queuedReadTasks.push(cb);
-}
-function flushQueue() {
-  return new Promise((resolve, reject) => {
-    async function drain() {
-      try {
-        if (queuedReadTasks.length > 0) {
-          const readTasks = queuedReadTasks.slice();
-          queuedReadTasks.length = 0;
-          let cb;
-          while (cb = readTasks.shift()) {
-            const result = cb(Date.now());
-            if (result != null && typeof result.then === "function") {
-              await result;
+    parseVNodeAnnotations(doc2, doc2.body, docData, orgLocationNodes);
+    orgLocationNodes.forEach((orgLocationNode) => {
+      var _a;
+      if (orgLocationNode != null && orgLocationNode["s-nr"]) {
+        const nodeRef = orgLocationNode["s-nr"];
+        let hostId = nodeRef["s-host-id"];
+        let nodeId = nodeRef["s-node-id"];
+        let childId = `${hostId}.${nodeId}`;
+        if (hostId == null) {
+          hostId = 0;
+          docData.rootLevelIds++;
+          nodeId = docData.rootLevelIds;
+          childId = `${hostId}.${nodeId}`;
+          if (nodeRef.nodeType === 1 /* ElementNode */) {
+            nodeRef.setAttribute(HYDRATE_CHILD_ID, childId);
+          } else if (nodeRef.nodeType === 3 /* TextNode */) {
+            if (hostId === 0) {
+              const textContent = (_a = nodeRef.nodeValue) == null ? void 0 : _a.trim();
+              if (textContent === "") {
+                orgLocationNode.remove();
+                return;
+              }
             }
+            const commentBeforeTextNode = doc2.createComment(childId);
+            commentBeforeTextNode.nodeValue = `${TEXT_NODE_ID}.${childId}`;
+            insertBefore(nodeRef.parentNode, commentBeforeTextNode, nodeRef);
           }
         }
-        if (queuedWriteTasks.length > 0) {
-          const writeTasks = queuedWriteTasks.slice();
-          queuedWriteTasks.length = 0;
-          let cb;
-          while (cb = writeTasks.shift()) {
-            const result = cb(Date.now());
-            if (result != null && typeof result.then === "function") {
-              await result;
-            }
+        let orgLocationNodeId = `${ORG_LOCATION_ID}.${childId}`;
+        const orgLocationParentNode = orgLocationNode.parentElement;
+        if (orgLocationParentNode) {
+          if (orgLocationParentNode["s-en"] === "") {
+            orgLocationNodeId += `.`;
+          } else if (orgLocationParentNode["s-en"] === "c") {
+            orgLocationNodeId += `.c`;
           }
         }
-        if (queuedReadTasks.length + queuedWriteTasks.length > 0) {
-          process.nextTick(drain);
-        } else {
-          resolve();
-        }
-      } catch (e) {
-        reject(`flushQueue: ${e}`);
+        orgLocationNode.nodeValue = orgLocationNodeId;
       }
-    }
-    process.nextTick(drain);
-  });
-}
-async function flushAll() {
-  while (queuedTicks.length + queuedLoadModules.length + queuedWriteTasks.length + queuedReadTasks.length > 0) {
-    await flushTicks();
-    await flushLoadModule();
-    await flushQueue();
-  }
-  if (caughtErrors.length > 0) {
-    const err2 = caughtErrors[0];
-    if (err2 == null) {
-      throw new Error("Error!");
-    }
-    if (typeof err2 === "string") {
-      throw new Error(err2);
-    }
-    throw err2;
-  }
-  return new Promise((resolve) => process.nextTick(resolve));
-}
-function loadModule(cmpMeta, _hostRef, _hmrVersionId) {
-  return new Promise((resolve) => {
-    queuedLoadModules.push({
-      bundleId: cmpMeta.$lazyBundleId$,
-      resolve: () => resolve(moduleLoaded.get(cmpMeta.$lazyBundleId$))
     });
-  });
-}
-function flushLoadModule(bundleId) {
-  return new Promise((resolve, reject) => {
-    try {
-      process.nextTick(() => {
-        if (bundleId != null) {
-          for (let i2 = 0; i2 < queuedLoadModules.length; i2++) {
-            if (queuedLoadModules[i2].bundleId === bundleId) {
-              queuedLoadModules[i2].resolve();
-              queuedLoadModules.splice(i2, 1);
-              i2--;
-            }
-          }
-        } else {
-          let queuedLoadModule;
-          while (queuedLoadModule = queuedLoadModules.shift()) {
-            queuedLoadModule.resolve();
-          }
-        }
-        resolve();
-      });
-    } catch (e) {
-      reject(`flushLoadModule: ${e}`);
-    }
-  });
-}
-
-// src/testing/platform/testing-window.ts
-var import_mock_doc = require("../../mock-doc/index.cjs");
-var win = (0, import_mock_doc.setupGlobal)(global);
-var doc = win.document;
-
-// src/testing/platform/testing-platform.ts
-var supportsShadow = true;
-var plt = {
-  $flags$: 0,
-  $resourcesUrl$: "",
-  jmp: (h2) => h2(),
-  raf: (h2) => requestAnimationFrame(h2),
-  ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
-  rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
-  ce: (eventName, opts) => new win.CustomEvent(eventName, opts)
-};
-var setPlatformHelpers = (helpers) => {
-  Object.assign(plt, helpers);
-};
-var supportsListenerOptions = true;
-var supportsConstructableStylesheets = false;
-var setSupportsShadowDom = (supports) => {
-  supportsShadow = supports;
+  }
 };
-function resetPlatform(defaults = {}) {
-  if (win && typeof win.close === "function") {
-    win.close();
+var parseVNodeAnnotations = (doc2, node, docData, orgLocationNodes) => {
+  var _a;
+  if (node == null) {
+    return;
   }
-  hostRefs.clear();
-  styles.clear();
-  plt.$flags$ = 0;
-  Object.assign(plt, defaults);
-  if (plt.$orgLocNodes$ != null) {
-    plt.$orgLocNodes$.clear();
-    plt.$orgLocNodes$ = void 0;
+  if (node["s-nr"] != null) {
+    orgLocationNodes.push(node);
   }
-  win.location.href = plt.$resourcesUrl$ = `http://testing.stenciljs.com/`;
-  resetTaskQueue();
-  stopAutoApplyChanges();
-  cstrs.clear();
-}
-var isAutoApplyingChanges = false;
-var autoApplyTimer = void 0;
-function stopAutoApplyChanges() {
-  isAutoApplyingChanges = false;
-  if (autoApplyTimer) {
-    clearTimeout(autoApplyTimer);
-    autoApplyTimer = void 0;
+  if (node.nodeType === 1 /* ElementNode */) {
+    const childNodes = [...Array.from(node.childNodes), ...Array.from(((_a = node.shadowRoot) == null ? void 0 : _a.childNodes) || [])];
+    childNodes.forEach((childNode) => {
+      const hostRef = getHostRef(childNode);
+      if (hostRef != null && !docData.staticComponents.has(childNode.nodeName.toLowerCase())) {
+        const cmpData = {
+          nodeIds: 0
+        };
+        insertVNodeAnnotations(doc2, childNode, hostRef.$vnode$, docData, cmpData);
+      }
+      parseVNodeAnnotations(doc2, childNode, docData, orgLocationNodes);
+    });
   }
-}
-async function startAutoApplyChanges() {
-  isAutoApplyingChanges = true;
-  flushAll().then(() => {
-    if (isAutoApplyingChanges) {
-      autoApplyTimer = setTimeout(() => {
-        startAutoApplyChanges();
-      }, 100);
-    }
-  });
-}
-var registerComponents = (Cstrs) => {
-  Cstrs.filter((Cstr) => Cstr.COMPILER_META).forEach((Cstr) => {
-    cstrs.set(Cstr.COMPILER_META.tagName, Cstr);
-  });
 };
-function registerModule(bundleId, Cstr) {
-  moduleLoaded.set(bundleId, Cstr);
-}
-var isMemberInElement = (elm, memberName) => {
-  if (elm != null) {
-    if (memberName in elm) {
-      return true;
+var insertVNodeAnnotations = (doc2, hostElm, vnode, docData, cmpData) => {
+  if (vnode != null) {
+    const hostId = ++docData.hostIds;
+    hostElm.setAttribute(HYDRATE_ID, hostId);
+    if (hostElm["s-cr"] != null) {
+      hostElm["s-cr"].nodeValue = `${CONTENT_REF_ID}.${hostId}`;
     }
-    const nodeName = elm.nodeName;
-    if (nodeName) {
-      const cstr = cstrs.get(nodeName.toLowerCase());
-      if (cstr != null && cstr.COMPILER_META != null && cstr.COMPILER_META.properties != null) {
-        return cstr.COMPILER_META.properties.some((p) => p.name === memberName);
+    if (vnode.$children$ != null) {
+      const depth = 0;
+      vnode.$children$.forEach((vnodeChild, index) => {
+        insertChildVNodeAnnotations(doc2, vnodeChild, cmpData, hostId, depth, index);
+      });
+    }
+    if (hostElm && vnode && vnode.$elm$ && !hostElm.hasAttribute(HYDRATE_CHILD_ID)) {
+      const parent = hostElm.parentElement;
+      if (parent && parent.childNodes) {
+        const parentChildNodes = Array.from(parent.childNodes);
+        const comment = parentChildNodes.find(
+          (node) => node.nodeType === 8 /* CommentNode */ && node["s-sr"]
+        );
+        if (comment) {
+          const index = parentChildNodes.indexOf(hostElm) - 1;
+          vnode.$elm$.setAttribute(
+            HYDRATE_CHILD_ID,
+            `${comment["s-host-id"]}.${comment["s-node-id"]}.0.${index}`
+          );
+        }
       }
     }
   }
-  return false;
 };
-
-// src/testing/platform/index.ts
-var import_app_data21 = require("@stencil/core/internal/app-data");
+var insertChildVNodeAnnotations = (doc2, vnodeChild, cmpData, hostId, depth, index) => {
+  const childElm = vnodeChild.$elm$;
+  if (childElm == null) {
+    return;
+  }
+  const nodeId = cmpData.nodeIds++;
+  const childId = `${hostId}.${nodeId}.${depth}.${index}`;
+  childElm["s-host-id"] = hostId;
+  childElm["s-node-id"] = nodeId;
+  if (childElm.nodeType === 1 /* ElementNode */) {
+    childElm.setAttribute(HYDRATE_CHILD_ID, childId);
+  } else if (childElm.nodeType === 3 /* TextNode */) {
+    const parentNode = childElm.parentNode;
+    const nodeName = parentNode == null ? void 0 : parentNode.nodeName;
+    if (nodeName !== "STYLE" && nodeName !== "SCRIPT") {
+      const textNodeId = `${TEXT_NODE_ID}.${childId}`;
+      const commentBeforeTextNode = doc2.createComment(textNodeId);
+      insertBefore(parentNode, commentBeforeTextNode, childElm);
+    }
+  } else if (childElm.nodeType === 8 /* CommentNode */) {
+    if (childElm["s-sr"]) {
+      const slotName = childElm["s-sn"] || "";
+      const slotNodeId = `${SLOT_NODE_ID}.${childId}.${slotName}`;
+      childElm.nodeValue = slotNodeId;
+    }
+  }
+  if (vnodeChild.$children$ != null) {
+    const childDepth = depth + 1;
+    vnodeChild.$children$.forEach((vnode, index2) => {
+      insertChildVNodeAnnotations(doc2, vnode, cmpData, hostId, childDepth, index2);
+    });
+  }
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Build,