WebUI: Auto-generate grd file for chrome://omnibox.

The |flattenhtml| parameter, which the code previously relied to
inline several icons, is not supported (purposefully) by
generate_grd(). Addressed as follows:

 - icon_tabs.svg: Served from chrome://omnibox/, only used there.
 - cancel_red.svg and check_circle_green.svg: Exposed via
   chrome://resources/ URLs
 - ic_download.svg: Inlined in CSS directly, since this WebUI
   doesn't use <iron-icon>

Bug: 1132403
Change-Id: Ib1738228cc90b193b8534ca9b27d1fb571503f72
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2536152Reviewed-by: Rebekah Potter <rbpotter@chromium.org>
Reviewed-by: manuk hovanesian <manukh@chromium.org>
Commit-Queue: dpapad <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#827954}

chrome/browser/resources/omnibox/BUILD.gn

@@ -5,6 +5,58 @@
 import("//third_party/closure_compiler/closure_args.gni")
 import("//third_party/closure_compiler/compile_js.gni")
 import("//tools/grit/grit_rule.gni")
+import("//ui/webui/resources/tools/generate_grd.gni")
+
+grit("resources") {
+  enable_input_discovery_for_gn_analyze = false
+  source = "$target_gen_dir/resources.grd"
+  deps = [ ":build_grd" ]
+
+  outputs = [
+    "grit/omnibox_resources.h",
+    "grit/omnibox_resources_map.cc",
+    "grit/omnibox_resources_map.h",
+    "omnibox_resources.pak",
+  ]
+  output_dir = "$root_gen_dir/chrome"
+}
+
+generate_grd("build_grd") {
+  grd_prefix = "omnibox"
+  out_grd = "$target_gen_dir/resources.grd"
+  input_files = [
+    "icon_tabs.svg",
+    "omnibox.css",
+    "omnibox_element.js",
+    "omnibox.html",
+    "omnibox_input.css",
+    "omnibox_input.js",
+    "omnibox.js",
+    "omnibox_output_column_widths.css",
+    "omnibox_output.js",
+    "output_results_group.css",
+  ]
+  if (!is_android) {
+    input_files += [
+      "omnibox_popup.html",
+      "omnibox_popup.js",
+    ]
+  }
+  input_files_base_dir = rebase_path(".", "//")
+  grdp_files = [ "$target_gen_dir/mojo_resources.grdp" ]
+  deps = [ ":build_mojo_grdp" ]
+}
+
+generate_grd("build_mojo_grdp") {
+  grd_prefix = "omnibox"
+  out_grd = "$target_gen_dir/mojo_resources.grdp"
+  deps = [ "//chrome/browser/ui/webui/omnibox:mojo_bindings_webui_js" ]
+  input_files = [ "omnibox.mojom-webui.js" ]
+  input_files_base_dir =
+      rebase_path("${root_gen_dir}/mojom-webui/chrome/browser/ui/webui/omnibox",
+                  "$root_build_dir")
+  resource_path_rewrites = [ "omnibox.mojom-webui.js|chrome/browser/ui/webui/omnibox/omnibox.mojom-webui.js" ]
+}
 
 js_type_check("closure_compile") {
   uses_js_modules = true
@@ -53,14 +105,3 @@ js_library("omnibox_popup") {
     "//ui/webui/resources/cr_components/omnibox:cr_autocomplete_match_list",
   ]
 }
-
-grit("resources") {
-  source = "resources.grd"
-
-  outputs = [
-    "grit/omnibox_resources.h",
-    "omnibox_resources.pak",
-  ]
-  output_dir = "$root_gen_dir/chrome"
-  deps = [ "//chrome/browser/ui/webui/omnibox:mojo_bindings_webui_js" ]
-}

chrome/browser/resources/omnibox/omnibox_input.css

