From fd57066d5767389a6523fb6d105014b74e2be608 Mon Sep 17 00:00:00 2001
From: Philippe Elsass <philippe.elsass@gmail.com>
Date: Wed, 24 Dec 2025 10:42:25 +0100
Subject: [PATCH] Fix flexbox in DOM inspector

---
 devtools/lightning-inspect.js | 16 +++++++++++++---
 src/tree/core/ElementCore.mjs |  6 ++++--
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/devtools/lightning-inspect.js b/devtools/lightning-inspect.js
index c6ca3bf2..7e674e73 100644
--- a/devtools/lightning-inspect.js
+++ b/devtools/lightning-inspect.js
@@ -160,7 +160,9 @@ window.attachInspector = function({Application, Element, ElementCore, Stage, Com
                                 if (!f[3]) c["colorBr"] = pv;
                                 break;
                             default:
-                                c[rn] = pv;
+                                if (c[rn] !== pv) { // prevent infinite update loop
+                                    c[rn] = pv;
+                                }
                         }
 
                         // Set final value, not the transitioned value.
@@ -352,7 +354,11 @@ window.attachInspector = function({Application, Element, ElementCore, Stage, Com
         },
         set: function(v) {
             if (this.$x !== v) {
-                val(this, 'x', v, 0);
+                if (this.hasFlexLayout()) {
+                    val(this, 'x', this.layout.originalX, 0); // show non computed value
+                } else {
+                    val(this, 'x', v, 0);
+                }
                 this.$x = v;
                 this.updateLeft();
             }
@@ -366,7 +372,11 @@ window.attachInspector = function({Application, Element, ElementCore, Stage, Com
         },
         set: function(v) {
             if (this.$y !== v) {
-                val(this, 'y', v, 0);
+                if (this.hasFlexLayout()) {
+                    val(this, 'y', this.layout.originalY, 0); // show non computed value
+                } else {
+                    val(this, 'y', v, 0);
+                }
                 this.$y = v;
                 this.updateTop();
             }
diff --git a/src/tree/core/ElementCore.mjs b/src/tree/core/ElementCore.mjs
index 2cae2037..281621ec 100644
--- a/src/tree/core/ElementCore.mjs
+++ b/src/tree/core/ElementCore.mjs
@@ -201,8 +201,9 @@ export default class ElementCore {
         } else {
             this._disableFuncX();
             if (this.hasFlexLayout()) {
-                this.x += (v - this._layout.originalX);
+                const dx = v - this._layout.originalX;
                 this._layout.setOriginalXWithoutUpdatingLayout(v);
+                this.x += dx;
             } else {
                 this.x = v;
             }
@@ -261,8 +262,9 @@ export default class ElementCore {
         } else {
             this._disableFuncY();
             if (this.hasFlexLayout()) {
-                this.y += (v - this._layout.originalY);
+                const dy = v - this._layout.originalY;
                 this._layout.setOriginalYWithoutUpdatingLayout(v);
+                this.y += dy;
             } else {
                 this.y = v;
             }