Merge 1f88e72 into 8f679f0

mangle.json

@@ -27,7 +27,7 @@
       "$_children": "__k",
       "$_suspensions": "__u",
       "$_dom": "__e",
-      "$_hydrateDom": "__s",
+      "$_hydrating": "__h",
       "$_component": "__c",
       "$__html": "__html",
       "$_parent": "__",

src/component.js

@@ -126,9 +126,10 @@ function renderComponent(component) {
 			assign({}, vnode),
 			component._context,
 			parentDom.ownerSVGElement !== undefined,
-			null,
+			vnode._hydrating ? [oldDom] : null,
 			commitQueue,
-			oldDom == null ? getDomSibling(vnode) : oldDom
+			oldDom == null ? getDomSibling(vnode) : oldDom,
+			vnode._hydrating
 		);
 		commitRoot(commitQueue, vnode);
 

src/create-element.js

@@ -70,7 +70,7 @@ export function createVNode(type, props, key, ref) {
 		_dom: null,
 		_lastDomChild: null,
 		_component: null,
-		_hydrateDom: null,
+		_hydrating: null,
 		constructor: undefined
 	};
 

src/diff/catch-error.js

@@ -1,4 +1,4 @@
-import { enqueueRender } from '../component';
+// import { enqueueRender } from '../component';
 
 /**
  * Find the closest error boundary to a thrown error and call it
@@ -10,6 +10,7 @@ import { enqueueRender } from '../component';
 export function _catchError(error, vnode) {
 	/** @type {import('../internal').Component} */
 	let component, hasCaught;
+	const wasHydrating = vnode._hydrating;
 
 	for (; (vnode = vnode._parent); ) {
 		if ((component = vnode._component) && !component._processingException) {
@@ -29,8 +30,13 @@ export function _catchError(error, vnode) {
 					component.componentDidCatch(error);
 				}
 
-				if (hasCaught)
-					return enqueueRender((component._pendingError = component));
+				if (hasCaught) {
+					component._pendingError = component;
+					vnode._hydrating = wasHydrating;
+					// NOTE: can we avoid auto-rendering here?
+					//return enqueueRender(component);
+					return;
+				}
 			} catch (e) {
 				error = e;
 			}

src/diff/children.js

@@ -124,7 +124,10 @@ export function diffChildren(
 					}
 
 					if (excessDomChildren != null) {
-						excessDomChildren[excessDomChildren.indexOf(newDom)] = null;
+						j = excessDomChildren.indexOf(newDom);
+						if (j !== -1) {
+							excessDomChildren[j] = null;
+						}
 					}
 
 					if (childVNode._lastDomChild != null) {

src/diff/index.js

@@ -40,14 +40,6 @@ export function diff(
 	// constructor as undefined. This to prevent JSON-injection.
 	if (newVNode.constructor !== undefined) return null;
 
-	// If this was the innermost VNode at a point where the tree suspended,
-	// pick up diffing where we left off using the saved DOM element and hydration state.
-	if (oldVNode._hydrateDom && excessDomChildren == null) {
-		newVNode._dom = oldDom = oldVNode._hydrateDom;
-		excessDomChildren = [oldDom];
-		oldVNode._hydrateDom = null;
-	}
-
 	if ((tmp = options._diff)) tmp(newVNode);
 
 	try {
@@ -223,11 +215,8 @@ export function diff(
 
 		if ((tmp = options.diffed)) tmp(newVNode);
 	} catch (e) {
-		if (isHydrating) {
-			// Before bailing out, mark the current VNode with the DOM element and hydration state.
-			// We can use this information if we return here to render later on.
-			oldVNode._hydrateDom = newVNode._dom = oldDom;
-		}
+		newVNode._dom = oldDom; // is this needed?
+		newVNode._hydrating = !!isHydrating;
 		options._catchError(e, newVNode, oldVNode);
 	}
 

src/internal.d.ts

@@ -30,10 +30,10 @@ export type ComponentFactory<P> =
 	| preact.ComponentClass<P>
 	| FunctionalComponent<P>;
 
-export interface PreactElement extends HTMLElement {
+export interface PreactElement extends Partial<HTMLElement>, Partial<Text> {
 	_children?: VNode<any> | null;
 	/** Event listeners to support event delegation */
-	_listeners: Record<string, (e: Event) => void>;
+	_listeners?: Record<string, (e: Event) => void>;
 
 	// Preact uses this attribute to detect SVG nodes
 	ownerSVGElement?: SVGElement | null;
@@ -53,11 +53,15 @@ export interface VNode<P = {}> extends preact.VNode<P> {
 	/**
 	 * The [first (for Fragments)] DOM child of a VNode
 	 */
-	_dom: PreactElement | Text | null;
+	_dom: PreactElement | null;
 	/**
 	 * The last dom child of a Fragment, or components that return a Fragment
 	 */
-	_lastDomChild: PreactElement | Text | null;
+	_lastDomChild: PreactElement | null;
+	/**
+	 * Indicates whether the VNode at the root of a suspended tree was suspended during hydration, or an update.
+	 */
+	_hydrating: boolean;
 	_component: Component | null;
 	constructor: undefined;
 }