MD History: Scroll history-items into view when their action menu is opened

chrome/browser/resources/md_history/history_list.js

 // Copyright 2015 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.
 
 Polymer({
   is: 'history-list',
 
   behaviors: [HistoryListBehavior],
 
   properties: {
@@ skipping 11 matching lines @@
     // An array of history entries in reverse chronological order.
     historyData_: Array,
 
     lastFocused_: Object,
 
     querying: Boolean,
   },
 
   listeners: {
     'remove-bookmark-stars': 'removeBookmarkStars_',
+    'open-menu': 'onOpenMenu_',
   },
 
   /** @override */
   attached: function() {
     // It is possible (eg, when middle clicking the reload button) for all other
     // resize events to fire before the list is attached and can be measured.
     // Adding another resize here ensures it will get sized correctly.
     /** @type {IronListElement} */ (this.$['infinite-list']).notifyResize();
     this.$['infinite-list'].scrollTarget = this;
     this.$['scroll-threshold'].scrollTarget = this;
@@ skipping 56 matching lines @@
    * @private
    */
   loadMoreData_: function() {
     if (this.resultLoadingDisabled_ || this.querying)
       return;
 
     this.fire('load-more-history');
   },
 
   /**
+   * Ensure that the item is visible in the scroll pane when its menu is
+   * opened (it is possible to open off-screen items using keyboard shortcuts).
+   * @param {Event} e
+   * @private
+   */
+  onOpenMenu_: function(e) {
+    var index = e.detail.index;
+    var list = /** @type {IronListElement} */ (this.$['infinite-list']);
+    if (index < list.firstVisibleIndex || index > list.lastVisibleIndex)
+      list.scrollToIndex(index);
+  },
+
+  /**
    * Check whether the time difference between the given history item and the
    * next one is large enough for a spacer to be required.
    * @param {HistoryEntry} item
    * @param {number} index The index of |item| in |historyData_|.
    * @param {number} length The length of |historyData_|.
    * @return {boolean} Whether or not time gap separator is required.
    * @private
    */
   needsTimeGap_: function(item, index, length) {
     return md_history.HistoryItem.needsTimeGap(
@@ skipping 34 matching lines @@
 
   /**
    * @param {number} index
    * @return {string}
    * @private
    */
   pathForItem_: function(index) {
     return 'historyData_.' + index;
   },
 });