Ported Keyed algo tests from Kivi + added more tests

BuloZB · Nov 13, 2016 · 8981471 · 8981471
1 parent 2ef9bad
commit 8981471
Show file tree

Hide file tree

Showing 7 changed files with 415 additions and 25 deletions.
diff --git a/packages/inferno/dist/inferno-compat.js b/packages/inferno/dist/inferno-compat.js
@@ -780,11 +780,9 @@ function processElement(flags, vNode, dom) {
     }
 }
 
-// import {
-// 	getIncrementalId,
-// 	componentIdMap
-// } from './devtools';
 function patch(lastVNode, nextVNode, parentDom, lifecycle, context, isSVG) {
+    // TODO: Our nodes are not immutable and hoisted nodes get cloned. Is there any possibility to make this check true
+    // TODO: Remove check or write test case to verify this behavior
     if (lastVNode !== nextVNode) {
         var lastFlags = lastVNode.flags;
         var nextFlags = nextVNode.flags;
@@ -1112,9 +1110,7 @@ function patchKeyedChildren(a, b, dom, lifecycle, context, isSVG) {
         return;
     }
     else if (bLength === 0) {
-        if (aLength !== 0) {
-            removeAllChildren(dom, a, lifecycle, false);
-        }
+        removeAllChildren(dom, a, lifecycle, false);
         return;
     }
     // Step 1

diff --git a/packages/inferno/dist/inferno-compat.min.js b/packages/inferno/dist/inferno-compat.min.js
diff --git a/packages/inferno/dist/inferno.js b/packages/inferno/dist/inferno.js
@@ -634,11 +634,9 @@ function processElement(flags, vNode, dom) {
     }
 }
 
-// import {
-// 	getIncrementalId,
-// 	componentIdMap
-// } from './devtools';
 function patch(lastVNode, nextVNode, parentDom, lifecycle, context, isSVG) {
+    // TODO: Our nodes are not immutable and hoisted nodes get cloned. Is there any possibility to make this check true
+    // TODO: Remove check or write test case to verify this behavior
     if (lastVNode !== nextVNode) {
         var lastFlags = lastVNode.flags;
         var nextFlags = nextVNode.flags;
@@ -966,9 +964,7 @@ function patchKeyedChildren(a, b, dom, lifecycle, context, isSVG) {
         return;
     }
     else if (bLength === 0) {
-        if (aLength !== 0) {
-            removeAllChildren(dom, a, lifecycle, false);
-        }
+        removeAllChildren(dom, a, lifecycle, false);
         return;
     }
     // Step 1

diff --git a/packages/inferno/dist/inferno.min.js b/packages/inferno/dist/inferno.min.js
diff --git a/src/DOM/__tests__/children.spec.tsx b/src/DOM/__tests__/children.spec.tsx
@@ -1211,5 +1211,92 @@ describe('Children - (JSX)', () => {
 
 			expect(container.innerHTML).to.eql('<div><div>3</div><div>2</div><div>11</div></div>');
 		});
+
+		it('Should handle previous being empty array', () => {
+			const CollectionKeyed = ({children}) => (
+				<div hasKeyedChildren>
+					{children}
+				</div>
+			);
+
+			const child = [];
+			render(
+				<CollectionKeyed>
+					{child}
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div></div>');
+
+			render(
+				<CollectionKeyed>
+					<div key="1">1</div>
+					<div key="2">2</div>
+					<div key="3">3</div>
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div><div>1</div><div>2</div><div>3</div></div>');
+		});
+
+		it('Should handle next being empty array', () => {
+			const CollectionKeyed = ({children}) => (
+				<div hasKeyedChildren>
+					{children}
+				</div>
+			);
+
+			render(
+				<CollectionKeyed>
+					<div key="1">1</div>
+					<div key="2">2</div>
+					<div key="3">3</div>
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div><div>1</div><div>2</div><div>3</div></div>');
+
+			const child = [];
+			render(
+				<CollectionKeyed>
+					{child}
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div></div>');
+		});
+
+		it('Should handle last/next being empty', () => {
+			const CollectionKeyed = ({children}) => (
+				<div hasKeyedChildren>
+					{children}
+				</div>
+			);
+
+			const child = [];
+			render(
+				<CollectionKeyed>
+					{child}
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div></div>');
+
+			const childB = [];
+
+			render(
+				<CollectionKeyed>
+					{childB}
+				</CollectionKeyed>
+				,container
+			);
+
+			expect(container.innerHTML).to.eql('<div></div>');
+		});
 	});
 });