From e2ec3b63ce8e196634879eaacc06b1c441a81721 Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Thu, 13 Jul 2023 16:33:12 +0200
Subject: [PATCH] Fix autocorrect and spellcheck for ha-textfield (#17274)

---
 src/components/ha-combo-box.ts                |  2 +-
 src/components/ha-textfield.ts                | 19 +++++++++++++++++++
 .../entity-registry-settings-editor.ts        |  4 ++++
 .../state/developer-tools-state.js            |  2 +-
 4 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/components/ha-combo-box.ts b/src/components/ha-combo-box.ts
index 4b6c9b1ed5..ca549b7567 100644
--- a/src/components/ha-combo-box.ts
+++ b/src/components/ha-combo-box.ts
@@ -173,7 +173,7 @@ export class HaComboBox extends LitElement {
           autocapitalize="none"
           autocomplete="off"
           autocorrect="off"
-          spellcheck="false"
+          input-spellcheck="false"
           .suffix=${html`<div
             style="width: 28px;"
             role="none presentation"
diff --git a/src/components/ha-textfield.ts b/src/components/ha-textfield.ts
index b6fdfef696..5053435283 100644
--- a/src/components/ha-textfield.ts
+++ b/src/components/ha-textfield.ts
@@ -17,6 +17,11 @@ export class HaTextField extends TextFieldBase {
 
   @property() public autocomplete?: string;
 
+  @property() public autocorrect?: string;
+
+  @property({ attribute: "input-spellcheck" })
+  public inputSpellcheck?: string;
+
   @query("input") public formElement!: HTMLInputElement;
 
   override updated(changedProperties: PropertyValues) {
@@ -38,6 +43,20 @@ export class HaTextField extends TextFieldBase {
         this.formElement.removeAttribute("autocomplete");
       }
     }
+    if (changedProperties.has("autocorrect")) {
+      if (this.autocorrect) {
+        this.formElement.setAttribute("autocorrect", this.autocorrect);
+      } else {
+        this.formElement.removeAttribute("autocorrect");
+      }
+    }
+    if (changedProperties.has("inputSpellcheck")) {
+      if (this.inputSpellcheck) {
+        this.formElement.setAttribute("spellcheck", this.inputSpellcheck);
+      } else {
+        this.formElement.removeAttribute("spellcheck");
+      }
+    }
   }
 
   protected override renderIcon(
diff --git a/src/panels/config/entities/entity-registry-settings-editor.ts b/src/panels/config/entities/entity-registry-settings-editor.ts
index 699fd8933a..96d1214370 100644
--- a/src/panels/config/entities/entity-registry-settings-editor.ts
+++ b/src/panels/config/entities/entity-registry-settings-editor.ts
@@ -687,6 +687,10 @@ export class EntityRegistrySettingsEditor extends LitElement {
         required
         @input=${this._entityIdChanged}
         iconTrailing
+        autocapitalize="none"
+        autocomplete="off"
+        autocorrect="off"
+        input-spellcheck="false"
       >
         <ha-icon-button
           @click=${this._copyEntityId}
diff --git a/src/panels/developer-tools/state/developer-tools-state.js b/src/panels/developer-tools/state/developer-tools-state.js
index 1fe00ee0fd..214473610f 100644
--- a/src/panels/developer-tools/state/developer-tools-state.js
+++ b/src/panels/developer-tools/state/developer-tools-state.js
@@ -202,7 +202,7 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
               autocapitalize="none"
               autocomplete="off"
               autocorrect="off"
-              spellcheck="false"
+              input-spellcheck="false"
               value="[[_state]]"
               on-change="stateChanged"
               class="state-input"