From 3e85030c41eddd15e44a57af2b3d563e2352cbdb Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 12:59:43 +0100
Subject: [PATCH 01/12] chore: add reconcile bug test

---
 test/browser/render.test.js | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index 3be0393a20..4f34829963 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1356,4 +1356,29 @@ describe('render()', () => {
 		rerender();
 		expect(scratch.innerHTML).to.equal('<div><div></div><div>B</div></div>');
 	});
+
+	it.only('should reconcile chidlren in right order', () => {
+		let data = ['A', 'B', 'C', 'D', 'E'];
+		render(
+			<ul>
+				{data.map(d => (
+					<li key={d}>{d}</li>
+				))}
+			</ul>,
+			scratch
+		);
+
+		expect(scratch.textContent).to.equal('ABCDE');
+
+		data = ['B', 'E', 'C', 'D'];
+		render(
+			<ul>
+				{data.map(d => (
+					<li key={d}>{d}</li>
+				))}
+			</ul>,
+			scratch
+		);
+		expect(scratch.textContent).to.equal('BECD');
+	});
 });

From 72235daeb1eae4cee74ace2e2b17931691abb1a2 Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 13:01:48 +0100
Subject: [PATCH 02/12] chore: remove test focus

---
 test/browser/render.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index 4f34829963..5bab6d66c0 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1357,7 +1357,7 @@ describe('render()', () => {
 		expect(scratch.innerHTML).to.equal('<div><div></div><div>B</div></div>');
 	});
 
