MD Bookmarks: Enable the delete button in the toolbar overlay

The Delete button in the overlay which appears when selecting more than
one item will now delete all selected items when clicked.

BUG=692827
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2893833002
Cr-Commit-Position: refs/heads/master@{#473835}
diff --git a/chrome/browser/resources/md_bookmarks/compiled_resources2.gyp b/chrome/browser/resources/md_bookmarks/compiled_resources2.gyp
index 51091a7..c4b7645 100644
--- a/chrome/browser/resources/md_bookmarks/compiled_resources2.gyp
+++ b/chrome/browser/resources/md_bookmarks/compiled_resources2.gyp
@@ -150,6 +150,7 @@
         '<(DEPTH)/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp:cr_toolbar',
         '<(EXTERNS_GYP):bookmark_manager_private',
         '<(EXTERNS_GYP):chrome_extensions',
+        'command_manager',
         'edit_dialog',
         'store_client',
       ],
diff --git a/chrome/browser/resources/md_bookmarks/toolbar.html b/chrome/browser/resources/md_bookmarks/toolbar.html
index 1d691605..ee3e8d67 100644
--- a/chrome/browser/resources/md_bookmarks/toolbar.html
+++ b/chrome/browser/resources/md_bookmarks/toolbar.html
@@ -88,6 +88,7 @@
       <cr-toolbar-selection-overlay delete-label="$i18n{delete}"
           cancel-label="$i18n{cancel}"
           selection-label="[[getItemsSelectedString_(selectedCount_)]]"
+          on-delete-selected-items="onDeleteSelectionTap_"
           on-clear-selected-items="onClearSelectionTap_">
       </cr-toolbar-selection-overlay>
     </template>
diff --git a/chrome/browser/resources/md_bookmarks/toolbar.js b/chrome/browser/resources/md_bookmarks/toolbar.js
index 3ebeb2d5..bc48904 100644
--- a/chrome/browser/resources/md_bookmarks/toolbar.js
+++ b/chrome/browser/resources/md_bookmarks/toolbar.js
@@ -99,6 +99,14 @@
   },
 
   /** @private */
+  onDeleteSelectionTap_: function() {
+    var selection = this.getState().selection.items;
+    var commandManager = bookmarks.CommandManager.getInstance();
+    assert(commandManager.canExecute(Command.DELETE, selection));
+    commandManager.handle(Command.DELETE, selection);
+  },
+
+  /** @private */
   onClearSelectionTap_: function() {
     this.dispatch(bookmarks.actions.deselectItems());
   },
diff --git a/chrome/test/data/webui/md_bookmarks/command_manager_test.js b/chrome/test/data/webui/md_bookmarks/command_manager_test.js
index d103eafa..e4d82ea 100644
--- a/chrome/test/data/webui/md_bookmarks/command_manager_test.js
+++ b/chrome/test/data/webui/md_bookmarks/command_manager_test.js
@@ -8,14 +8,6 @@
   var lastCommand;
   var lastCommandIds;
 
-  function assertLastCommand(command, ids) {
-    assertEquals(lastCommand, command);
-    if (ids)
-      assertDeepEquals(normalizeSet(lastCommandIds), ids);
-    lastCommand = null;
-    lastCommandIds = null;
-  }
-
   suiteSetup(function() {
     // Overwrite bookmarkManagerPrivate APIs which will crash if called with
     // fake data.
@@ -49,14 +41,7 @@
     });
     bookmarks.Store.instance_ = store;
 
-    commandManager = document.createElement('bookmarks-command-manager');
-
-    var realHandle = commandManager.handle.bind(commandManager);
-    commandManager.handle = function(command, itemIds) {
-      lastCommand = command;
-      lastCommandIds = itemIds;
-      realHandle(command, itemIds);
-    };
+    commandManager = new TestCommandManager();
     replaceBody(commandManager);
 
     Polymer.dom.flush();
@@ -92,21 +77,21 @@
     store.notifyObservers();
 
     MockInteractions.pressAndReleaseKeyOn(document, 67, modifier, 'c');
-    assertLastCommand('copy', ['13']);
+    commandManager.assertLastCommand('copy', ['13']);
 
     // Doesn't trigger when a folder is selected.
     store.data.selection.items = new Set(['11']);
     store.notifyObservers();
 
     MockInteractions.pressAndReleaseKeyOn(document, 67, modifier, 'c');
-    assertLastCommand(null);
+    commandManager.assertLastCommand(null);
 
     // Doesn't trigger when nothing is selected.
     store.data.selection.items = new Set();
     store.notifyObservers();
 
     MockInteractions.pressAndReleaseKeyOn(document, 67, modifier, 'c');
-    assertLastCommand(null);
+    commandManager.assertLastCommand(null);
   });
 
   test('delete command triggers', function() {
@@ -114,7 +99,7 @@
     store.notifyObservers();
 
     MockInteractions.pressAndReleaseKeyOn(document, 46, '', 'Delete');
-    assertLastCommand('delete', ['12', '13']);
+    commandManager.assertLastCommand('delete', ['12', '13']);
   });
 
   test('edit command triggers', function() {
@@ -125,7 +110,7 @@
     store.notifyObservers();
 
     MockInteractions.pressAndReleaseKeyOn(document, keyCode, '', key);
-    assertLastCommand('edit', ['11']);
+    commandManager.assertLastCommand('edit', ['11']);
   });
 
   test('does not delete children at same time as ancestor', function() {
@@ -159,7 +144,7 @@
     };
 
     MockInteractions.pressAndReleaseKeyOn(document, 13, 'shift', 'Enter');
-    assertLastCommand(Command.OPEN_NEW_WINDOW, ['12', '13']);
+    commandManager.assertLastCommand(Command.OPEN_NEW_WINDOW, ['12', '13']);
     assertDeepEquals(['http://121/', 'http://13/'], lastCreate.url);
     assertFalse(lastCreate.incognito);
   });
