Pin keyboard works with virtual keyboard.

ui/login/account_picker/screen_account_picker.js

Index: ui/login/account_picker/screen_account_picker.js
diff --git a/ui/login/account_picker/screen_account_picker.js b/ui/login/account_picker/screen_account_picker.js
index 198888fab8786fbf496e4d6769d9fedd55c0519a..1a0cfdbc169351ecc12d4b43b23a174c74145a61 100644
--- a/ui/login/account_picker/screen_account_picker.js
+++ b/ui/login/account_picker/screen_account_picker.js
@@ -180,18 +180,32 @@ login.createScreen('AccountPickerScreen', 'account-picker', function() {
         // 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);
         }
       }
     },