MD Settings: Proof of concept, highlighting search matches across Shadow DOM boundaries.

chrome/browser/resources/settings/settings_ui/settings_ui.html

 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-drawer-panel/paper-drawer-panel.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-header-panel/paper-header-panel.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toolbar/paper-toolbar.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classes/iron-flex-layout.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://md-settings/direction_delegate.html">
@@ skipping 128 matching lines @@
       }
 
       .heading {
         -webkit-margin-start: 8px;
       }
 
       paper-drawer-panel:not([narrow]) #main-title {
         display: none;
       }
 
-      paper-icon-button[toggles]:not([active]) + #search-input {
+      paper-icon-button[toggles]:not([active]) + #searchInput {
         display: none;
       }
 
       .last {
         display: flex;
         justify-content: flex-end;
         width: 100%;
       }
     </style>
     <settings-router current-route="{{currentRoute}}"
@@ skipping 12 matching lines @@
         <paper-toolbar class="toolbar">
           <paper-icon-button icon="settings:menu" id="menu-button"
               paper-drawer-toggle>
           </paper-icon-button>
           <div class="heading" id="main-title">
             $i18n{settings}
           </div>
           <div class="last">
             <paper-icon-button icon="cr:search" toggles>
             </paper-icon-button>
-            <paper-input id="search-input" label="$i18n{internalSearch}"
-                no-label-float>
-              <!-- TODO(dschuyler): implement internal search. -->
-              <paper-icon-button suffix icon="cr:cancel">
-              </paper-icon-button>
+            <paper-input id="searchInput" type="search"
+                label="$i18n{internalSearch}" no-label-float>
+              <paper-icon-button suffix icon="cr:cancel"
+                  on-tap="onCancelSearchTap_"></paper-icon-button>
             </paper-input>
           </div>
         </paper-toolbar>
         <settings-main prefs="{{prefs}}" current-route="{{currentRoute}}">
         </settings-main>
       </paper-header-panel>
     </paper-drawer-panel>
   </template>
   <script src="settings_ui.js"></script>
+  <script src="chrome://md-settings/search_settings.js"></script>
 </dom-module>