-	it.only('should reconcile chidlren in right order', () => {
+	it('should reconcile chidlren in right order', () => {
 		let data = ['A', 'B', 'C', 'D', 'E'];
 		render(
 			<ul>

From fc95ec8e4f07c4dfa54628cd1fb39ca973ad1d8b Mon Sep 17 00:00:00 2001
From: jdecroock <decroockjovi@gmail.com>
Date: Wed, 21 Feb 2024 17:26:45 +0100
Subject: [PATCH 03/12] add fix

---
 src/diff/children.js | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/diff/children.js b/src/diff/children.js
index 71879d3166..bbdbdf624f 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -299,10 +299,7 @@ function constructNewChildrenArray(newParentVNode, renderResult, oldChildren) {
 			if (matchingIndex === skewedIndex + 1) {
 				skew++;
 			} else if (matchingIndex > skewedIndex) {
-				if (remainingOldChildren > newChildrenLength - skewedIndex) {
-					skew += matchingIndex - skewedIndex;
-				} else {
-					// ### Change from keyed: I think this was missing from the algo...
+				if (remainingOldChildren <= newChildrenLength - skewedIndex) {
 					skew--;
 				}
 			} else if (matchingIndex < skewedIndex) {

From 6b1ae4a544e63ab76b10afa5777973b800c55fa1 Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 18:30:58 +0100
Subject: [PATCH 04/12] chore: fix typo in test name

---
 test/browser/render.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index 5bab6d66c0..e094db690f 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1357,7 +1357,7 @@ describe('render()', () => {
 		expect(scratch.innerHTML).to.equal('<div><div></div><div>B</div></div>');
 	});
 
-	it('should reconcile chidlren in right order', () => {
+	it('should reconcile children in right order', () => {
 		let data = ['A', 'B', 'C', 'D', 'E'];
 		render(
 			<ul>

From a8c1ee63ad4f59dd84916d37d30523538c725b0f Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 18:39:02 +0100
Subject: [PATCH 05/12] chore: add another test case

---
 test/browser/render.test.js | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index e094db690f..ec54d475f6 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1381,4 +1381,29 @@ describe('render()', () => {
 		);
 		expect(scratch.textContent).to.equal('BECD');
 	});
+
+	it('should reconcile children in right order #2', () => {
+		let data = ['A', 'B', 'C', 'D', 'E'];
+		render(
+			<ul>
+				{data.map(d => (
+					<li key={d}>{d}</li>
+				))}
+			</ul>,
+			scratch
+		);
+
+		expect(scratch.textContent).to.equal('ABCDE');
+
+		data = ['B', 'E', 'D', 'C'];
+		render(
+			<ul>
+				{data.map(d => (
+					<li key={d}>{d}</li>
+				))}
+			</ul>,
+			scratch
+		);
+		expect(scratch.textContent).to.equal('BEDC');
+	});
 });

From 474d00e3d1d0054879c12e93790f665219be30c0 Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 20:18:59 +0100
Subject: [PATCH 06/12] chore: add another testcase

---
 test/browser/render.test.js | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index ec54d475f6..7116f95bd4 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1406,4 +1406,36 @@ describe('render()', () => {
 		);
 		expect(scratch.textContent).to.equal('BEDC');
 	});
+
+	it('should reconcile children in right order #3', () => {
+		render(
+			<div>
+				<p>_A1</p>
+				<p>_A2</p>
+				<h2>_A3</h2>
+				<p>_A4</p>
+				<h2>_A5</h2>
+				<p>_A6</p>
+				<h2>_A7</h2>
+				<p>_A8</p>
+			</div>,
+			scratch
+		);
+
+		render(
+			<div>
+				<p>_B1</p>
+				<p>_B2</p>
+				<p>_B3</p>
+				<h2>_B4</h2>
+				<p>_B5</p>
+				<p>_B6</p>
+				<h2>_B7</h2>
+				<p>_B8</p>
+			</div>,
+			scratch
+		);
+
+		expect(scratch.textContent).to.equal('_B1_B2_B3_B4_B5_B6_B7_B8');
+	});
 });

From 8cc2d878bd3afda34150c9f5d6c74ca8f211b6f7 Mon Sep 17 00:00:00 2001
From: jdecroock <decroockjovi@gmail.com>
Date: Wed, 21 Feb 2024 20:26:34 +0100
Subject: [PATCH 07/12] push fix

---
 src/diff/children.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/diff/children.js b/src/diff/children.js
index bbdbdf624f..4fee67ad85 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -305,8 +305,6 @@ function constructNewChildrenArray(newParentVNode, renderResult, oldChildren) {
 			} else if (matchingIndex < skewedIndex) {
 				if (matchingIndex == skewedIndex - 1) {
 					skew = matchingIndex - skewedIndex;
-				} else {
-					skew = 0;
 				}
 			} else {
 				skew = 0;

From cf7a22fc99ce7869489af88231fe233be4ca0fc6 Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 20:28:39 +0100
Subject: [PATCH 08/12] chore: update test assertion

---
 test/browser/render.test.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index 7116f95bd4..2b55674343 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1436,6 +1436,8 @@ describe('render()', () => {
 			scratch
 		);
 
-		expect(scratch.textContent).to.equal('_B1_B2_B3_B4_B5_B6_B7_B8');
+		expect(serializeHtml(scratch)).to.equal(
+			'<div><p>_B1</p><p>_B2</p><p>_B3</p><h2>_B4</h2><p>_B5</p><p>_B6</p><h2>_B7</h2><p>_B8</p></div>'
+		);
 	});
 });

From a600efa6327d79844c716c09a9a816718bfc75da Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 21:15:03 +0100
Subject: [PATCH 09/12] fix: invalid vnode id for text nodes

---
 src/diff/children.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/diff/children.js b/src/diff/children.js
index 4fee67ad85..639d254ddc 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -201,7 +201,7 @@ function constructNewChildrenArray(newParentVNode, renderResult, oldChildren) {
 				childVNode,
 				null,
 				null,
-				childVNode
+				null
 			);
 		} else if (isArray(childVNode)) {
 			childVNode = newParentVNode._children[i] = createVNode(

From b7b8d1652c39e3ce9768c81e04f64dadf9d57857 Mon Sep 17 00:00:00 2001
From: Marvin Hagemeister <hello@marvinh.dev>
Date: Wed, 21 Feb 2024 21:58:22 +0100
Subject: [PATCH 10/12] chore: add another test case

---
 test/browser/render.test.js | 43 +++++++++++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)

diff --git a/test/browser/render.test.js b/test/browser/render.test.js
index 2b55674343..8f5ed0e204 100644
--- a/test/browser/render.test.js
+++ b/test/browser/render.test.js
@@ -1440,4 +1440,47 @@ describe('render()', () => {
 			'<div><p>_B1</p><p>_B2</p><p>_B3</p><h2>_B4</h2><p>_B5</p><p>_B6</p><h2>_B7</h2><p>_B8</p></div>'
 		);
 	});
+
+	it('should reconcile children in right order #4', () => {
+		render(
+			<div>
+				<p>_A1</p>
+				<p>_A2</p>
+				<div>_A3</div>
+				<h2>_A4</h2>
+				<p>_A5</p>
+				<div>_A6</div>
+				<h2>_A7</h2>
+				<p>_A8</p>
+				<div>_A9</div>
+				<h2>_A10</h2>
+				<p>_A11</p>
+				<div>_A12</div>
+			</div>,
+			scratch
+		);
+
+		render(
+			<div>
+				<p>_B1</p>
+				<p>_B2</p>
+				<p>_B3</p>
+				<h2>_B4</h2>
+				<p>_B5</p>
+				<p>_B6</p>
+				<p>_B7</p>
+				<h2>_B8</h2>
+				<p>_B9</p>
+				<p>_B10</p>
+				<p>_B11</p>
+				<p>_B12</p>
+				<h2>_B13</h2>
+			</div>,
+			scratch
+		);
+
+		expect(serializeHtml(scratch)).to.equal(
+			'<div><p>_B1</p><p>_B2</p><p>_B3</p><h2>_B4</h2><p>_B5</p><p>_B6</p><p>_B7</p><h2>_B8</h2><p>_B9</p><p>_B10</p><p>_B11</p><p>_B12</p><h2>_B13</h2></div>'
+		);
+	});
 });

From aca34a0c64dcf6fc8424730e406c2c1d1c2cceb9 Mon Sep 17 00:00:00 2001
From: jdecroock <decroockjovi@gmail.com>
Date: Thu, 22 Feb 2024 08:54:06 +0100
Subject: [PATCH 11/12] fix it

---
 src/diff/children.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/diff/children.js b/src/diff/children.js
index cc450b435c..2c6c742798 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -424,7 +424,10 @@ function findMatchingIndex(
 
 	if (
 		oldVNode === null ||
-		(oldVNode && key == oldVNode.key && type === oldVNode.type)
+		(oldVNode &&
+			key == oldVNode.key &&
+			type === oldVNode.type &&
+			(oldVNode._flags & MATCHED) === 0)
 	) {
 		return skewedIndex;
 	} else if (shouldSearch) {

From 0435d0c9dbbc0adf2a8883d46354c2a989e02fff Mon Sep 17 00:00:00 2001
From: jdecroock <decroockjovi@gmail.com>
Date: Thu, 22 Feb 2024 09:01:44 +0100
Subject: [PATCH 12/12] see if adding this branch back affects perf

---
 src/diff/children.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/diff/children.js b/src/diff/children.js
index 2c6c742798..b44d5168e8 100644
--- a/src/diff/children.js
+++ b/src/diff/children.js
@@ -300,7 +300,9 @@ function constructNewChildrenArray(newParentVNode, renderResult, oldChildren) {
 			if (matchingIndex === skewedIndex + 1) {
 				skew++;
 			} else if (matchingIndex > skewedIndex) {
-				if (remainingOldChildren <= newChildrenLength - skewedIndex) {
+				if (remainingOldChildren > newChildrenLength - skewedIndex) {
+					skew += matchingIndex - skewedIndex;
+				} else {
 					skew--;
 				}
 			} else if (matchingIndex < skewedIndex) {