From 17d92f6b4b06ec376df8ac90f55828b2abb8bf20 Mon Sep 17 00:00:00 2001
From: Elizabeth Mitchell <lizmitchell@google.com>
Date: Mon, 22 Aug 2022 16:59:16 -0700
Subject: [PATCH] fix(text-field): label floating after type changes

PiperOrigin-RevId: 469319802
---
 textfield/lib/text-field.ts | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/textfield/lib/text-field.ts b/textfield/lib/text-field.ts
index 6770ab4382..18eaa1028b 100644
--- a/textfield/lib/text-field.ts
+++ b/textfield/lib/text-field.ts
@@ -506,6 +506,18 @@ export abstract class TextField extends LitElement {
     super.willUpdate(changedProperties);
   }
 
+  protected override updated() {
+    // If a property such as `type` changes and causes the internal <input>
+    // value to change without dispatching an event, re-sync it.
+    const value = this.getInput().value;
+    if (this.value !== value) {
+      // Note this is typically inefficient in updated() since it schedules
+      // another update. However, it is needed for the <input> to fully render
+      // before checking its value.
+      this.value = value;
+    }
+  }
+
   protected handleInput(event: InputEvent) {
     this.dirty = true;
     this.value = (event.target as HTMLInputElement).value;