From e5285d63461dc80eac26806465929c0195f3dbcb Mon Sep 17 00:00:00 2001
From: alvarosabu <alvaro.saburido@gmail.com>
Date: Fri, 18 Aug 2023 16:21:36 +0200
Subject: [PATCH] fix: handle deepEqual edge case of DOM elements

---
 src/core/nodeOps.ts |  8 +++++++-
 src/utils/index.ts  | 19 +++++++++++++++++++
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/core/nodeOps.ts b/src/core/nodeOps.ts
index 20dcc42a9..0ac3259b9 100644
--- a/src/core/nodeOps.ts
+++ b/src/core/nodeOps.ts
@@ -192,8 +192,14 @@ export const nodeOps: RendererOptions<TresObject, TresObject> = {
         const prevArgs = _prevValue ?? []
         const args = nextValue ?? []
         const instanceName = node.userData.tres__name || node.type
-
+        console.log('replacing', {
+          instanceName,
+          args,
+          prevArgs,
+          diff: !deepArrayEqual(prevArgs, args)
+        })
         if (instanceName && !deepArrayEqual(prevArgs, args)) {
+
           root = Object.assign(prevNode, new catalogue.value[instanceName](...nextValue))
         }
         return
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 1e6330e8e..c13302927 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -26,6 +26,10 @@ const HTML_TAGS =
 
 export const isHTMLTag = /*#__PURE__*/ makeMap(HTML_TAGS)
 
+export function isDOMElement(obj: any): obj is HTMLElement {
+  return obj && obj.nodeType === 1;
+}
+
 export function kebabToCamel(str: string) {
   return str.replace(/-([a-z])/g, (_, c) => c.toUpperCase())
 }
@@ -77,6 +81,21 @@ export const set = (obj: any, path: string | string[], value: any): void => {
 
 
 export function deepEqual(a: any, b: any): boolean {
+
+  if (isDOMElement(a) && isDOMElement(b)) {
+    const attrsA = a.attributes;
+    const attrsB = b.attributes;
+
+    if (attrsA.length !== attrsB.length) return false;
+
+    for (let i = 0; i < attrsA.length; i++) {
+      const { name, value } = attrsA[i];
+      if (b.getAttribute(name) !== value) return false;
+    }
+
+    return true;
+  }
+
   // If both are primitives, return true if they are equal
   if (a === b) return true;