Settings[DICE]: move the user menu down to not block the selected acc…

…ount.

Also added a closure @typedef that allows configs passed to showAt to
optionally leave out top/left.

Bug: 810104
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ic5ffc3338995cd57b19f0e1373e8753239e68519
Reviewed-on: https://chromium-review.googlesource.com/907854
Commit-Queue: Scott Chen <scottchen@chromium.org>
Reviewed-by: calamity <calamity@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#535867}

chrome/browser/resources/settings/people_page/sync_account_control.js

@@ -138,7 +138,9 @@ Polymer({
   onMenuButtonTap_: function() {
     const actionMenu =
         /** @type {!CrActionMenuElement} */ (this.$$('#menu'));
-    actionMenu.showAt(assert(this.$$('#dots')));
+    actionMenu.showAt(assert(this.$$('#dots')), {
+      anchorAlignmentY: AnchorAlignment.AFTER_END,
+    });
   },
 
   /**

ui/webui/resources/cr_elements/cr_action_menu/cr_action_menu.js

@@ -2,6 +2,22 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+/**
+ * @typedef {{
+ *   top: (number|undefined),
+ *   left: (number|undefined),
+ *   width: (number|undefined),
+ *   height: (number|undefined),
+ *   anchorAlignmentX: (number|undefined),
+ *   anchorAlignmentY: (number|undefined),
+ *   minX: (number|undefined),
+ *   minY: (number|undefined),
+ *   maxX: (number|undefined),
+ *   maxY: (number|undefined),
+ * }}
+ */
+var ShowAtConfig;
+
 /**
  * @typedef {{
  *   top: number,
@@ -16,7 +32,7 @@
  *   maxY: (number|undefined),
  * }}
  */
-var ShowConfig;
+var ShowAtPositionConfig;
 
 /**
  * @enum {number}
@@ -81,7 +97,7 @@ function getStartPointWithAnchor(
 
 /**
  * @private
- * @return {!ShowConfig}
+ * @return {!ShowAtPositionConfig}
  */
 function getDefaultShowConfig() {
   var doc = document.scrollingElement;
@@ -256,7 +272,7 @@ Polymer({
   /**
    * Shows the menu anchored to the given element.
    * @param {!Element} anchorElement
-   * @param {ShowConfig=} opt_config
+   * @param {ShowAtConfig=} opt_config
    */
   showAt: function(anchorElement, opt_config) {
     this.anchorElement_ = anchorElement;
@@ -265,7 +281,7 @@ Polymer({
     this.anchorElement_.scrollIntoViewIfNeeded();
 
     var rect = this.anchorElement_.getBoundingClientRect();
-    this.showAtPosition(/** @type {ShowConfig} */ (Object.assign(
+    this.showAtPosition(/** @type {ShowAtPositionConfig} */ (Object.assign(
         {
           top: rect.top,
           left: rect.left,
@@ -302,7 +318,7 @@ Polymer({
    * (BEFORE_END, AFTER_START), whereas centering the menu below the bottom
    * edge of the anchor would use (CENTER, AFTER_END).
    *
-   * @param {!ShowConfig} config
+   * @param {!ShowAtPositionConfig} config
    */
   showAtPosition: function(config) {
     // Save the scroll position of the viewport.
@@ -319,7 +335,7 @@ Polymer({
     config.top += scrollTop;
     config.left += scrollLeft;
 
-    this.positionDialog_(/** @type {ShowConfig} */ (Object.assign(
+    this.positionDialog_(/** @type {ShowAtPositionConfig} */ (Object.assign(
         {
           minX: scrollLeft,
           minY: scrollTop,
@@ -344,7 +360,7 @@ Polymer({
   /**
    * Position the dialog using the coordinates in config. Coordinates are
    * relative to the top-left of the viewport when scrolled to (0, 0).
-   * @param {!ShowConfig} config
+   * @param {!ShowAtPositionConfig} config
    * @private
    */
   positionDialog_: function(config) {