[WebUI] Modify action-link's .no-outline on input only.

ui/webui/resources/js/action_link.js

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // Action links are elements that are used to perform an in-page navigation or
 // action (e.g. showing a dialog).
 //
 // They look like normal anchor (<a>) tags as their text color is blue. However,
 // they're subtly different as they're not initially underlined (giving users a
 // clue that underlined links navigate while action links don't).
@@ skipping 36 matching lines @@
         if (!this.disabled && e.key == 'Enter' && !this.href) {
           // Schedule a click asynchronously because other 'keydown' handlers
           // may still run later (e.g. document.addEventListener('keydown')).
           // Specifically options dialogs break when this timeout isn't here.
           // NOTE: this affects the "trusted" state of the ensuing click. I
           // haven't found anything that breaks because of this (yet).
           window.setTimeout(this.click.bind(this), 0);
         }
       });
 
+      this.addEventListener('keyup', function(e) {
+        // If focus started via Tab press, allow outline to show.
+        if (e.key === 'Tab')

[Dan Beam, 2017/03/22 03:28:53]

this isn't the only way focus can get to an element.  enter and screenreaders
with configurable shortcuts also can set focus

+          this.classList.remove('no-outline');
+      });
+
       function preventDefault(e) {
         e.preventDefault();
       }
 
       function removePreventDefault() {
         document.removeEventListener('selectstart', preventDefault);
         document.removeEventListener('mouseup', removePreventDefault);
       }
 
       this.addEventListener('mousedown', function() {
         // This handlers strives to match the behavior of <a href="...">.
 
         // While the mouse is down, prevent text selection from dragging.
         document.addEventListener('selectstart', preventDefault);
         document.addEventListener('mouseup', removePreventDefault);
 
-        // If focus started via mouse press, don't show an outline.
+        // If focus started via mouse press, suppress outline.
         if (document.activeElement != this)
           this.classList.add('no-outline');
       });
-
-      this.addEventListener('blur', function(e) {
-        // This check helps us exclude external events like application switch.
-        if (e.sourceCapabilities)
-          this.classList.remove('no-outline');
-      });
     },
 
     /** @type {boolean} */
     set disabled(disabled) {
       if (disabled)
         HTMLAnchorElement.prototype.setAttribute.call(this, 'disabled', '');
       else
         HTMLAnchorElement.prototype.removeAttribute.call(this, 'disabled');
       this.tabIndex = disabled ? -1 : 0;
     },
@@ skipping 13 matching lines @@
     removeAttribute: function(attr) {
       if (attr.toLowerCase() == 'disabled')
         this.disabled = false;
       else
         HTMLAnchorElement.prototype.removeAttribute.apply(this, arguments);
     },
   },
 
   extends: 'a',
 });