[MD Bookmarks] Add search.

chrome/browser/resources/md_bookmarks/list.js

Index: chrome/browser/resources/md_bookmarks/list.js
diff --git a/chrome/browser/resources/md_bookmarks/list.js b/chrome/browser/resources/md_bookmarks/list.js
index 426cbb33be433e5dafe803e9ac440ab97314edc7..ae3bcc24a15ec24b6c65cc2d591e6aaf9cf30ecb 100644
--- a/chrome/browser/resources/md_bookmarks/list.js
+++ b/chrome/browser/resources/md_bookmarks/list.js
@@ -8,12 +8,24 @@ Polymer({
   properties: {
     /** @type {BookmarkTreeNode} */
     selectedNode: Object,
+
+    searchTerm: String,

[tsergeant, 2017/01/06 02:43:54]

Is it possible to make it so that the list doesn't need to know about these
things?

Ideally, the store should say "here are the items that need displaying", and the
<bookmark-list> should just go ahead ad display them.

[angelayang, 2017/01/12 05:04:32]

That makes a lot of sense yep

+
+    searchResult: {
+      type: Array,
+    },
+
+    displayedList_: Array,
   },
 
   listeners: {
     'toggle-menu': 'onToggleMenu_'
   },
 
+  observers: [
+    'updateDisplayList_(selectedNode.children, searchResult)',
+  ],
+
   /**
    * @param {Event} e
    * @private
@@ -45,5 +57,15 @@ Polymer({
     var menu = /** @type {!CrActionMenuElement} */ (
         this.$.dropdown);
     menu.close();
-  }
+  },
+
+  /** @private */
+  updateDisplayList_: function() {
+    if (this.searchTerm == '') {
+      this.displayedList_ =
+          /** @type {!Array<!BookmarkTreeNode>} */ (this.selectedNode.children);
+    } else {
+      this.displayedList_ = this.searchResult;
+    }
+  },
 });