@@ -221,15 +221,15 @@ input[type=checkbox] {
 }
 
 .search-icon {
-  background-image: url(../../../../ui/webui/resources/images/icon_search.svg);
+  background-image: url(chrome://resources/images/icon_search.svg);
 }
 
 .reset-icon {
-  background-image: url(../../../../ui/webui/resources/images/icon_refresh.svg);
+  background-image: url(chrome://resources/images/icon_refresh.svg);
 }
 
 .copy-icon {
-  background-image: url(../../../../ui/webui/resources/images/icon_tabs.svg);
+  background-image: url(./icon_tabs.svg);
 }
 
 /* drag */

chrome/browser/resources/omnibox/output_results_group.css

@@ -242,7 +242,8 @@ tbody.head th {
 }
 
 .cell-additional-info a {
-  background-image: url(../../../../third_party/blink/renderer/modules/media_controls/resources/ic_download.svg);
+  /* Inlined version of cr:file-download icon */
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"></path></svg>');
   background-position: center;
   background-repeat: no-repeat;
   background-size: contain;
@@ -267,11 +268,11 @@ tbody.head th {
 }
 
 .check-mark {
-  background-image: url(../../../../ui/webui/resources/images/check_circle_green.svg);
+  background-image: url(chrome://resources/images/check_circle_green.svg);
 }
 
 .x-mark {
-  background-image: url(../../../../ui/webui/resources/images/cancel_red.svg);
+  background-image: url(chrome://resources/images/cancel_red.svg);
 }
 
 /* json cells */

chrome/browser/resources/omnibox/resources.grd

-<?xml version="1.0" encoding="UTF-8"?>
-<grit latest_public_release="0"
-      current_release="1"
-      output_all_resource_defines="false">
-  <outputs>
-    <output filename="grit/omnibox_resources.h" type="rc_header">
-      <emit emit_type='prepend'></emit>
-    </output>
-    <output filename="omnibox_resources.pak" type="data_package" />
-  </outputs>
-  <release seq="1">
-    <includes>
-      <include name="IDR_OMNIBOX_HTML"
-               file="omnibox.html"
-               flattenhtml="true"
-               allowexternalscript="true"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_POPUP_HTML"
-               file="omnibox_popup.html"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_CSS"
-               file="omnibox.css"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_INPUT_CSS"
-               file="omnibox_input.css"
-               type="BINDATA" />
-      <include name="IDR_OUTPUT_RESULTS_GROUP_CSS"
-               file="output_results_group.css"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_OUTPUT_COLUMN_WIDTHS_CSS"
-               file="omnibox_output_column_widths.css"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_ELEMENT_JS"
-               file="omnibox_element.js"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_INPUT_JS"
-               file="omnibox_input.js"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_OUTPUT_JS"
-               file="omnibox_output.js"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_POPUP_JS"
-               file="omnibox_popup.js"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_JS"
-               file="omnibox.js"
-               type="BINDATA" />
-      <include name="IDR_OMNIBOX_MOJO_JS"
-               file="${root_gen_dir}\mojom-webui\chrome\browser\ui\webui\omnibox\omnibox.mojom-webui.js"
-               use_base_dir="false"
-               type="BINDATA" />
-    </includes>
-  </release>
-</grit>

chrome/browser/ui/webui/omnibox/omnibox_ui.cc

@@ -15,11 +15,13 @@
 #include "chrome/browser/ui/webui/webui_util.h"
 #include "chrome/common/url_constants.h"
 #include "chrome/grit/omnibox_resources.h"
+#include "chrome/grit/omnibox_resources_map.h"
 #include "components/omnibox/common/omnibox_features.h"
 #include "content/public/browser/web_ui.h"
 #include "content/public/browser/web_ui_controller.h"
 #include "content/public/browser/web_ui_data_source.h"
 #include "services/network/public/mojom/content_security_policy.mojom.h"
+#include "ui/base/webui/web_ui_util.h"
 
 #if !defined(OS_ANDROID)
 #include "chrome/browser/ui/webui/omnibox/omnibox_popup_handler.h"
@@ -39,28 +41,12 @@ OmniboxUI::OmniboxUI(content::WebUI* web_ui)
   VersionUI::AddVersionDetailStrings(source);
   source->UseStringsJs();
 
-  static constexpr webui::ResourcePath kResources[] = {
-      {"omnibox.css", IDR_OMNIBOX_CSS},
-      {"omnibox_input.css", IDR_OMNIBOX_INPUT_CSS},
-      {"output_results_group.css", IDR_OUTPUT_RESULTS_GROUP_CSS},
-      {"omnibox_output_column_widths.css",
-       IDR_OMNIBOX_OUTPUT_COLUMN_WIDTHS_CSS},
-      {"omnibox_element.js", IDR_OMNIBOX_ELEMENT_JS},
-      {"omnibox_input.js", IDR_OMNIBOX_INPUT_JS},
-      {"omnibox_output.js", IDR_OMNIBOX_OUTPUT_JS},
-      {"omnibox.js", IDR_OMNIBOX_JS},
-      {"chrome/browser/ui/webui/omnibox/omnibox.mojom-webui.js",
-       IDR_OMNIBOX_MOJO_JS},
-  };
-  webui::AddResourcePathsBulk(source, kResources);
-
-  source->SetDefaultResource(IDR_OMNIBOX_HTML);
+  webui::AddResourcePathsBulk(
+      source, base::make_span(kOmniboxResources, kOmniboxResourcesSize));
+  source->SetDefaultResource(IDR_OMNIBOX_OMNIBOX_HTML);
 
 #if !defined(OS_ANDROID)
   if (base::FeatureList::IsEnabled(omnibox::kWebUIOmniboxPopup)) {
-    source->AddResourcePath("omnibox_popup.js", IDR_OMNIBOX_POPUP_JS);
-    source->AddResourcePath("omnibox_popup.html", IDR_OMNIBOX_POPUP_HTML);
-
     popup_handler_ = std::make_unique<OmniboxPopupHandler>();
   }
 #endif

tools/gritsettings/resource_ids.spec

@@ -243,7 +243,8 @@
   "chrome/browser/resources/net_internals/net_internals_resources.grd": {
     "includes": [2120],
   },
-  "chrome/browser/resources/omnibox/resources.grd": {
+  "<(SHARED_INTERMEDIATE_DIR)/chrome/browser/resources/omnibox/resources.grd": {
+    "META": {"sizes": {"includes": [20]}},
     "includes": [2140],
   },
   "<(SHARED_INTERMEDIATE_DIR)/chrome/browser/resources/quota_internals/quota_internals_resources.grd": {

ui/webui/resources/cr_elements_images.grdp

@@ -11,6 +11,10 @@
            file="images/arrow_right.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_BUSINESS" file="images/business.svg"
            type="BINDATA" />
+  <include name="IDR_WEBUI_IMAGES_CANCEL_RED_SVG" file="images/cancel_red.svg"
+           type="BINDATA" />
+  <include name="IDR_WEBUI_IMAGES_CHECK_CIRCLE_GREEN_SVG"
+           file="images/check_circle_green.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_DARK_ARROW_DOWN_SVG"
            file="images/dark/arrow_down.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_DARK_ICON_SEARCH_SVG"