From 42e6c90c4632423386b165dddc4b94a55c075e2e Mon Sep 17 00:00:00 2001
From: William Martin <contact@willmartin.dev>
Date: Tue, 6 Apr 2021 09:54:29 -0400
Subject: [PATCH] fix(toggle): prevent click event from firing twice (#23146)

resolves #23041
---
 core/src/components/toggle/test/basic/index.html | 10 ++++++++++
 core/src/components/toggle/toggle.scss           |  2 ++
 2 files changed, 12 insertions(+)

diff --git a/core/src/components/toggle/test/basic/index.html b/core/src/components/toggle/test/basic/index.html
index 815245d35c..32394af0b7 100644
--- a/core/src/components/toggle/test/basic/index.html
+++ b/core/src/components/toggle/test/basic/index.html
@@ -76,6 +76,11 @@
           <ion-toggle slot="start" style="--border-radius: 0px;--handle-border-radius: 0px;" checked></ion-toggle>
         </ion-item>
 
+        <ion-item>
+          <ion-label>Stop Immediate Event Propagation</ion-label>
+          <ion-toggle slot="start" checked id="eventPropagation"></ion-toggle>
+        </ion-item>
+
       </ion-list>
 
 
@@ -121,6 +126,11 @@
         var isTrue = el[prop] ? false : true;
         el[prop] = isTrue;
       }
+
+      document.getElementById('eventPropagation').addEventListener('click', (evt) => {
+        evt.stopImmediatePropagation();
+        console.log('clicked');
+      });
     </script>
 
   </ion-app>
diff --git a/core/src/components/toggle/toggle.scss b/core/src/components/toggle/toggle.scss
index 2ab8b0ab3a..943f442f18 100644
--- a/core/src/components/toggle/toggle.scss
+++ b/core/src/components/toggle/toggle.scss
@@ -53,6 +53,8 @@ label {
   align-items: center;
 
   opacity: 0;
+
+  pointer-events: none;
 }
 
 input {