solid-js 1.8.18 → 1.8.20

package/types/render/hydration.d.ts

@@ -15,6 +15,8 @@ type SharedConfig = {
   done?: boolean;
   count?: number;
   effects?: Computation<any, any>[];
+  getContextId(): string;
+  getNextContextId(): string;
 };
 export declare const sharedConfig: SharedConfig;
 export declare function setHydrateContext(context?: HydrationContext): void;

package/types/server/rendering.d.ts

@@ -22,6 +22,8 @@ export type ComponentProps<T extends ValidComponent> = T extends Component<infer
   : Record<string, unknown>;
 type SharedConfig = {
   context?: HydrationContext;
+  getContextId(): string;
+  getNextContextId(): string;
 };
 export declare const sharedConfig: SharedConfig;
 export declare function createUniqueId(): string;

package/web/dist/dev.cjs

@@ -125,7 +125,7 @@ function render(code, element, init, options = {}) {
 function template(html, isCE, isSVG) {
   let node;
   const create = () => {
-    if (solidJs.sharedConfig.context) throw new Error("Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.");
+    if (isHydrating()) throw new Error("Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.");
     const t = document.createElement("template");
     t.innerHTML = html;
     return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
@@ -151,19 +151,19 @@ function clearDelegatedEvents(document = window.document) {
   }
 }
 function setProperty(node, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   node[name] = value;
 }
 function setAttribute(node, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute(name);else node.setAttribute(name, value);
 }
 function setAttributeNS(node, namespace, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttributeNS(namespace, name);else node.setAttributeNS(namespace, name, value);
 }
 function className(node, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute("class");else node.className = value;
 }
 function addEventListener(node, name, handler, delegate) {
@@ -222,7 +222,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
   if (!skipChildren) {
     solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
   }
-  solidJs.createRenderEffect(() => typeof props.ref === "function" ? use(props.ref, node) : props.ref = node);
+  solidJs.createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node));
   solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -266,21 +266,26 @@ function hydrate$1(code, element, options = {}) {
   solidJs.sharedConfig.events = globalThis._$HY.events;
   solidJs.sharedConfig.load = id => globalThis._$HY.r[id];
   solidJs.sharedConfig.has = id => id in globalThis._$HY.r;
+  solidJs.sharedConfig.done = globalThis._$HY.done;
   solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
   solidJs.sharedConfig.registry = new Map();
   solidJs.sharedConfig.context = {
     id: options.renderId || "",
     count: 0
   };
-  gatherHydratable(element, options.renderId);
-  const dispose = render(code, element, [...element.childNodes], options);
-  solidJs.sharedConfig.context = null;
-  return dispose;
+  try {
+    gatherHydratable(element, options.renderId);
+    return render(code, element, [...element.childNodes], options);
+  } finally {
+    solidJs.sharedConfig.context = null;
+  }
 }
 function getNextElement(template) {
-  let node, key;
-  if (!solidJs.sharedConfig.context || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
-    if (solidJs.sharedConfig.context) throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}`);
+  let node,
+    key,
+    hydrating = isHydrating();
+  if (!hydrating || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
+    if (hydrating) throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}`);
     return template();
   }
   if (solidJs.sharedConfig.completed) solidJs.sharedConfig.completed.add(node);
