From 0dbdeffdb89a387d6c0dcb46b38ce8990e214f61 Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Mon, 12 Oct 2020 14:25:22 +0300
Subject: [PATCH] allow focus outline on click in text/search input or textarea

---
 js/dom.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/js/dom.js b/js/dom.js
index 4e40bc83..cd56fcf2 100644
--- a/js/dom.js
+++ b/js/dom.js
@@ -355,20 +355,23 @@ function focusAccessibility() {
     'a',
     'button',
     'input',
-    'textarea',
     'label',
     'select',
     'summary',
   ];
   // try to find a focusable parent for this many parentElement jumps:
   const GIVE_UP_DEPTH = 4;
+  const isOutlineAllowed = ({localName, type}) =>
+    !focusAccessibility.ELEMENTS.includes(localName) ||
+    // allow outline on text/search inputs in addition to textareas
+    localName === 'input' && (type === 'text' || type === 'search');
 
   addEventListener('mousedown', suppressOutlineOnClick, {passive: true});
   addEventListener('keydown', keepOutlineOnTab, {passive: true});
 
   function suppressOutlineOnClick({target}) {
     for (let el = target, i = 0; el && i++ < GIVE_UP_DEPTH; el = el.parentElement) {
-      if (focusAccessibility.ELEMENTS.includes(el.localName)) {
+      if (!isOutlineAllowed(el)) {
         focusAccessibility.lastFocusedViaClick = true;
         if (el.dataset.focusedViaClick === undefined) {
           el.dataset.focusedViaClick = '';
@@ -387,7 +390,7 @@ function focusAccessibility() {
       return;
     }
     let el = document.activeElement;
-    if (!el || !focusAccessibility.ELEMENTS.includes(el.localName)) {
+    if (!el || isOutlineAllowed(el)) {
       return;
     }
     if (el.dataset.focusedViaClick !== undefined) {