Audio Player: Add the main entry point for JS modules

Add the main entry point for JS modules for Audio Player. Currently it
contains the first two dependencies that have the module generated.

Use this main.m.js generate the JS bundle for Audio Player.

Use preprocess_grit() rules to group all required resources in the same
directory to be able to generate the JS bundle. These are also used to
inline images in CSS files.

Bug: 1133186, 1030998
Change-Id: Ia40deab89d86cbeb9cf0a7855fda7268830fb15d
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2504440
Commit-Queue: Luciano Pacheco <lucmult@chromium.org>
Reviewed-by: Jeremie Boulic <jboulic@chromium.org>
Cr-Commit-Position: refs/heads/master@{#821672}

ui/file_manager/BUILD.gn

@@ -4,6 +4,7 @@
 
 import("//third_party/closure_compiler/compile_js.gni")
 import("//tools/grit/grit_rule.gni")
+import("//tools/grit/preprocess_grit.gni")
 
 grit("resources") {
   source = "file_manager_resources.grd"
@@ -70,3 +71,30 @@ group("unit_test_data") {
     "video_player/js:js_test_gen_html",
   ]
 }
+
+preprocess_folder = "$target_gen_dir/preprocessed"
+
+# Inline images and move files to the preprocessed folder to combine all
+# resources in the same folder to be able to generate the JS bundle.
+# This is for files direct from the src/:  input_folder="./".
+preprocess_grit("preprocess_static") {
+  in_folder = "./"
+  out_folder = preprocess_folder
+
+  in_files = [ "audio_player/js/main.m.js" ]
+
+  deps = [ "//ui/file_manager/audio_player/js:main.m" ]
+}
+
+# This is for files that are generated in "gen/": input_folder=target_gen_dir.
+preprocess_grit("preprocess_generated") {
+  in_folder = target_gen_dir
+  out_folder = preprocess_folder
+
+  in_files = [
+    "base/js/app_util.m.js",
+    "base/js/volume_manager_types.m.js",
+  ]
+
+  deps = [ "//ui/file_manager/base/js:modulize" ]
+}

ui/file_manager/audio_player/js/BUILD.gn

@@ -2,9 +2,18 @@
 # Use of this source code is governed by a BSD-style license that can be
 # found in the LICENSE file.
 
+import("//chrome/browser/resources/optimize_webui.gni")
 import("//third_party/closure_compiler/compile_js.gni")
 
-js_type_check("closure_compile") {
+group("closure_compile") {
+  testonly = true
+  deps = [
+    ":closure_compile_jsmodules",
+    ":closure_compile_legacy",
+  ]
+}
+
+js_type_check("closure_compile_legacy") {
   deps = [
     ":audio_player",
     ":background",
@@ -14,6 +23,11 @@ js_type_check("closure_compile") {
   ]
 }
 
+js_type_check("closure_compile_jsmodules") {
+  uses_js_modules = true
+  deps = [ ":main.m" ]
+}
+
 js_library("closure_compile_externs") {
   sources = []
   externs_list = [
@@ -54,3 +68,29 @@ js_library("metadata_worker") {
     "//ui/file_manager/file_manager/foreground/js/metadata:metadata_dispatcher",
   ]
 }
+
+js_library("main.m") {
+  deps = [
+    "//ui/file_manager/base/js:app_util.m",
+    "//ui/file_manager/base/js:volume_manager_types.m",
+  ]
+}
+
+preprocess_folder =
+    rebase_path("$target_gen_dir/../../preprocessed/audio_player/js",
+                root_build_dir)
+
+optimize_webui("audio_player_bundle") {
+  host = "audio_player"
+
+  input = preprocess_folder
+  js_module_in_files = [ "main.m.js" ]
+
+  js_out_files = [ "main.m.rollup.js" ]
+
+  deps = [
+    ":main.m",
+    "//ui/file_manager:preprocess_generated",
+    "//ui/file_manager:preprocess_static",
+  ]
+}

ui/file_manager/audio_player/js/main.m.js

+// Copyright 2020 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.
+
+/**
+ * @fileoverview Main JS Module for Audio Player. It replaces
+ * audio_player_scripts.js
+ */
+
+import '../../base/js/app_util.m.js';
+import '../../base/js/volume_manager_types.m.js';
+
+console.log('AudioPlayer main.m.js loaded');