From 8d201e0d5dfb5c26aa6b4e58e526db1b1ef6c404 Mon Sep 17 00:00:00 2001
From: vdegenne <vdegenne@gmail.com>
Date: Wed, 28 Feb 2024 11:50:06 +0100
Subject: [PATCH] fix(switch): reflect `selected` state in input event

---
 switch/internal/switch.ts | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/switch/internal/switch.ts b/switch/internal/switch.ts
index 2e58d3d695..e6efd07d3a 100644
--- a/switch/internal/switch.ts
+++ b/switch/internal/switch.ts
@@ -114,6 +114,7 @@ export class Switch extends switchBaseClass {
           ?checked=${this.selected}
           ?disabled=${this.disabled}
           ?required=${this.required}
+          @input=${this.handleInput}
           @change=${this.handleChange} />
 
         <md-focus-ring part="focus-ring" for="switch"></md-focus-ring>
@@ -190,9 +191,16 @@ export class Switch extends switchBaseClass {
     return this.icons || this.showOnlySelectedIcon;
   }
 
+  private handleInput(event: Event) {
+    const target = event.target as HTMLInputElement;
+    this.selected = target.checked;
+    // <input> 'input' event bubbles and is composed, don't re-dispatch it.
+  }
+
   private handleChange(event: Event) {
     const target = event.target as HTMLInputElement;
     this.selected = target.checked;
+    // <input> 'change' event is not composed, re-dispatch it.
     redispatchEvent(this, event);
   }