From 0ba7738da138a43e6bf0cf62f729271edbe25612 Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Sun, 17 Sep 2023 13:48:57 +0200
Subject: [PATCH] feat: only call onChanges when previousValue !== currentValue

---
 WebComponent.mjs | 3 +--
 demo/index.html  | 4 ++++
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/WebComponent.mjs b/WebComponent.mjs
index 7791f81..e0edc0f 100644
--- a/WebComponent.mjs
+++ b/WebComponent.mjs
@@ -23,10 +23,9 @@ export class WebComponent extends HTMLElement {
   attributeChangedCallback(property, previousValue, currentValue) {
     if (previousValue !== currentValue) {
       this[property] = currentValue;
+      this.onChanges({ property, previousValue, currentValue });
       this.render();
     }
-
-    this.onChanges({ property, previousValue, currentValue });
   }
 
   render() {
diff --git a/demo/index.html b/demo/index.html
index 07855ea..a6f715f 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -16,6 +16,10 @@
       setTimeout(() => {
         helloWorld.setAttribute("emotion", "excited");
       }, 2500);
+
+      helloWorld.addEventListener("click", () => {
+        helloWorld.setAttribute("name", "Clicked");
+      });
     </script>
   </body>
 </html>