@reckona/mreact-compat 0.0.163 → 0.0.164

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reckona/mreact-compat",
-  "version": "0.0.163",
+  "version": "0.0.164",
   "description": "React-compatible runtime implementation for mreact.",
   "keywords": [
     "compatibility",
@@ -69,7 +69,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@reckona/mreact-shared": "0.0.163",
-    "@reckona/mreact-reactive-core": "0.0.163"
+    "@reckona/mreact-reactive-core": "0.0.164",
+    "@reckona/mreact-shared": "0.0.164"
   }
 }

package/src/dom-props.ts

@@ -283,6 +283,10 @@ export function applyPostChildFormProps(
   props: Record<string, unknown>,
   previousProps?: Record<string, unknown>,
 ): void {
+  if (!isPostChildFormElement(element)) {
+    return;
+  }
+
   if (element instanceof HTMLInputElement) {
     if (hasOwnProp(props, "checked")) {
       const checked = props.checked !== null && props.checked !== undefined && props.checked !== false;
@@ -322,6 +326,16 @@ export function applyPostChildFormProps(
   }
 }
 
+function isPostChildFormElement(
+  element: Element,
+): element is HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement {
+  return (
+    element instanceof HTMLInputElement ||
+    element instanceof HTMLTextAreaElement ||
+    element instanceof HTMLSelectElement
+  );
+}
+
 function postChildFormValue(
   props: Record<string, unknown>,
   previousProps: Record<string, unknown> | undefined,

package/src/fiber-child.ts

@@ -106,13 +106,17 @@ function reconcileSameKeyOrderChildren(
   }
 
   let cursor: Fiber | undefined = currentFirstChild;
+  let matchedCount = 0;
 
   for (const child of children) {
+    if (cursor === undefined) {
+      break;
+    }
+
     const key = getNodeKey(child);
 
     if (
       key === undefined ||
-      cursor === undefined ||
       cursor.key !== key ||
       !isReactCompatElement(child) ||
       !canReuseElementFiber(cursor, child)
@@ -121,9 +125,10 @@ function reconcileSameKeyOrderChildren(
     }
 
     cursor = cursor.sibling;
+    matchedCount += 1;
   }
 
-  if (cursor !== undefined) {
+  if (matchedCount === 0 || cursor !== undefined) {
     return undefined;
   }
 
@@ -131,9 +136,11 @@ function reconcileSameKeyOrderChildren(
   let first: Fiber | undefined;
   let previous: Fiber | undefined;
 
-  for (const child of children) {
+  for (let index = 0; index < children.length; index += 1) {
+    const child = children[index] as ReactCompatNode;
     const key = getNodeKey(child) as string;
-    const fiber = reconcileSingleChild(parent, cursor, child, key) as Fiber;
+    const matchedCurrent: Fiber | undefined = index < matchedCount ? cursor : undefined;
+    const fiber = reconcileSingleChild(parent, matchedCurrent, child, key) as Fiber;
 
     fiber.lanes |= parent.lanes;
     fiber.return = parent;
@@ -146,7 +153,7 @@ function reconcileSameKeyOrderChildren(
     }
 
     previous = fiber;
-    cursor = cursor?.sibling;
+    cursor = matchedCurrent?.sibling;
   }
 
   parent.child = first;

package/src/host-reconciler.ts

@@ -435,10 +435,7 @@ function reconcileKeyedRowHostChildren(
   let subtreeFlags = NoFlags;
   let subtreeChildListChanged = false;
   let hasRefSubtree = false;
-  const currentSiblingCount = countFiberSiblings(currentFirstChild);
-  const canReuseUnchangedRows =
-    currentSiblingCount === children.length ||
-    isKeyedAppendOnly(currentFirstChild, children, currentSiblingCount);
+  const canReuseUnchangedRows = hasSameKeyOrderPrefix(currentFirstChild, children);
   const row = createKeyedRowHostElementScratch();
 
   for (let index = 0; index < children.length; index += 1) {
@@ -514,33 +511,21 @@ function reconcileKeyedRowHostChildren(
   return { fiber: first, consumed: 0 };
 }
 
-function countFiberSiblings(first: Fiber): number {
-  let count = 0;
-  let cursor: Fiber | undefined = first;
-
-  while (cursor !== undefined) {
-    count += 1;
-    cursor = cursor.sibling;
-  }
-
-  return count;
-}
-
-function isKeyedAppendOnly(
+function hasSameKeyOrderPrefix(
   currentFirstChild: Fiber,
   children: readonly ReactCompatNode[],
-  currentSiblingCount: number,
 ): boolean {
-  if (children.length <= currentSiblingCount) {
-    return false;
-  }
-
   let current: Fiber | undefined = currentFirstChild;
 
-  for (let index = 0; index < currentSiblingCount; index += 1) {
-    if (current === undefined || current.key !== getNodeKey(children[index])) {
+  for (let index = 0; index < children.length; index += 1) {
+    if (current === undefined) {
+      return true;
+    }
+
+    if (current.key !== getNodeKey(children[index])) {
       return false;
     }
+
     current = current.sibling;
   }