Bugfix

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adrianhelvik/fragdom",
-  "version": "2.1.9",
+  "version": "2.1.10",
   "main": "dist/index.js",
   "module": "src/index.js",
   "license": "MIT",

src/Element.js

@@ -137,10 +137,10 @@ class Element extends Node {
         for (const c of child) {
           if (realNode.childNodes[index] !== c) {
             if (realNode.childNodes[index]) {
-              realNode.removeChild(realNode.childNodes[index])
+              realNode.replaceChild(c, realNode.childNodes[index])
+            } else {
+              realNode.appendChild(c)
             }
-
-            realNode.appendChild(c)
           }
           index += 1
         }

src/Element.spec.js

@@ -314,8 +314,6 @@ describe('.replaceChild(newChild, oldChild)', () => {
 
     template.reconcile()
 
-    window.DEBUG = true
-
     template.replaceChild(
       fragdom.createElement('new-b'),
       template.childNodes[1],
@@ -325,4 +323,24 @@ describe('.replaceChild(newChild, oldChild)', () => {
 
     expect(template.realNode.innerHTML).toBe('<a></a><new-b></new-b><c></c>')
   })
+
+  test('reconciliation bugfix', () => {
+    const root = <div />
+
+    const frag = (
+      <>
+        {'1'}
+        {''}
+        {'2'}
+      </>
+    )
+
+    root.appendChild(frag)
+    frag.reconcile()
+
+    frag.replaceChild(fragdom.createTextNode('Hello'), frag.childNodes[1])
+    frag.reconcile()
+
+    expect(root.realNode.innerHTML).toBe('1Hello2')
+  })
 })

src/Fragment.js

@@ -15,6 +15,11 @@ class Fragment extends Node {
     this.markAsDirty()
   }
 
+  replaceChild(newChild, oldChild) {
+    super.replaceChild(newChild, oldChild)
+    this.markAsDirty()
+  }
+
   dirty() {
     return this.#dirty
   }