fix: used variables by dynamically added dom are being removed during disposal of nodes

Author: jorenrui

lib/entity.js

@@ -439,13 +439,19 @@ export default class Entity {
 
   dispose() {
     const elements = [this.element, ...this.element.querySelectorAll('*')]
+    const variables = []
 
     // Remove event bindings
     for (const element of elements) {
+      if (element.nodeType !== 1) continue
+
       const entity = MiniJS.elements.find(
         (entity) => entity.element === element
       )
-      entity?.removeEventBindings()
+      if (!entity) continue
+
+      variables.push(...entity.variables)
+      entity.removeEventBindings()
     }
 
     // Remove disposed elements
@@ -459,11 +465,13 @@ export default class Entity {
       []
     )
 
-    const unusedVariables = MiniJS.variables.filter(
+    const unusedVariables = variables.filter(
       (variable) => !usedVariables.includes(variable)
     )
 
-    MiniJS.variables = [...usedVariables]
+    MiniJS.variables = MiniJS.variables.filter(
+      (variable) => !unusedVariables.includes(variable)
+    )
 
     unusedVariables.forEach((variable) => {
       if (variable.startsWith('el.')) {

lib/main.js

@@ -120,18 +120,17 @@ const MiniJS = (() => {
     observeDOM(document.body, (mutation) => {
       mutation.forEach((record) => {
         record.removedNodes.forEach((node) => {
+          if (node.nodeType !== 1) return
           const entity = _elements.find((entity) => entity.element === node)
           entity?.dispose()
         })
 
-        if (record.addedNodes.length) {
-          record.addedNodes.forEach((node) => {
-            if (node.nodeType !== 1) return
-            const entity = new Entity(node)
-            entity.init()
-            entity.initChildren()
-          })
-        }
+        record.addedNodes.forEach((node) => {
+          if (node.nodeType !== 1) return
+          const entity = new Entity(node)
+          entity.init()
+          entity.initChildren()
+        })
       })
     })
   }