WebUI: Use css_to_wrapper() for shared cr_elements/ Polymer styles.

Also passing mwb_shared_icons.ts to html_to_wrapper() instead of html_to_js(), per latest approach for Polymer icons files. Bug: 1322682 Change-Id: I855e00fd6f0b56d8ca6b996bd9b3343e1f0698d4 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3636008 Reviewed-by: John Lee <johntlee@chromium.org> Commit-Queue: Demetrios Papadopoulos <dpapad@chromium.org> Cr-Commit-Position: refs/heads/main@{#1001680}
chromium · May 10, 2022 · acd9769 · acd9769
1 parent 7d70116
commit acd9769
Show file tree

Hide file tree

Showing 45 changed files with 351 additions and 358 deletions.
diff --git a/chrome/browser/resources/bookmarks/folder_node.ts b/chrome/browser/resources/bookmarks/folder_node.ts
@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
-import 'chrome://resources/cr_elements/cr_nav_menu_item_style.js';
+import 'chrome://resources/cr_elements/cr_nav_menu_item_style.css.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import 'chrome://resources/polymer/v3_0/paper-ripple/paper-ripple.js';

diff --git a/chrome/browser/resources/chromeos/bluetooth_pairing_dialog/bluetooth_pairing_dialog.js b/chrome/browser/resources/chromeos/bluetooth_pairing_dialog/bluetooth_pairing_dialog.js
@@ -6,7 +6,7 @@ import 'chrome://resources/cr_components/chromeos/bluetooth/bluetooth_dialog.js'
 import 'chrome://resources/cr_components/chromeos/bluetooth/bluetooth_pairing_ui.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import './strings.m.js';
 
 import {loadTimeData} from '//resources/js/load_time_data.m.js';

diff --git a/chrome/browser/resources/chromeos/internet_config_dialog/BUILD.gn b/chrome/browser/resources/chromeos/internet_config_dialog/BUILD.gn
@@ -31,6 +31,7 @@ if (optimize_webui) {
 
     deps = [
       ":preprocess_generated",
+      "../../../../../ui/webui/resources:library",
       "../../../../../ui/webui/resources:preprocess",
     ]
   }

diff --git a/chrome/browser/resources/chromeos/internet_config_dialog/internet_config_dialog.js b/chrome/browser/resources/chromeos/internet_config_dialog/internet_config_dialog.js
@@ -7,7 +7,7 @@ import 'chrome://resources/cr_components/chromeos/network/network_icon.m.js';
 import 'chrome://resources/cr_components/chromeos/network/network_shared_css.m.js';
 import 'chrome://resources/cr_elements/cr_button/cr_button.m.js';
 import 'chrome://resources/cr_elements/cr_dialog/cr_dialog.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import './strings.m.js';
 

diff --git a/chrome/browser/resources/chromeos/internet_detail_dialog/BUILD.gn b/chrome/browser/resources/chromeos/internet_detail_dialog/BUILD.gn
@@ -35,6 +35,7 @@ if (optimize_webui) {
     deps = [
       ":preprocess",
       ":preprocess_generated",
+      "../../../../../ui/webui/resources:library",
       "../../../../../ui/webui/resources:preprocess",
     ]
   }

diff --git a/chrome/browser/resources/chromeos/internet_detail_dialog/internet_detail_dialog.js b/chrome/browser/resources/chromeos/internet_detail_dialog/internet_detail_dialog.js
@@ -13,7 +13,7 @@ import 'chrome://resources/cr_components/chromeos/network/network_proxy.m.js';
 import 'chrome://resources/cr_components/chromeos/network/network_shared_css.m.js';
 import 'chrome://resources/cr_components/chromeos/network/network_siminfo.m.js';
 import 'chrome://resources/cr_elements/cr_button/cr_button.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/icons.m.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import './strings.m.js';
@@ -27,6 +27,7 @@ import {assert} from 'chrome://resources/js/assert.m.js';
 import {I18nBehavior} from 'chrome://resources/js/i18n_behavior.m.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.m.js';
 import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
 import {InternetDetailDialogBrowserProxy, InternetDetailDialogBrowserProxyImpl} from './internet_detail_dialog_browser_proxy.js';
 
 /**

diff --git a/chrome/browser/resources/chromeos/set_time_dialog/set_time_dialog.js b/chrome/browser/resources/chromeos/set_time_dialog/set_time_dialog.js
@@ -14,7 +14,7 @@
 
 import 'chrome://resources/cr_elements/cr_button/cr_button.m.js';
 import 'chrome://resources/cr_elements/cr_dialog/cr_dialog.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/md_select_css.m.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import './strings.m.js';

diff --git a/chrome/browser/resources/downloads/manager.ts b/chrome/browser/resources/downloads/manager.ts
@@ -7,7 +7,7 @@ import './item.js';
 import './toolbar.js';
 import 'chrome://resources/cr_components/managed_footnote/managed_footnote.js';
 import 'chrome://resources/cr_elements/cr_button/cr_button.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/hidden_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';

diff --git a/chrome/browser/resources/history/side_bar.ts b/chrome/browser/resources/history/side_bar.ts
@@ -5,7 +5,7 @@
 import 'chrome://resources/cr_components/managed_footnote/managed_footnote.js';
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
 import 'chrome://resources/cr_elements/cr_menu_selector/cr_menu_selector.js';
-import 'chrome://resources/cr_elements/cr_nav_menu_item_style.js';
+import 'chrome://resources/cr_elements/cr_nav_menu_item_style.css.js';
 import 'chrome://resources/cr_elements/icons.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import 'chrome://resources/polymer/v3_0/iron-icon/iron-icon.js';

diff --git a/chrome/browser/resources/management/management_ui.ts b/chrome/browser/resources/management/management_ui.ts
@@ -4,7 +4,7 @@
 
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/cr_toolbar/cr_toolbar.js';
 import 'chrome://resources/cr_elements/hidden_style_css.m.js';
 import 'chrome://resources/cr_elements/icons.m.js';

diff --git a/chrome/browser/resources/print_preview/ui/advanced_settings_item.ts b/chrome/browser/resources/print_preview/ui/advanced_settings_item.ts
@@ -5,7 +5,7 @@
 import 'chrome://resources/cr_elements/hidden_style_css.m.js';
 import 'chrome://resources/cr_elements/cr_checkbox/cr_checkbox.m.js';
 import 'chrome://resources/cr_elements/cr_input/cr_input.m.js';
-import 'chrome://resources/cr_elements/search_highlight_style_css.js';
+import 'chrome://resources/cr_elements/search_highlight_style.css.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import 'chrome://resources/cr_elements/md_select_css.m.js';
 import './print_preview_shared_css.js';

diff --git a/chrome/browser/resources/settings/chromeos/os_settings_ui/os_settings_ui.js b/chrome/browser/resources/settings/chromeos/os_settings_ui/os_settings_ui.js
@@ -12,7 +12,7 @@
  */
 import '//resources/polymer/v3_0/iron-icon/iron-icon.js';
 import '//resources/cr_elements/cr_drawer/cr_drawer.js';
-import '//resources/cr_elements/cr_page_host_style_css.js';
+import '//resources/cr_elements/cr_page_host_style.css.js';
 import '//resources/cr_elements/icons.m.js';
 import '//resources/cr_elements/shared_vars_css.m.js';
 import '../os_settings_menu/os_settings_menu.js';

diff --git a/chrome/browser/resources/settings/privacy_sandbox/app.ts b/chrome/browser/resources/settings/privacy_sandbox/app.ts
@@ -1,7 +1,7 @@
 // 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.
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/shared_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import './icons.js';

diff --git a/chrome/browser/resources/settings/settings_menu/settings_menu.ts b/chrome/browser/resources/settings/settings_menu/settings_menu.ts
@@ -8,7 +8,7 @@
  */
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
 import 'chrome://resources/cr_elements/cr_menu_selector/cr_menu_selector.js';
-import 'chrome://resources/cr_elements/cr_nav_menu_item_style.js';
+import 'chrome://resources/cr_elements/cr_nav_menu_item_style.css.js';
 import 'chrome://resources/cr_elements/icons.m.js';
 import 'chrome://resources/polymer/v3_0/iron-icon/iron-icon.js';
 import 'chrome://resources/polymer/v3_0/iron-selector/iron-selector.js';

diff --git a/chrome/browser/resources/settings/settings_shared_css.ts b/chrome/browser/resources/settings/settings_shared_css.ts
@@ -5,7 +5,7 @@
 // <if expr="chromeos_ash">
 import '//resources/cr_elements/chromeos/cros_color_overrides.m.js';
 // </if>
-import '//resources/cr_elements/search_highlight_style_css.js';
+import '//resources/cr_elements/search_highlight_style.css.js';
 import '//resources/cr_elements/shared_vars_css.m.js';
 import '//resources/cr_elements/shared_style_css.m.js';
 import './settings_vars_css.js';

diff --git a/chrome/browser/resources/settings/settings_ui/settings_ui.ts b/chrome/browser/resources/settings/settings_ui/settings_ui.ts
@@ -13,7 +13,7 @@
 import 'chrome://resources/cr_elements/cr_drawer/cr_drawer.js';
 import 'chrome://resources/cr_elements/cr_toolbar/cr_toolbar.js';
 import 'chrome://resources/cr_elements/cr_toolbar/cr_toolbar_search_field.js';
-import 'chrome://resources/cr_elements/cr_page_host_style_css.js';
+import 'chrome://resources/cr_elements/cr_page_host_style.css.js';
 import 'chrome://resources/cr_elements/icons.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import 'chrome://resources/polymer/v3_0/paper-styles/color.js';

diff --git a/chrome/browser/resources/side_panel/bookmarks/bookmark_folder.ts b/chrome/browser/resources/side_panel/bookmarks/bookmark_folder.ts
@@ -4,7 +4,7 @@
 
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
-import 'chrome://resources/cr_elements/mwb_element_shared_style.js';
+import 'chrome://resources/cr_elements/mwb_element_shared_style.css.js';
 
 import {getFaviconForPageURL} from 'chrome://resources/js/icon.js';
 import {DomRepeatEvent, html, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';

diff --git a/chrome/browser/resources/side_panel/reading_list/app.ts b/chrome/browser/resources/side_panel/reading_list/app.ts
@@ -6,9 +6,9 @@ import 'chrome://resources/cr_elements/cr_button/cr_button.m.js';
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/hidden_style_css.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
-import 'chrome://resources/cr_elements/mwb_element_shared_style.js';
-import 'chrome://resources/cr_elements/mwb_shared_style.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_element_shared_style.css.js';
+import 'chrome://resources/cr_elements/mwb_shared_style.css.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 import 'chrome://resources/polymer/v3_0/iron-selector/iron-selector.js';
 import './reading_list_item.js';
 import '../strings.m.js';

diff --git a/chrome/browser/resources/side_panel/reading_list/reading_list.html b/chrome/browser/resources/side_panel/reading_list/reading_list.html
@@ -22,7 +22,7 @@
 <body>
   <reading-list-app></reading-list-app>
   <script type="module" src="reading_list/app.js"></script>
-  <script type="module" src="chrome://resources/cr_elements/mwb_shared_vars.js">
+  <script type="module" src="chrome://resources/cr_elements/mwb_shared_vars.css.js">
   </script>
 </body>
 </html>
diff --git a/chrome/browser/resources/side_panel/reading_list/reading_list_item.ts b/chrome/browser/resources/side_panel/reading_list/reading_list_item.ts
@@ -5,8 +5,8 @@
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
 import 'chrome://resources/cr_elements/icons.m.js';
-import 'chrome://resources/cr_elements/mwb_element_shared_style.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_element_shared_style.css.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import './icons.js';
 

diff --git a/chrome/browser/resources/tab_search/app.ts b/chrome/browser/resources/tab_search/app.ts
@@ -4,9 +4,9 @@
 
 import 'chrome://resources/cr_elements/cr_expand_button/cr_expand_button.m.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
-import 'chrome://resources/cr_elements/mwb_element_shared_style.js';
-import 'chrome://resources/cr_elements/mwb_shared_style.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_element_shared_style.css.js';
+import 'chrome://resources/cr_elements/mwb_shared_style.css.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 import 'chrome://resources/polymer/v3_0/iron-icon/iron-icon.js';
 import 'chrome://resources/polymer/v3_0/iron-iconset-svg/iron-iconset-svg.js';
 import './infinite_list.js';
@@ -22,8 +22,8 @@ import {listenOnce} from 'chrome://resources/js/util.m.js';
 import {Token} from 'chrome://resources/mojo/mojo/public/mojom/base/token.mojom-webui.js';
 import {IronA11yAnnouncer} from 'chrome://resources/polymer/v3_0/iron-a11y-announcer/iron-a11y-announcer.js';
 import {DomRepeatEvent, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
-import {getTemplate} from './app.html.js';
 
+import {getTemplate} from './app.html.js';
 import {fuzzySearch, FuzzySearchOptions} from './fuzzy_search.js';
 import {InfiniteList, NO_SELECTION, selectorNavigationKeys} from './infinite_list.js';
 import {ariaLabel, ItemData, TabData, TabGroupData, TabItemType, tokenEquals, tokenToString} from './tab_data.js';

diff --git a/chrome/browser/resources/tab_search/tab_search.html b/chrome/browser/resources/tab_search/tab_search.html
@@ -26,7 +26,7 @@
 <body>
   <tab-search-app></tab-search-app>
   <script type="module" src="tab_search.js"></script>
-  <script type="module" src="chrome://resources/cr_elements/mwb_shared_vars.js">
+  <script type="module" src="chrome://resources/cr_elements/mwb_shared_vars.css.js">
   </script>
 </body>
 </html>
diff --git a/chrome/browser/resources/tab_search/tab_search_group_item.ts b/chrome/browser/resources/tab_search/tab_search_group_item.ts
@@ -4,8 +4,8 @@
 
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
-import 'chrome://resources/cr_elements/mwb_shared_icons.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_shared_icons.html.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 
 import {MouseHoverableMixin} from 'chrome://resources/cr_elements/mouse_hoverable_mixin.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.m.js';

diff --git a/chrome/browser/resources/tab_search/tab_search_item.ts b/chrome/browser/resources/tab_search/tab_search_item.ts
@@ -4,8 +4,8 @@
 
 import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js';
 import 'chrome://resources/cr_elements/cr_icons_css.m.js';
-import 'chrome://resources/cr_elements/mwb_shared_icons.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_shared_icons.html.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import './strings.m.js';
 

diff --git a/chrome/browser/resources/tab_search/tab_search_search_field.ts b/chrome/browser/resources/tab_search/tab_search_search_field.ts
@@ -2,14 +2,15 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import 'chrome://resources/cr_elements/mwb_shared_icons.js';
-import 'chrome://resources/cr_elements/mwb_shared_vars.js';
+import 'chrome://resources/cr_elements/mwb_shared_icons.html.js';
+import 'chrome://resources/cr_elements/mwb_shared_vars.css.js';
 import 'chrome://resources/cr_elements/shared_vars_css.m.js';
 import 'chrome://resources/polymer/v3_0/iron-icon/iron-icon.js';
 
 import {CrSearchFieldMixin} from 'chrome://resources/cr_elements/cr_search_field/cr_search_field_mixin.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.m.js';
 import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
 import {getTemplate} from './tab_search_search_field.html.js';
 
 const TabSearchSearchFieldBase = CrSearchFieldMixin(PolymerElement);

diff --git a/chrome/browser/resources/webui_gallery/app.ts b/chrome/browser/resources/webui_gallery/app.ts
@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 import '//resources/cr_elements/cr_menu_selector/cr_menu_selector.js';
-import '//resources/cr_elements/cr_nav_menu_item_style.js';
+import '//resources/cr_elements/cr_nav_menu_item_style.css.js';
 import '//resources/polymer/v3_0/iron-selector/iron-selector.js';
 
 import {assert} from '//resources/js/assert_ts.js';

diff --git a/ui/webui/resources/BUILD.gn b/ui/webui/resources/BUILD.gn
@@ -262,7 +262,6 @@ if (include_polymer) {
     "cr_elements/cr_actionable_row_style.m.js",
     "cr_elements/cr_icons_css.m.js",
     "cr_elements/cr_input/cr_input_style_css.m.js",
-    "cr_elements/cr_page_host_style_css.js",
     "cr_elements/cr_radio_button/cr_radio_button_style_css.m.js",
     "cr_elements/hidden_style_css.m.js",
     "cr_elements/icons.m.js",
@@ -344,7 +343,8 @@ ts_library("library") {
       "cr_elements/cr_link_row/cr_link_row.html.ts",
       "cr_elements/cr_link_row/cr_link_row.ts",
       "cr_elements/cr_menu_selector/cr_menu_selector.ts",
-      "cr_elements/cr_nav_menu_item_style.ts",
+      "cr_elements/cr_nav_menu_item_style.css.ts",
+      "cr_elements/cr_page_host_style.css.ts",
       "cr_elements/cr_profile_avatar_selector/cr_profile_avatar_selector_grid.html.ts",
       "cr_elements/cr_profile_avatar_selector/cr_profile_avatar_selector_grid.ts",
       "cr_elements/cr_profile_avatar_selector/cr_profile_avatar_selector.html.ts",
@@ -371,11 +371,11 @@ ts_library("library") {
       "cr_elements/cr_view_manager/cr_view_manager.ts",
       "cr_elements/find_shortcut_mixin.ts",
       "cr_elements/mouse_hoverable_mixin.ts",
-      "cr_elements/mwb_element_shared_style.ts",
-      "cr_elements/mwb_shared_icons.ts",
-      "cr_elements/mwb_shared_style.ts",
-      "cr_elements/mwb_shared_vars.ts",
-      "cr_elements/search_highlight_style_css.ts",
+      "cr_elements/mwb_element_shared_style.css.ts",
+      "cr_elements/mwb_shared_icons.html.ts",
+      "cr_elements/mwb_shared_style.css.ts",
+      "cr_elements/mwb_shared_vars.css.ts",
+      "cr_elements/search_highlight_style.css.ts",
       "js/i18n_mixin.ts",
       "js/list_property_update_mixin.ts",
       "js/web_ui_listener_mixin.ts",