pdf: Work around focus appearing for styled input elements

Bug: 902646
Change-Id: I9d8b18cbc95064367580d37dce9b1a48640f7706
Reviewed-on: https://chromium-review.googlesource.com/c/1462378
Auto-Submit: dstockwell <dstockwell@chromium.org>
Commit-Queue: dsinclair <dsinclair@chromium.org>
Reviewed-by: dsinclair <dsinclair@chromium.org>
Cr-Commit-Position: refs/heads/master@{#630752}
diff --git a/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.html b/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.html
index e582fdf..d7acee52 100644
--- a/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.html
+++ b/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.html
@@ -67,7 +67,8 @@
             checked$="[[equal_(selectedColor, item.color)]]"
             tabindex="1" style="--item-color: [[item.color]]"
             title$="[[lookup_(strings, item.name)]]"
-            aria-label$="[[lookup_(strings, item.name)]]">
+            aria-label$="[[lookup_(strings, item.name)]]"
+            on-pointerdown="blurOnPointerDown">
       </template>
       <paper-icon-button id="expand" icon="cr:expand-more"
           tabindex="3"
@@ -83,10 +84,11 @@
             checked$="[[equal_(selectedSize, item.size)]]"
             tabindex="2" style="--item-size: [[item.size]]"
             title$="{{lookup_(strings, item.name)}}"
-            aria-label$="[[lookup_(strings, item.name)]]">
+            aria-label$="[[lookup_(strings, item.name)]]"
+            on-pointerdown="blurOnPointerDown">
       </template>
     </div>
     </paper-icon-button>
   </template>
   <script src="viewer-pen-options.js"></script>
-</dom-module>
\ No newline at end of file
+</dom-module>
diff --git a/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.js b/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.js
index 68735f1..db202e5 100644
--- a/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.js
+++ b/chrome/browser/resources/pdf/elements/viewer-pen-options/viewer-pen-options.js
@@ -172,7 +172,7 @@
    * @param {*} a
    * @param {*} b
    */
-  equal_: function(a,b) {
+  equal_: function(a, b) {
     return a == b;
   },
 
@@ -185,5 +185,15 @@
    */
   lookup_: function(strings, name) {
     return strings ? strings[name] : '';
-  }
-});
\ No newline at end of file
+  },
+
+  /**
+   * Used to remove focus when clicking or tapping on a styled input
+   * element. This is a workaround until we can use the :focus-visible
+   * pseudo selector.
+   */
+  blurOnPointerDown(e) {
+    const target = e.target;
+    setTimeout(() => target.blur(), 0);
+  },
+});