[DevTools] Tweak ListControl API.

third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js

Index: third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js
diff --git a/third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js b/third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js
index 3ada5768ff598c8a3a06aef3c86f6c5e007fe0c7..591296771871d72e46bc082075b6e4e9994c93df 100644
--- a/third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js
+++ b/third_party/WebKit/Source/devtools/front_end/quick_open/FilteredListWidget.js
@@ -36,10 +36,9 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
     this._progressBarElement = this._progressElement.createChild('div', 'filtered-list-widget-progress-bar');
 
     /** @type {!UI.ListControl<number>} */
-    this._list = new UI.ListControl(this, UI.ListMode.ViewportFixedItemsMeasured);
+    this._list = new UI.ListControl(this, UI.ListMode.EqualHeightItems);
     this._itemElementsContainer = this._list.element;
     this._itemElementsContainer.classList.add('container');
-    this._itemElementsContainer.addEventListener('click', this._onClick.bind(this), false);
     this._bottomElementsContainer.appendChild(this._itemElementsContainer);
 
     if (delegate.renderMonospace()) {
@@ -137,7 +136,7 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
    * @override
    */
   wasShown() {
-    this._list.fixedHeightChanged();
+    this._list.invalidateItemHeight();
   }
 
   /**
@@ -187,7 +186,13 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
     var subtitleElement = itemElement.createChild('div', 'filtered-list-widget-subtitle');
     subtitleElement.textContent = '\u200B';
     this._delegate.renderItem(item, this._value(), titleElement, subtitleElement);
-
+    itemElement.addEventListener('click', event => {
+      event.consume(true);
+      // Detach dialog before allowing delegate to override focus.
+      if (this._dialog)
+        this._dialog.detach();
+      this._selectItemWithQuery(item, this._value());
+    }, false);
     return itemElement;
   }
 
@@ -197,6 +202,7 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
    * @return {number}
    */
   heightForItem(item) {
+    // Let the list measure items for us.
     return 0;
   }
 
@@ -352,7 +358,7 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
     this._updateNotFoundMessage(!!filteredItems.length);
     this._list.replaceAllItems(filteredItems);
     if (filteredItems.length)
-      this._list.selectItemAtIndex(0, true);
+      this._list.selectItem(filteredItems[0]);
 
     var beforeDialogHeight = this._dialog.element.style.height;
     this._dialog.contentResized();
@@ -394,20 +400,29 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
    * @param {!Event} event
    */
   _onKeyDown(event) {
-    if (this._list.onKeyDown(event)) {
-      event.consume(true);
-      return;
-    }
-
-    switch (event.keyCode) {
-      case UI.KeyboardShortcut.Keys.Enter.code:
+    var handled = false;
+    switch (event.key) {
+      case 'Enter':
         this._onEnter(event);
-        break;
-      case UI.KeyboardShortcut.Keys.Tab.code:
+        return;
+      case 'Tab':
         this._tabKeyPressed();
+        return;
+      case 'ArrowUp':
+        handled = this._list.selectPreviousItem(true, false);
+        break;
+      case 'ArrowDown':
+        handled = this._list.selectNextItem(true, false);
+        break;
+      case 'PageUp':
+        handled = this._list.selectItemPreviousPage(false);
+        break;
+      case 'PageDown':
+        handled = this._list.selectItemNextPage(false);
         break;
-      default:
     }
+    if (handled)
+      event.consume(true);
   }
 
   _scheduleFilter() {
@@ -417,20 +432,6 @@ QuickOpen.FilteredListWidget = class extends UI.VBox {
   }
 
   /**
-   * @param {!Event} event
-   */
-  _onClick(event) {
-    if (!this._list.onClick(event))
-      return;
-
-    event.consume(true);
-    // Detach dialog before allowing delegate to override focus.
-    if (this._dialog)
-      this._dialog.detach();
-    this._selectItemWithQuery(this._list.selectedItem(), this._value());
-  }
-
-  /**
    * @param {?number} itemIndex
    * @param {string} promptValue
    */