From 11fa9d1ed8768654c84b5d04485826b0e9cc323c Mon Sep 17 00:00:00 2001
From: karwosts <32912880+karwosts@users.noreply.github.com>
Date: Thu, 20 Jul 2023 07:14:32 -0700
Subject: [PATCH] Fix guiMode toggle bugs in element-editor (#17282)

---
 .../lovelace/editor/hui-element-editor.ts     | 34 +++++++++++--------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/src/panels/lovelace/editor/hui-element-editor.ts b/src/panels/lovelace/editor/hui-element-editor.ts
index f711c63210..2d2b58f4a1 100644
--- a/src/panels/lovelace/editor/hui-element-editor.ts
+++ b/src/panels/lovelace/editor/hui-element-editor.ts
@@ -131,14 +131,16 @@ export abstract class HuiElementEditor<T, C = any> extends LitElement {
       }
     }
 
-    fireEvent(this, "config-changed", {
-      config: this.value! as any,
-      error: this._errors?.join(", "),
-      guiModeAvailable: !(
-        this.hasWarning ||
-        this.hasError ||
-        this._guiSupported === false
-      ),
+    this.updateComplete.then(() => {
+      fireEvent(this, "config-changed", {
+        config: this.value! as any,
+        error: this._errors?.join(", "),
+        guiModeAvailable: !(
+          this.hasWarning ||
+          this.hasError ||
+          this._guiSupported === false
+        ),
+      });
     });
   }
 
@@ -156,13 +158,15 @@ export abstract class HuiElementEditor<T, C = any> extends LitElement {
 
   public set GUImode(guiMode: boolean) {
     this._guiMode = guiMode;
-    fireEvent(this as HTMLElement, "GUImode-changed", {
-      guiMode,
-      guiModeAvailable: !(
-        this.hasWarning ||
-        this.hasError ||
-        this._guiSupported === false
-      ),
+    this.updateComplete.then(() => {
+      fireEvent(this as HTMLElement, "GUImode-changed", {
+        guiMode,
+        guiModeAvailable: !(
+          this.hasWarning ||
+          this.hasError ||
+          this._guiSupported === false
+        ),
+      });
     });
   }