Bugfix with fragments

adrianhelvik · Nov 6, 2019 · fe57919 · fe57919
1 parent 6d0741b
commit fe57919
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 10 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@adrianhelvik/fragdom",
-  "version": "2.1.11",
+  "version": "2.1.12",
   "main": "dist/index.js",
   "module": "src/index.js",
   "license": "MIT",

diff --git a/src/Element.js b/src/Element.js
@@ -125,15 +125,13 @@ class Element extends Node {
       }
     }
 
-    let completeAt = this.childNodes.length
     let index = 0
 
     for (let i = 0; i < this.childNodes.length; i++) {
       this.childNodes[i].reconcile(true)
       const child = this.childNodes[i].realNode
 
       if (Array.isArray(child)) {
-        completeAt += child.length
         for (const c of child) {
           if (realNode.childNodes[index] !== c) {
             if (realNode.childNodes[index]) {
@@ -156,11 +154,7 @@ class Element extends Node {
       }
     }
 
-    for (
-      let i = realNode.childNodes.length - 1;
-      i >= 0 && i >= completeAt;
-      i--
-    ) {
+    for (let i = realNode.childNodes.length - 1; i >= 0 && i >= index; i--) {
       realNode.removeChild(realNode.childNodes[i])
     }
 

diff --git a/src/spec.js b/src/spec.js
@@ -82,7 +82,7 @@ test('another bugfix', () => {
   expect(root.realNode.innerHTML).toBe('<a><b></b></a>')
 })
 
-test('bugfix adjacent fragments', () => {
+test('bugfix: adjacent fragments', () => {
   const root = <div />
 
   root.appendChild(
@@ -110,7 +110,7 @@ test('bugfix adjacent fragments', () => {
   expect(root.realNode.innerHTML).toBe('Hello123')
 })
 
-test('bugfix fragment with element with text not updating', () => {
+test('bugfix: fragment with element with text not updating', () => {
   const root = <div />
 
   root.reconcile()
@@ -132,3 +132,16 @@ test('bugfix fragment with element with text not updating', () => {
 
   expect(root.realNode.innerHTML).toBe('<div>Hi "b"</div>')
 })
+
+test('bugfix: replace text node with empty fragment', () => {
+  const root = <div>Hello</div>
+  root.reconcile()
+  root.replaceChild(<></>, root.childNodes[0])
+  root.reconcile()
+  expect(root.debug().split('\n')).toEqual([
+    '<div>' /********************************/,
+    '  <></>',
+    '</div>',
+  ])
+  expect(root.realNode.outerHTML).toBe('<div></div>')
+})