@@ -295,7 +300,7 @@ function getNextMarker(start) {
   let end = start,
     count = 0,
     current = [];
-  if (solidJs.sharedConfig.context) {
+  if (isHydrating(start)) {
     while (end) {
       if (end.nodeType === 8) {
         const v = end.nodeValue;
@@ -321,13 +326,20 @@ function runHydrationEvents() {
       while (events.length) {
         const [el, e] = events[0];
         if (!completed.has(el)) return;
-        eventHandler(e);
         events.shift();
+        eventHandler(e);
+      }
+      if (solidJs.sharedConfig.done) {
+        solidJs.sharedConfig.events = _$HY.events = null;
+        solidJs.sharedConfig.completed = _$HY.completed = null;
       }
     });
     solidJs.sharedConfig.events.queued = true;
   }
 }
+function isHydrating(node) {
+  return !!solidJs.sharedConfig.context && !solidJs.sharedConfig.done && (!node || node.isConnected);
+}
 function toPropertyName(name) {
   return name.toLowerCase().replace(/-([a-z])/g, (_, w) => w.toUpperCase());
 }
@@ -367,7 +379,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
     if (forceProp) {
       prop = prop.slice(5);
       isProp = true;
-    } else if (!!solidJs.sharedConfig.context && node.isConnected) return value;
+    } else if (isHydrating(node)) return value;
     if (prop === "class" || prop === "className") className(node, value);else if (isCE && !isProp && !isChildProp) node[toPropertyName(prop)] = value;else node[propAlias || prop] = value;
   } else {
     const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
@@ -376,6 +388,9 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   return value;
 }
 function eventHandler(e) {
+  if (solidJs.sharedConfig.registry && solidJs.sharedConfig.events) {
+    if (solidJs.sharedConfig.events.find(([el, ev]) => ev === e)) return;
+  }
   const key = `$$${e.type}`;
   let node = e.composedPath && e.composedPath()[0] || e.target;
   if (e.target !== node) {
@@ -402,7 +417,7 @@ function eventHandler(e) {
   }
 }
 function insertExpression(parent, value, current, marker, unwrapArray) {
-  const hydrating = !!solidJs.sharedConfig.context && parent.isConnected;
+  const hydrating = isHydrating(parent);
   if (hydrating) {
     !current && (current = [...parent.childNodes]);
     let cleaned = [];
@@ -453,9 +468,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
     }
     if (hydrating) {
       if (!array.length) return current;
-      if (marker === undefined) return [...parent.childNodes];
+      if (marker === undefined) return current = [...parent.childNodes];
       let node = array[0];
-      let nodes = [node];
+      if (node.parentNode !== parent) return current;
+      const nodes = [node];
       while ((node = node.nextSibling) !== marker) nodes.push(node);
       return current = nodes;
     }
@@ -535,8 +551,7 @@ function gatherHydratable(element, root) {
   }
 }
 function getHydrationKey() {
-  const hydrate = solidJs.sharedConfig.context;
-  return `${hydrate.id}${hydrate.count++}`;
+  return solidJs.sharedConfig.getNextContextId();
 }
 function NoHydration(props) {
   return solidJs.sharedConfig.context ? undefined : props.children;

package/web/dist/dev.js

@@ -1,8 +1,8 @@
 import {
   createRoot,
-  sharedConfig,
   createRenderEffect,
   untrack,
+  sharedConfig,
   enableHydration,
   getOwner,
   createEffect,
@@ -574,7 +574,7 @@ function render(code, element, init, options = {}) {
 function template(html, isCE, isSVG) {
   let node;
   const create = () => {
-    if (sharedConfig.context)
+    if (isHydrating())
       throw new Error(
         "Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration."
       );
@@ -605,21 +605,21 @@ function clearDelegatedEvents(document = window.document) {
   }
 }
 function setProperty(node, name, value) {
-  if (!!sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   node[name] = value;
 }
 function setAttribute(node, name, value) {
-  if (!!sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute(name);
   else node.setAttribute(name, value);
 }
 function setAttributeNS(node, namespace, name, value) {
-  if (!!sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttributeNS(namespace, name);
   else node.setAttributeNS(namespace, name, value);
 }
 function className(node, value) {
-  if (!!sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute("class");
   else node.className = value;
 }
@@ -681,9 +681,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
       () => (prevProps.children = insertExpression(node, props.children, prevProps.children))
     );
   }
-  createRenderEffect(() =>
-    typeof props.ref === "function" ? use(props.ref, node) : (props.ref = node)
-  );
+  createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node));
   createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -727,21 +725,26 @@ function hydrate$1(code, element, options = {}) {
   sharedConfig.events = globalThis._$HY.events;
   sharedConfig.load = id => globalThis._$HY.r[id];
   sharedConfig.has = id => id in globalThis._$HY.r;
+  sharedConfig.done = globalThis._$HY.done;
   sharedConfig.gather = root => gatherHydratable(element, root);
   sharedConfig.registry = new Map();
   sharedConfig.context = {
     id: options.renderId || "",
     count: 0
   };
-  gatherHydratable(element, options.renderId);
-  const dispose = render(code, element, [...element.childNodes], options);
-  sharedConfig.context = null;
-  return dispose;
+  try {
+    gatherHydratable(element, options.renderId);
+    return render(code, element, [...element.childNodes], options);
+  } finally {
+    sharedConfig.context = null;
+  }
 }
 function getNextElement(template) {
-  let node, key;
-  if (!sharedConfig.context || !(node = sharedConfig.registry.get((key = getHydrationKey())))) {
-    if (sharedConfig.context)
+  let node,
+    key,
+    hydrating = isHydrating();
+  if (!hydrating || !(node = sharedConfig.registry.get((key = getHydrationKey())))) {
+    if (hydrating)
       throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}`);
     return template();
   }
@@ -757,7 +760,7 @@ function getNextMarker(start) {
   let end = start,
     count = 0,
     current = [];
-  if (sharedConfig.context) {
+  if (isHydrating(start)) {
     while (end) {
       if (end.nodeType === 8) {
         const v = end.nodeValue;
@@ -781,13 +784,20 @@ function runHydrationEvents() {
       while (events.length) {
         const [el, e] = events[0];
         if (!completed.has(el)) return;
-        eventHandler(e);
         events.shift();
+        eventHandler(e);
+      }
+      if (sharedConfig.done) {
+        sharedConfig.events = _$HY.events = null;
+        sharedConfig.completed = _$HY.completed = null;
       }
     });
     sharedConfig.events.queued = true;
   }
 }
+function isHydrating(node) {
+  return !!sharedConfig.context && !sharedConfig.done && (!node || node.isConnected);
+}
 function toPropertyName(name) {
   return name.toLowerCase().replace(/-([a-z])/g, (_, w) => w.toUpperCase());
 }
@@ -834,7 +844,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
     if (forceProp) {
       prop = prop.slice(5);
       isProp = true;
-    } else if (!!sharedConfig.context && node.isConnected) return value;
+    } else if (isHydrating(node)) return value;
     if (prop === "class" || prop === "className") className(node, value);
     else if (isCE && !isProp && !isChildProp) node[toPropertyName(prop)] = value;
     else node[propAlias || prop] = value;
@@ -846,6 +856,9 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   return value;
 }
 function eventHandler(e) {
+  if (sharedConfig.registry && sharedConfig.events) {
+    if (sharedConfig.events.find(([el, ev]) => ev === e)) return;
+  }
   const key = `$$${e.type}`;
   let node = (e.composedPath && e.composedPath()[0]) || e.target;
   if (e.target !== node) {
@@ -872,7 +885,7 @@ function eventHandler(e) {
   }
 }
 function insertExpression(parent, value, current, marker, unwrapArray) {
-  const hydrating = !!sharedConfig.context && parent.isConnected;
+  const hydrating = isHydrating(parent);
   if (hydrating) {
     !current && (current = [...parent.childNodes]);
     let cleaned = [];
@@ -924,9 +937,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
     }
     if (hydrating) {
       if (!array.length) return current;
-      if (marker === undefined) return [...parent.childNodes];
+      if (marker === undefined) return (current = [...parent.childNodes]);
       let node = array[0];
-      let nodes = [node];
+      if (node.parentNode !== parent) return current;
+      const nodes = [node];
       while ((node = node.nextSibling) !== marker) nodes.push(node);
       return (current = nodes);
     }
@@ -1016,8 +1030,7 @@ function gatherHydratable(element, root) {
   }
 }
 function getHydrationKey() {
-  const hydrate = sharedConfig.context;
-  return `${hydrate.id}${hydrate.count++}`;
+  return sharedConfig.getNextContextId();
 }
 function NoHydration(props) {
   return sharedConfig.context ? undefined : props.children;

package/web/dist/server.cjs

@@ -400,7 +400,7 @@ function ssrAttribute(key, value, isBoolean) {
 }
 function ssrHydrationKey() {
   const hk = getHydrationKey();
-  return hk ? ` data-hk="${hk}"` : "";
+  return hk ? ` data-hk=${hk}` : "";
 }
 function escape(s, attr) {
   const t = typeof s;
@@ -467,7 +467,7 @@ function resolveSSRNode(node, top) {
 }
 function getHydrationKey() {
   const hydrate = solidJs.sharedConfig.context;
-  return hydrate && !hydrate.noHydrate && `${hydrate.id}${hydrate.count++}`;
+  return hydrate && !hydrate.noHydrate && solidJs.sharedConfig.getNextContextId();
 }
 function useAssets(fn) {
   solidJs.sharedConfig.context.assets.push(() => resolveSSRNode(fn()));
@@ -482,7 +482,7 @@ function generateHydrationScript({
   eventNames = ["click", "input"],
   nonce
 } = {}) {
-  return `<script${nonce ? ` nonce="${nonce}"` : ""}>window._$HY||(e=>{let t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host.nodeType?e.host:e.parentNode));["${eventNames.join('", "')}"].forEach((o=>document.addEventListener(o,(o=>{let a=o.composedPath&&o.composedPath()[0]||o.target,s=t(a);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
+  return `<script${nonce ? ` nonce="${nonce}"` : ""}>window._$HY||(e=>{let t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host.nodeType?e.host:e.parentNode));["${eventNames.join('", "')}"].forEach((o=>document.addEventListener(o,(o=>{if(!e.events)return;let s=t(o.composedPath&&o.composedPath()[0]||o.target);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
 }
 function Hydration(props) {
   if (!solidJs.sharedConfig.context.noHydrate) return props.children;
@@ -490,7 +490,7 @@ function Hydration(props) {
   solidJs.sharedConfig.context = {
     ...context,
     count: 0,
-    id: `${context.id}${context.count++}-`,
+    id: solidJs.sharedConfig.getNextContextId(),
     noHydrate: false
   };
   const res = props.children;

package/web/dist/server.js

@@ -465,7 +465,7 @@ function ssrAttribute(key, value, isBoolean) {
 }
 function ssrHydrationKey() {
   const hk = getHydrationKey();
-  return hk ? ` data-hk="${hk}"` : "";
+  return hk ? ` data-hk=${hk}` : "";
 }
 function escape(s, attr) {
   const t = typeof s;
@@ -533,7 +533,7 @@ function resolveSSRNode(node, top) {
 }
 function getHydrationKey() {
   const hydrate = sharedConfig.context;
-  return hydrate && !hydrate.noHydrate && `${hydrate.id}${hydrate.count++}`;
+  return hydrate && !hydrate.noHydrate && sharedConfig.getNextContextId();
 }
 function useAssets(fn) {
   sharedConfig.context.assets.push(() => resolveSSRNode(fn()));
@@ -549,7 +549,7 @@ function generateHydrationScript({ eventNames = ["click", "input"], nonce } = {}
     nonce ? ` nonce="${nonce}"` : ""
   }>window._$HY||(e=>{let t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host.nodeType?e.host:e.parentNode));["${eventNames.join(
     '", "'
-  )}"].forEach((o=>document.addEventListener(o,(o=>{let a=o.composedPath&&o.composedPath()[0]||o.target,s=t(a);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
+  )}"].forEach((o=>document.addEventListener(o,(o=>{if(!e.events)return;let s=t(o.composedPath&&o.composedPath()[0]||o.target);s&&!e.completed.has(s)&&e.events.push([s,o])}))))})(_$HY={events:[],completed:new WeakSet,r:{},fe(){}});</script><!--xs-->`;
 }
 function Hydration(props) {
   if (!sharedConfig.context.noHydrate) return props.children;
@@ -557,7 +557,7 @@ function Hydration(props) {
   sharedConfig.context = {
     ...context,
     count: 0,
-    id: `${context.id}${context.count++}-`,
+    id: sharedConfig.getNextContextId(),
     noHydrate: false
   };
   const res = props.children;

package/web/dist/web.cjs

@@ -147,19 +147,19 @@ function clearDelegatedEvents(document = window.document) {
   }
 }
 function setProperty(node, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   node[name] = value;
 }
 function setAttribute(node, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute(name);else node.setAttribute(name, value);
 }
 function setAttributeNS(node, namespace, name, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttributeNS(namespace, name);else node.setAttributeNS(namespace, name, value);
 }
 function className(node, value) {
-  if (!!solidJs.sharedConfig.context && node.isConnected) return;
+  if (isHydrating(node)) return;
   if (value == null) node.removeAttribute("class");else node.className = value;
 }
 function addEventListener(node, name, handler, delegate) {
@@ -218,7 +218,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
   if (!skipChildren) {
     solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
   }
-  solidJs.createRenderEffect(() => typeof props.ref === "function" ? use(props.ref, node) : props.ref = node);
+  solidJs.createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node));
   solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -262,20 +262,25 @@ function hydrate$1(code, element, options = {}) {
   solidJs.sharedConfig.events = globalThis._$HY.events;
   solidJs.sharedConfig.load = id => globalThis._$HY.r[id];
   solidJs.sharedConfig.has = id => id in globalThis._$HY.r;
+  solidJs.sharedConfig.done = globalThis._$HY.done;
   solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
   solidJs.sharedConfig.registry = new Map();
   solidJs.sharedConfig.context = {
     id: options.renderId || "",
     count: 0
   };
-  gatherHydratable(element, options.renderId);
-  const dispose = render(code, element, [...element.childNodes], options);
-  solidJs.sharedConfig.context = null;
-  return dispose;
+  try {
+    gatherHydratable(element, options.renderId);
+    return render(code, element, [...element.childNodes], options);
+  } finally {
+    solidJs.sharedConfig.context = null;
+  }
 }
 function getNextElement(template) {
-  let node, key;
-  if (!solidJs.sharedConfig.context || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
+  let node,
+    key,
+    hydrating = isHydrating();
+  if (!hydrating || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
     return template();
   }
   if (solidJs.sharedConfig.completed) solidJs.sharedConfig.completed.add(node);
@@ -290,7 +295,7 @@ function getNextMarker(start) {
   let end = start,
     count = 0,
     current = [];
-  if (solidJs.sharedConfig.context) {
+  if (isHydrating(start)) {
     while (end) {
       if (end.nodeType === 8) {
         const v = end.nodeValue;
@@ -316,13 +321,20 @@ function runHydrationEvents() {
       while (events.length) {
         const [el, e] = events[0];
         if (!completed.has(el)) return;
-        eventHandler(e);
         events.shift();
+        eventHandler(e);
+      }
+      if (solidJs.sharedConfig.done) {
+        solidJs.sharedConfig.events = _$HY.events = null;
+        solidJs.sharedConfig.completed = _$HY.completed = null;
       }
     });
     solidJs.sharedConfig.events.queued = true;
   }
 }
+function isHydrating(node) {
+  return !!solidJs.sharedConfig.context && !solidJs.sharedConfig.done && (!node || node.isConnected);
+}
 function toPropertyName(name) {
   return name.toLowerCase().replace(/-([a-z])/g, (_, w) => w.toUpperCase());
 }
@@ -362,7 +374,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
     if (forceProp) {
       prop = prop.slice(5);
       isProp = true;
-    } else if (!!solidJs.sharedConfig.context && node.isConnected) return value;
+    } else if (isHydrating(node)) return value;
     if (prop === "class" || prop === "className") className(node, value);else if (isCE && !isProp && !isChildProp) node[toPropertyName(prop)] = value;else node[propAlias || prop] = value;
   } else {
     const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
@@ -371,6 +383,9 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   return value;
 }
 function eventHandler(e) {
+  if (solidJs.sharedConfig.registry && solidJs.sharedConfig.events) {
+    if (solidJs.sharedConfig.events.find(([el, ev]) => ev === e)) return;
+  }
   const key = `$$${e.type}`;
   let node = e.composedPath && e.composedPath()[0] || e.target;
   if (e.target !== node) {
@@ -397,7 +412,7 @@ function eventHandler(e) {
   }
 }
 function insertExpression(parent, value, current, marker, unwrapArray) {
-  const hydrating = !!solidJs.sharedConfig.context && parent.isConnected;
+  const hydrating = isHydrating(parent);
   if (hydrating) {
     !current && (current = [...parent.childNodes]);
     let cleaned = [];
@@ -448,9 +463,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
     }
     if (hydrating) {
       if (!array.length) return current;
-      if (marker === undefined) return [...parent.childNodes];
+      if (marker === undefined) return current = [...parent.childNodes];
       let node = array[0];
-      let nodes = [node];
+      if (node.parentNode !== parent) return current;
+      const nodes = [node];
       while ((node = node.nextSibling) !== marker) nodes.push(node);
       return current = nodes;
     }
@@ -530,8 +546,7 @@ function gatherHydratable(element, root) {
   }
 }
 function getHydrationKey() {
-  const hydrate = solidJs.sharedConfig.context;
-  return `${hydrate.id}${hydrate.count++}`;
+  return solidJs.sharedConfig.getNextContextId();
 }
 function NoHydration(props) {
   return solidJs.sharedConfig.context ? undefined : props.children;