diff --git a/chrome/test/data/webui/md_bookmarks/md_bookmarks_browsertest.js b/chrome/test/data/webui/md_bookmarks/md_bookmarks_browsertest.js
index 9c017d5..d36ae63 100644
--- a/chrome/test/data/webui/md_bookmarks/md_bookmarks_browsertest.js
+++ b/chrome/test/data/webui/md_bookmarks/md_bookmarks_browsertest.js
@@ -22,6 +22,7 @@
                          switchValue: 'MaterialDesignBookmarks'}],
 
   extraLibraries: PolymerTest.getLibraries(ROOT_PATH).concat([
+    'test_command_manager.js',
     'test_store.js',
     'test_util.js',
   ]),
diff --git a/chrome/test/data/webui/md_bookmarks/test_command_manager.js b/chrome/test/data/webui/md_bookmarks/test_command_manager.js
new file mode 100644
index 0000000..7dbc9707
--- /dev/null
+++ b/chrome/test/data/webui/md_bookmarks/test_command_manager.js
@@ -0,0 +1,31 @@
+// Copyright 2017 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.
+
+/**
+ * Creates and returns a CommandManager which tracks what commands are executed.
+ * @constructor
+ * @extends {bookmarks.CommandManager}
+ */
+function TestCommandManager() {
+  var commandManager = document.createElement('bookmarks-command-manager');
+  var lastCommand = null;
+  var lastCommandIds = null;
+
+  var realHandle = commandManager.handle.bind(commandManager);
+  commandManager.handle = function(command, itemIds) {
+    lastCommand = command;
+    lastCommandIds = itemIds;
+    realHandle(command, itemIds);
+  };
+
+  commandManager.assertLastCommand = function (command, ids) {
+    assertEquals(command, lastCommand);
+    if (ids)
+      assertDeepEquals(ids, normalizeSet(lastCommandIds));
+    lastCommand = null;
+    lastCommandIds = null;
+  };
+
+  return commandManager;
+}
diff --git a/chrome/test/data/webui/md_bookmarks/toolbar_test.js b/chrome/test/data/webui/md_bookmarks/toolbar_test.js
index 1cd78ff..8e5d470 100644
--- a/chrome/test/data/webui/md_bookmarks/toolbar_test.js
+++ b/chrome/test/data/webui/md_bookmarks/toolbar_test.js
@@ -5,6 +5,11 @@
 suite('<bookmarks-toolbar>', function() {
   var toolbar;
   var store;
+  var commandManager;
+
+  suiteSetup(function() {
+    chrome.bookmarkManagerPrivate.removeTrees = function() {};
+  });
 
   setup(function() {
     store = new bookmarks.TestStore({
@@ -21,6 +26,9 @@
 
     toolbar = document.createElement('bookmarks-toolbar');
     replaceBody(toolbar);
+
+    commandManager = new TestCommandManager();
+    document.body.appendChild(commandManager);
   });
 
   test('selecting multiple items shows toolbar overlay', function() {
@@ -34,4 +42,15 @@
     store.notifyObservers();
     assertTrue(toolbar.showSelectionOverlay);
   });
+
+  test('clicking overlay delete button triggers a delete command', function() {
+    store.data.selection.items = new Set(['2', '3']);
+    store.notifyObservers();
+
+    Polymer.dom.flush();
+    MockInteractions.tap(
+        toolbar.$$('cr-toolbar-selection-overlay').deleteButton);
+
+    commandManager.assertLastCommand(Command.DELETE, ['2', '3']);
+  });
 });
diff --git a/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp b/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp
index 412222a..48f54b9 100644
--- a/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp
+++ b/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp
@@ -13,6 +13,9 @@
     {
       'target_name': 'cr_toolbar_selection_overlay',
       'includes': ['../../../../../third_party/closure_compiler/compile_js2.gypi'],
+      'dependencies': [
+        '<(DEPTH)/third_party/polymer/v1_0/components-chromium/paper-button/compiled_resources2.gyp:paper-button-extracted',
+      ],
     },
     {
       'target_name': 'cr_toolbar',
diff --git a/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html b/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html
index 1b25f52c..16413e1 100644
--- a/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html
+++ b/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html
@@ -51,7 +51,7 @@
       <paper-button on-tap="onClearSelectionTap_">
         [[cancelLabel]]
       </paper-button>
-      <paper-button on-tap="onDeleteTap_">
+      <paper-button id="delete" on-tap="onDeleteTap_">
         [[deleteLabel]]
       </paper-button>
     </div>
diff --git a/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.js b/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.js
index f9f7547..832b81d8 100644
--- a/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.js
+++ b/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.js
@@ -19,6 +19,11 @@
     selectionLabel: String,
   },
 
+  /** @return {PaperButtonElement} */
+  get deleteButton() {
+    return this.$.delete;
+  },
+
   /** @private */
   onClearSelectionTap_: function() {
     this.fire('clear-selected-items');