[web-ui settings] Fixes and improvements for settings page searching.

chrome/browser/resources/options/extension_list.js

 // Copyright (c) 2011 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.
 
 cr.define('options', function() {
   'use strict';
 
   /**
    * A lookup helper function to find the first node that has an id (starting
    * at |node| and going up the parent chain).
@@ skipping 43 matching lines @@
         toggleSection.classList.add('dev-open');
         toggleSection.classList.remove('dev-closed');
         toggleButton.checked = true;
       } else {
         toggleSection.classList.remove('dev-open');
         toggleSection.classList.add('dev-closed');
       }
 
       // Instal global event handlers.
       if (!handlersInstalled) {
-        this.ownerDocument.addEventListener('keyup',
-                                            this.upEventHandler_.bind(this));
-        this.ownerDocument.addEventListener('mouseup',
-                                            this.upEventHandler_.bind(this));
+        var searchPage = SearchPage.getInstance();
+        searchPage.addEventListener('searchChanged',
+                                    this.searchChangedHandler_.bind(this));
 
         // Support full keyboard accessibility without making things ugly
         // for users who click, by hiding some focus outlines when the user
         // clicks anywhere, but showing them when the user presses any key.
         this.ownerDocument.body.classList.add('hide-some-focus-outlines');
         this.ownerDocument.addEventListener('click', (function(e) {
           this.ownerDocument.body.classList.add('hide-some-focus-outlines');
           return true;
         }).bind(this), true);
         this.ownerDocument.addEventListener('keydown', (function(e) {
@@ skipping 563 matching lines @@
             var detailsControls = details.querySelectorAll('a, input');
             for (var i = 0; i < detailsControls.length; i++)
               detailsControls[i].tabIndex = 0;
           }
         }
         iter = iter.nextSibling;
       }
     },
 
     /**
-     * Handles the mouse-up and keyboard-up events. This is used to limit the
-     * number of items to show in the list, when the user is searching for items
-     * with the search box. Otherwise, if one match is found, the whole list of
+     * Handles the 'searchChanged' event. This is used to limit the number of
+     * items to show in the list, when the user is searching for items with the
+     * search box. Otherwise, if one match is found, the whole list of
      * extensions would be shown when we only want the matching items to be
      * found.
      * @param {Event} e Change event.
      * @private
      */
-    upEventHandler_: function(e) {
-      var searchString = $('search-field').value.toLowerCase();
+    searchChangedHandler_: function(e) {
+      var searchString = e.searchText;
       var child = this.firstChild;
-      while (child){
+      while (child) {
         var extension = this.getExtensionWithId_(child.id);
         if (searchString.length == 0) {
           // Show all.
           child.classList.remove('search-suppress');
         } else {
           // If the search string does not appear within the text of the
           // extension, then hide it.
           if ((extension.name.toLowerCase().indexOf(searchString) < 0) &&
               (extension.version.toLowerCase().indexOf(searchString) < 0) &&
               (extension.description.toLowerCase().indexOf(searchString) < 0)) {
@@ skipping 107 matching lines @@
           ]);
         }
       }
     },
   };
 
   return {
     ExtensionsList: ExtensionsList
   };
 });