Pin keyboard works with virtual keyboard.

ui/login/account_picker/screen_account_picker.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.
 
 /**
  * @fileoverview Account picker screen implementation.
  */
 
 login.createScreen('AccountPickerScreen', 'account-picker', function() {
   /**
@@ skipping 162 matching lines @@
             [activatedPod.user.emailAddress]);
         activatedPod.showSigninUI();
       } else {
         if (loginAttempts == 1) {
           chrome.send('firstIncorrectPasswordAttempt',
               [activatedPod.user.emailAddress]);
         }
         // We want bubble's arrow to point to the first letter of input.
         /** @const */ var BUBBLE_OFFSET = 7;
         /** @const */ var BUBBLE_PADDING = 4;
-        $('bubble').showContentForElement(activatedPod.mainInput,
-                                          cr.ui.Bubble.Attachment.BOTTOM,
-                                          error,
-                                          BUBBLE_OFFSET, BUBBLE_PADDING);
+
+        // We want the bubble to point to where the input is after it is done
+        // tranisitioning.
+        var showBottomCallback = function() {

[jdufault, 2016/08/24 01:35:11]

Does this work if we are not showing the PIN keyboard by default? Where does the
transitionend event come from?

[sammiequon, 2016/08/25 18:12:33]

Yes. The transition end event comes from the pod.

+          activatedPod.removeEventListener("transitionend", showBottomCallback);
+          $('bubble').showContentForElement(activatedPod.mainInput,
+                                            cr.ui.Bubble.Attachment.BOTTOM,
+                                            error,
+                                            BUBBLE_OFFSET, BUBBLE_PADDING);
+        };
+        activatedPod.addEventListener("transitionend",showBottomCallback,

[jdufault, 2016/08/24 01:35:10]

Add ensureTransitionEndEvent guards

[jdufault, 2016/08/24 01:35:11]

Add space after comma

[sammiequon, 2016/08/25 18:12:33]

Done.

[sammiequon, 2016/08/25 18:12:33]

Done.

+                                      false);
+
         // Move error bubble up if it overlaps the shelf.
         var maxHeight =
             cr.ui.LoginUITools.getMaxHeightBeforeShelfOverlapping($('bubble'));
         if (maxHeight < $('bubble').offsetHeight) {
-          $('bubble').showContentForElement(activatedPod.mainInput,
-                                            cr.ui.Bubble.Attachment.TOP,
-                                            error,
-                                            BUBBLE_OFFSET, BUBBLE_PADDING);
+          var showTopCallback = function() {
+            activatedPod.removeEventListener("transitionend", showTopCallback);
+            $('bubble').showContentForElement(activatedPod.mainInput,
+                                              cr.ui.Bubble.Attachment.TOP,
+                                              error,
+                                              BUBBLE_OFFSET, BUBBLE_PADDING);
+          };
+          activatedPod.addEventListener("transitionend", showTopCallback,
+                                        false);
         }
       }
     },
 
     /**
      * Loads the PIN keyboard if any of the users can login with a PIN.
      * @param {array} users Array of user instances.
      */
     loadPinKeyboardIfNeeded_: function(users) {
       for (var i = 0; i < users.length; ++i) {
@@ skipping 189 matching lines @@
      * @param {string} userID The user ID of the public session
      * @param {string} locale The locale to which this list of keyboard layouts
      *     applies
      * @param {!Object} list List of available keyboard layouts
      */
     setPublicSessionKeyboardLayouts: function(userID, locale, list) {
       $('pod-row').setPublicSessionKeyboardLayouts(userID, locale, list);
     }
   };
 });