From c7f5c6c1d1522988db499ae6ee5e78fc53ff0be9 Mon Sep 17 00:00:00 2001
From: Donnie <donniekarnsinsb@hotmail.com>
Date: Thu, 29 Oct 2020 09:18:47 -0700
Subject: [PATCH] Fix issue with toggles blocking dialog and dialog launching
 on mobile (#7506)

* Fix issue with some inputs blocking, or incorrectly allowing, keyboard shortcut activation

* Explicitly declare all input types that we can allow alphanumeric overrides

* Do not launch dialog in codemirror targets on mobile devices
---
 src/components/ha-code-editor.ts |  5 +++++
 src/state/quick-bar-mixin.ts     | 37 +++++++++++++++++++++++++-------
 2 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/src/components/ha-code-editor.ts b/src/components/ha-code-editor.ts
index b49d57c897..5dc3b7f826 100644
--- a/src/components/ha-code-editor.ts
+++ b/src/components/ha-code-editor.ts
@@ -81,6 +81,7 @@ export class HaCodeEditor extends UpdatingElement {
 
   protected firstUpdated(changedProps: PropertyValues): void {
     super.firstUpdated(changedProps);
+    this._blockKeyboardShortcuts();
     this._load();
   }
 
@@ -232,6 +233,10 @@ export class HaCodeEditor extends UpdatingElement {
     this.codemirror!.on("changes", () => this._onChange());
   }
 
+  private _blockKeyboardShortcuts() {
+    this.addEventListener("keydown", (ev) => ev.stopPropagation());
+  }
+
   private _onChange(): void {
     const newValue = this.value;
     if (newValue === this._value) {
diff --git a/src/state/quick-bar-mixin.ts b/src/state/quick-bar-mixin.ts
index 3940ffe831..ceac362aa1 100644
--- a/src/state/quick-bar-mixin.ts
+++ b/src/state/quick-bar-mixin.ts
@@ -36,20 +36,41 @@ export default <T extends Constructor<HassElement>>(superClass: T) =>
     }
 
     private _showQuickBar(e: KeyboardEvent, commandMode = false) {
-      if (
-        !this.hass?.user?.is_admin ||
-        !this.hass.enableShortcuts ||
-        this._inInputField(e)
-      ) {
+      if (!this._canShowQuickBar(e)) {
         return;
       }
 
       showQuickBar(this, { commandMode });
     }
 
-    private _inInputField(e: KeyboardEvent) {
-      return ["INPUT", "TEXTAREA"].includes(
-        (e.composedPath()[0] as HTMLElement).tagName
+    private _canShowQuickBar(e: KeyboardEvent) {
+      return (
+        this.hass?.user?.is_admin &&
+        this.hass.enableShortcuts &&
+        this._canOverrideAlphanumericInput(e)
       );
     }
+
+    private _canOverrideAlphanumericInput(e: KeyboardEvent) {
+      const el = e.composedPath()[0] as any;
+
+      if (el.tagName === "TEXTAREA") {
+        return false;
+      }
+
+      if (el.tagName !== "INPUT") {
+        return true;
+      }
+
+      switch (el.type) {
+        case "button":
+        case "checkbox":
+        case "hidden":
+        case "radio":
+        case "range":
+          return true;
+        default:
+          return false;
+      }
+    }
   };