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

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

Index: chrome/browser/resources/settings/settings_ui/settings_ui.html
diff --git a/chrome/browser/resources/settings/settings_ui/settings_ui.html b/chrome/browser/resources/settings/settings_ui/settings_ui.html
index 5b527c4daa56bee2d7ab01adcd03076d8d3564ab..81bab458e5d504c57bf35482f6a51e54cd8504e7 100644
--- a/chrome/browser/resources/settings/settings_ui/settings_ui.html
+++ b/chrome/browser/resources/settings/settings_ui/settings_ui.html
@@ -146,7 +146,7 @@
         display: none;
       }
 
-      paper-icon-button[toggles]:not([active]) + #search-input {
+      paper-icon-button[toggles]:not([active]) + #searchInput {
         display: none;
       }
 
@@ -179,11 +179,10 @@
           <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>
@@ -193,4 +192,5 @@
     </paper-drawer-panel>
   </template>
   <script src="settings_ui.js"></script>
+  <script src="chrome://md-settings/search_settings.js"></script>
 </dom-module>