Fix autocorrect and spellcheck for ha-textfield (#17274)

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"

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(

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}

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"