Files app: Add JS module for toolbar_controller.js

Remove the call to Polymer.updateStyles() because this isn't necessary
anymore and Polymer 3 doesn't expose this function in the Polymer
object. It was added for crbug.com/740836. I've tested manually without
this function call and checked the value of  --files-ripple-bg-color in
the #view-button, this variable changed value from white to black when
selecting a file like described in the bug.

Bug: 1133186
Change-Id: Ia955545a60bef11a823b181589a4acaad2e39c06
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2628712
Commit-Queue: Luciano Pacheco <lucmult@chromium.org>
Auto-Submit: Luciano Pacheco <lucmult@chromium.org>
Reviewed-by: Jeremie Boulic <jboulic@chromium.org>
Cr-Commit-Position: refs/heads/master@{#843831}

ui/file_manager/file_manager/foreground/js/BUILD.gn

@@ -68,6 +68,7 @@ js_type_check("closure_compile_jsmodules") {
     ":task_controller.m",
     ":task_history.m",
     ":thumbnail_loader.m",
+    ":toolbar_controller.m",
     ":web_store_utils.m",
     ":webui_command_extender.m",
   ]
@@ -1562,6 +1563,27 @@ js_library("toolbar_controller") {
   ]
 }
 
+js_library("toolbar_controller.m") {
+  sources = [ "$root_gen_dir/ui/file_manager/file_manager/foreground/js/toolbar_controller.m.js" ]
+  deps = [
+    ":directory_model.m",
+    ":file_selection.m",
+    "ui:a11y_announce.m",
+    "ui:file_list_selection_model.m",
+    "ui:list_container.m",
+    "ui:location_line.m",
+    "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
+    "//ui/file_manager/base/js:volume_manager_types.m",
+    "//ui/file_manager/externs:volume_manager.m",
+    "//ui/file_manager/file_manager/common/js:util.m",
+    "//ui/webui/resources/js:assert.m",
+    "//ui/webui/resources/js:util.m",
+    "//ui/webui/resources/js/cr/ui:command.m",
+  ]
+
+  extra_deps = [ ":modulize" ]
+}
+
 js_library("web_store_utils") {
   deps = [ ":constants" ]
 }
@@ -1672,6 +1694,7 @@ js_modulizer("modulize") {
     "selection_menu_controller.js",
     "file_tasks.js",
     "task_controller.js",
+    "toolbar_controller.js",
   ]
 
   namespace_rewrites = cr_namespace_rewrites + [

ui/file_manager/file_manager/foreground/js/toolbar_controller.js

@@ -2,12 +2,27 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+// clang-format off
+// #import {FileListSelectionModel} from './ui/file_list_selection_model.m.js';
+// #import {A11yAnnounce} from './ui/a11y_announce.m.js';
+// #import {VolumeManager} from '../../../externs/volume_manager.m.js';
+// #import {DirectoryModel} from './directory_model.m.js';
+// #import {LocationLine} from './ui/location_line.m.js';
+// #import {ListContainer} from './ui/list_container.m.js';
+// #import {VolumeManagerCommon} from '../../../base/js/volume_manager_types.m.js';
+// #import {util, str, strf} from '../../common/js/util.m.js';
+// #import {FileSelectionHandler} from './file_selection.m.js';
+// #import {Command} from 'chrome://resources/js/cr/ui/command.m.js';
+// #import {assert, assertInstanceof} from 'chrome://resources/js/assert.m.js';
+// #import {queryRequiredElement} from 'chrome://resources/js/util.m.js';
+// clang-format on
+
 /**
  * This class controls wires toolbar UI and selection model. When selection
  * status is changed, this class changes the view of toolbar. If cancel
  * selection button is pressed, this class clears the selection.
  */
-class ToolbarController {
+/* #export */ class ToolbarController {
   /**
    * @param {!HTMLElement} toolbar Toolbar element which contains controls.
    * @param {!HTMLElement} navigationList Navigation list on the left pane. The
@@ -329,9 +344,6 @@ class ToolbarController {
           /** @type {!FileListSelectionModel} */
           (this.directoryModel_.getFileListSelection()).getCheckSelectMode()) {
         bodyClassList.toggle('check-select');
-        // Some custom styles depend on |check-select| class. We need to
-        // re-evaluate the custom styles when the class value is changed.
-        Polymer.updateStyles();
       }
     }
   }

ui/file_manager/file_manager/foreground/js/ui/location_line.js

@@ -11,7 +11,7 @@
 // #import {PathComponent} from '../path_component.m.js';
 // #import {NativeEventTarget as EventTarget} from 'chrome://resources/js/cr/event_target.m.js';
 // #import {metrics} from '../../../common/js/metrics.m.js';
-// #import './breadcrumb.m.js';
+// #import {BreadCrumb} from './breadcrumb.m.js';
 // clang-format on
 
 /**
@@ -90,7 +90,8 @@
   updateNg_(components) {
     this.components_ = Array.from(components);
 
-    let breadcrumbs = document.querySelector('bread-crumb');
+    let breadcrumbs =
+        /** @type {!BreadCrumb} */ (document.querySelector('bread-crumb'));
     if (!breadcrumbs) {
       breadcrumbs = document.createElement('bread-crumb');
       breadcrumbs.id = 'breadcrumbs';