From 072ad878311c294408527fd4c8935e76aca25c5e Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Thu, 2 Jul 2020 20:09:58 +0200
Subject: [PATCH] Prevent doing yaml conversion twice (#6308)

---
 .../editor/card-editor/hui-card-editor.ts     | 32 ++++++++++++++-----
 1 file changed, 24 insertions(+), 8 deletions(-)

diff --git a/src/panels/lovelace/editor/card-editor/hui-card-editor.ts b/src/panels/lovelace/editor/card-editor/hui-card-editor.ts
index 0f58b84822..74d3d02511 100644
--- a/src/panels/lovelace/editor/card-editor/hui-card-editor.ts
+++ b/src/panels/lovelace/editor/card-editor/hui-card-editor.ts
@@ -24,6 +24,7 @@ import type { EntityConfig } from "../../entity-rows/types";
 import type { LovelaceCardEditor } from "../../types";
 import type { GUIModeChangedEvent } from "../types";
 import "../../../../components/ha-circular-progress";
+import { deepEqual } from "../../../../common/util/deep-equal";
 
 export interface ConfigChangedEvent {
   config: LovelaceCardConfig;
@@ -81,16 +82,11 @@ export class HuiCardEditor extends LitElement {
     this._yaml = _yaml;
     try {
       this._config = safeLoad(this.yaml);
-      this._updateConfigElement();
       this._error = undefined;
     } catch (err) {
       this._error = err.message;
     }
-    fireEvent(this, "config-changed", {
-      config: this.value!,
-      error: this._error,
-      guiModeAvailable: !(this.hasWarning || this.hasError),
-    });
+    this._setConfig();
   }
 
   public get value(): LovelaceCardConfig | undefined {
@@ -98,9 +94,29 @@ export class HuiCardEditor extends LitElement {
   }
 
   public set value(config: LovelaceCardConfig | undefined) {
-    if (JSON.stringify(config) !== JSON.stringify(this._config || {})) {
-      this.yaml = safeDump(config);
+    if (this._config && deepEqual(config, this._config)) {
+      return;
     }
+    this._config = config;
+    this._yaml = safeDump(config);
+    this._error = undefined;
+    this._setConfig();
+  }
+
+  private _setConfig() {
+    if (!this._error) {
+      try {
+        this._updateConfigElement();
+        this._error = undefined;
+      } catch (err) {
+        this._error = err.message;
+      }
+    }
+    fireEvent(this, "config-changed", {
+      config: this.value!,
+      error: this._error,
+      guiModeAvailable: !(this.hasWarning || this.hasError),
+    });
   }
 
   public get hasWarning(): boolean {