From bd316a36a03b3c5ef9b4bf905aea6c0b7dda5407 Mon Sep 17 00:00:00 2001
From: Zack Arnett <arnett.zackary@gmail.com>
Date: Mon, 10 Aug 2020 15:15:21 -0500
Subject: [PATCH] Password manager?

---
 src/components/ha-form/ha-form-string.ts | 28 ++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/src/components/ha-form/ha-form-string.ts b/src/components/ha-form/ha-form-string.ts
index 46bdbee332..5c78ba91fb 100644
--- a/src/components/ha-form/ha-form-string.ts
+++ b/src/components/ha-form/ha-form-string.ts
@@ -37,6 +37,24 @@ export class HaFormString extends LitElement implements HaFormElement {
     }
   }
 
+  protected firstUpdated(): void {
+    if (this.schema.name.includes("password")) {
+      const stepInput = document.createElement("input");
+      stepInput.setAttribute("type", "password");
+      stepInput.setAttribute("name", "password");
+      stepInput.setAttribute("autocomplete", "on");
+      stepInput.onkeyup = (ev) => this._externalValueChanged(ev, this);
+      document.documentElement.appendChild(stepInput);
+    } else if (this.schema.name.includes("username")) {
+      const stepInput = document.createElement("input");
+      stepInput.setAttribute("type", "text");
+      stepInput.setAttribute("name", "username");
+      stepInput.setAttribute("autocomplete", "on");
+      stepInput.onkeyup = (ev) => this._externalValueChanged(ev, this);
+      document.documentElement.appendChild(stepInput);
+    }
+  }
+
   protected render(): TemplateResult {
     return this.schema.name.includes("password")
       ? html`
@@ -81,11 +99,21 @@ export class HaFormString extends LitElement implements HaFormElement {
     if (this.data === value) {
       return;
     }
+
     fireEvent(this, "value-changed", {
       value,
     });
   }
 
+  private _externalValueChanged(ev: Event, el): void {
+    const value = (ev.target as PaperInputElement).value;
+    if (this.data === value) {
+      return;
+    }
+
+    el.shadowRoot!.querySelector("paper-input").value = value;
+  }
+
   private get _stringType(): string {
     if (this.schema.format) {
       if (["email", "url"].includes(this.schema.format)) {