[CrOS Settings] Allow context menu on PIN keyboard.

The PIN keyboard previously disallowed viewing a context menu (i.e., the
menu shown when right-clicking). The reasoning for this change was that
some users on touch screens would enter several digits, then decide they
wanted to delete these digits and do so by pressing and holding the PIN
keyboard's backspace button. Chrome OS would consider this a long press,
which causes a context menu to be displayed.

This CL fixes this issue by:
(1) Moving the listener to the backspace button instead of on the entire
    element.
(2) Editing the handler function to inspect the mouse button before
    blocking the context menu. In this case, button value 0 means a long
    press and button value 3 means a right-click. This CL ensures that
    the context menu is only blocked by a long press.

Bug: 1004974
Change-Id: I93f60a77a8b374039f23f78561ebb73a667a905b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1851044
Auto-Submit: Kyle Horimoto <khorimoto@chromium.org>
Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Commit-Queue: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#704691}

ui/webui/resources/cr_components/chromeos/quick_unlock/pin_keyboard.html

@@ -190,7 +190,7 @@
       }
     </style>
 
-    <div id="root" on-contextmenu="onContextMenu_" on-tap="onRootTap_">
+    <div id="root" on-tap="onRootTap_">
       <div id="pinInputDiv">
         <cr-input id="pinInput" type="password" value="{{value}}"
             is-input-rtl$="[[isInputRtl_(value)]]" aria-label="[[ariaLabel]]"
@@ -278,6 +278,7 @@
               on-pointerdown="onBackspacePointerDown_"
               on-pointerout="clearAndReset_"
               on-pointerup="onBackspacePointerUp_"
+              on-contextmenu="onBackspaceContextMenu_"
               title="[[i18n('pinKeyboardDeleteAccessibleName')]]">
           </cr-icon-button>
         </div>

ui/webui/resources/cr_components/chromeos/quick_unlock/pin_keyboard.js

@@ -492,12 +492,20 @@ Polymer({
   },
 
   /**
-   * Catch and stop propagation of context menu events since we the backspace
-   * button can be held down on touch.
-   * @param {!Event} e
+   * @param {!MouseEvent} e
    * @private
    */
-  onContextMenu_: function(e) {
+  onBackspaceContextMenu_: function(e) {
+    // Note: If e.which is 0, this represents "no button" (i.e., a long-press).
+    // If this event was triggered by another value (e.g., right click - 3),
+    // return early and allow the context menu to be shown.
+    if (e.which) {
+      return;
+    }
+
+    // If the user was long-pressing the backspace button, that user likely was
+    // trying to remove several numbers from the PIN text field rapidly, so
+    // don't show the context menu.
     e.preventDefault();
     e.stopPropagation();
   },