Polymer3: Stop using flattenhtml from Settings resources.

flattenhtml is sub-optimal for a few reasons:

1) Makes the HTML code being evaluated larger than necessary.
   For example when both light and dark mode images are inlined,
   they increase the HTML code size, even though only one of the
   two is used at a given moment.
2) flattenhtml does not work with Polymer3 (polymer_modulizer).

Instead, images are registered with the Settings data source, so
that they can be served by dedicated URLs for example from
chrome://settings/images/cookies_banner.svg

Bug: 1026426
Change-Id: I0c77b3bad2f27e9c810833aa153faab884954775
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2095555
Commit-Queue: dpapad <dpapad@chromium.org>
Reviewed-by: Rebekah Potter <rbpotter@chromium.org>
Cr-Commit-Position: refs/heads/master@{#748863}

chrome/browser/resources/settings/people_page/sync_account_control.html

@@ -119,7 +119,7 @@
       }
 
       #banner {
-        background: url(../images/sync_banner.svg) no-repeat;
+        background: url(chrome://settings/images/sync_banner.svg) no-repeat;
         background-size: 100% auto;
         display: none;
         padding-top: calc(120 / 680 * 100%); /* Keep background ratio. */
@@ -127,7 +127,7 @@
 
       @media (prefers-color-scheme: dark) {
         #banner {
-          background-image: url(../images/sync_banner_dark.svg);
+          background-image: url(chrome://settings/images/sync_banner_dark.svg);
         }
       }
 

chrome/browser/resources/settings/privacy_page/cookies_page.html

@@ -35,7 +35,7 @@
         padding-inline-start: var(--cr-button-edge-spacing);
       }
     </style>
-    <img src="../images/cookies_banner.svg">
+    <img src="chrome://settings/images/cookies_banner.svg">
     <div class="settings-box block first">
       <h2>$i18n{cookiePageGeneralControls}</h2>
       <cr-radio-group selected="[[selectCookiesControlRadio_]]"

chrome/browser/resources/settings/settings_resources.grd

@@ -500,6 +500,18 @@
                  file="icons.html"
                  type="chrome_html"
                  preprocess="true" />
+      <structure name="IDR_SETTINGS_IMAGES_COOKIES_BANNER_SVG"
+                 file="images/cookies_banner.svg"
+                 type="chrome_html" />
+      <structure name="IDR_SETTINGS_IMAGES_SAFE_BROWSING_BANNER_SVG"
+                 file="images/safe_browsing_banner.svg"
+                 type="chrome_html" />
+      <structure name="IDR_SETTINGS_IMAGES_SYNC_BANNER_SVG"
+                 file="images/sync_banner.svg"
+                 type="chrome_html" />
+      <structure name="IDR_SETTINGS_IMAGES_SYNC_BANNER_DARK_SVG"
+                 file="images/sync_banner_dark.svg"
+                 type="chrome_html" />
       <structure name="IDR_SETTINGS_RESET_PAGE_HTML"
                  file="reset_page/reset_page.html"
                  type="chrome_html"
@@ -693,21 +705,19 @@
       <structure name="IDR_SETTINGS_PEOPLE_PAGE_HTML"
                  file="people_page/people_page.html"
                  type="chrome_html"
-                 flattenhtml="true"
-                 allowexternalscript="true" />
+                 preprocess="true" />
       <structure name="IDR_SETTINGS_PEOPLE_PAGE_JS"
                  file="people_page/people_page.js"
                  type="chrome_html"
                  preprocess="true" />
       <structure name="IDR_SETTINGS_PEOPLE_PAGE_SYNC_ACCOUNT_CONTROL_HTML"
-                  file="people_page/sync_account_control.html"
-                  type="chrome_html"
-                  flattenhtml="true"
-                  allowexternalscript="true" />
+                 file="people_page/sync_account_control.html"
+                 type="chrome_html"
+                 preprocess="true" />
       <structure name="IDR_SETTINGS_PEOPLE_PAGE_SYNC_ACCOUNT_CONTROL_JS"
-                  file="people_page/sync_account_control.js"
-                  type="chrome_html"
-                  preprocess="true" />
+                 file="people_page/sync_account_control.js"
+                 type="chrome_html"
+                 preprocess="true" />
       <if expr="not chromeos">
         <structure name="IDR_SETTINGS_PEOPLE_PAGE_IMPORT_DATA_DIALOG_HTML"
                    file="people_page/import_data_dialog.html"
@@ -836,12 +846,10 @@
       <structure name="IDR_SETTINGS_COOKIES_PAGE_HTML"
                  file="privacy_page/cookies_page.html"
                  type="chrome_html"
-                 flattenhtml= "true"
-                 allowexternalscript= "true" />
+                 preprocess="true" />
       <structure name="IDR_SETTINGS_COOKIES_PAGE_JS"
                  file="privacy_page/cookies_page.js"
-                 type="chrome_html"
-                 preprocess="true" />
+                 type="chrome_html" />
       <structure name="IDR_SETTINGS_DO_NOT_TRACK_TOGGLE_HTML"
                  file="privacy_page/do_not_track_toggle.html"
                  type="chrome_html" />
@@ -884,17 +892,16 @@
                  type="chrome_html" />
       <structure name="IDR_SETTINGS_SECURITY_PAGE_HTML"
                  file="privacy_page/security_page.html"
-                 type="chrome_html"
-                 preprocess="true" />
+                 preprocess="true"
+                 type="chrome_html" />
       <structure name="IDR_SETTINGS_SECURITY_PAGE_JS"
                  file="privacy_page/security_page.js"
                  type="chrome_html"
                  preprocess="true" />
       <structure name="IDR_SETTINGS_PRIVACY_PAGE_HTML"
                  file="privacy_page/privacy_page.html"
-                 type="chrome_html"
-                 flattenhtml="true"
-                 allowexternalscript="true" />
+                 preprocess="true"
+                 type="chrome_html" />
       <structure name="IDR_SETTINGS_PRIVACY_PAGE_JS"
                  file="privacy_page/privacy_page.js"
                  preprocess="true"

chrome/browser/resources/settings/settings_resources_vulcanized.grd

@@ -15,27 +15,41 @@
       <include name="IDR_SETTINGS_VULCANIZED_HTML"
                file="${root_gen_dir}\chrome\browser\resources\settings\vulcanized.html"
                use_base_dir="false"
-               flattenhtml="true"
-               allowexternalscript="true"
+               preprocess="true"
                type="BINDATA"
                compress="gzip" />
       <include name="IDR_SETTINGS_CRISPER_JS"
                file="${root_gen_dir}\chrome\browser\resources\settings\crisper.js"
                use_base_dir="false"
-               flattenhtml="true"
+               preprocess="true"
                type="BINDATA"
                compress="gzip" />
       <include name="IDR_SETTINGS_LAZY_LOAD_VULCANIZED_HTML"
                file="${root_gen_dir}\chrome\browser\resources\settings\lazy_load.vulcanized.html"
                use_base_dir="false"
-               flattenhtml="true"
-               allowexternalscript="true"
+               preprocess="true"
                type="BINDATA"
                compress="gzip" />
       <include name="IDR_SETTINGS_LAZY_LOAD_CRISPER_JS"
                file="${root_gen_dir}\chrome\browser\resources\settings\lazy_load.crisper.js"
                use_base_dir="false"
-               flattenhtml="true"
+               preprocess="true"
+               type="BINDATA"
+               compress="gzip" />
+      <include name="IDR_SETTINGS_IMAGES_COOKIES_BANNER_SVG"
+               file="images/cookies_banner.svg"
+               type="BINDATA"
+               compress="gzip" />
+      <include name="IDR_SETTINGS_IMAGES_SAFE_BROWSING_BANNER_SVG"
+               file="images/safe_browsing_banner.svg"
+               type="BINDATA"
+               compress="gzip" />
+      <include name="IDR_SETTINGS_IMAGES_SYNC_BANNER_SVG"
+               file="images/sync_banner.svg"
+               type="BINDATA"
+               compress="gzip" />
+      <include name="IDR_SETTINGS_IMAGES_SYNC_BANNER_DARK_SVG"
+               file="images/sync_banner_dark.svg"
                type="BINDATA"
                compress="gzip" />
       <include name="IDR_SETTINGS_IMAGES_PASSWORD_CHECK_NEUTRAL_SVG"

chrome/browser/ui/webui/settings/settings_ui.cc

@@ -323,6 +323,14 @@ SettingsUI::SettingsUI(content::WebUI* web_ui)
 
   // Register SVG images that are purposefully not inlined in the HTML bundle
   // above.
+  html_source->AddResourcePath("images/cookies_banner.svg",
+                               IDR_SETTINGS_IMAGES_COOKIES_BANNER_SVG);
+  html_source->AddResourcePath("images/safe_browsing_banner.svg",
+                               IDR_SETTINGS_IMAGES_SAFE_BROWSING_BANNER_SVG);
+  html_source->AddResourcePath("images/sync_banner.svg",
+                               IDR_SETTINGS_IMAGES_SYNC_BANNER_SVG);
+  html_source->AddResourcePath("images/sync_banner_dark.svg",
+                               IDR_SETTINGS_IMAGES_SYNC_BANNER_DARK_SVG);
   html_source->AddResourcePath("images/password_check_neutral.svg",
                                IDR_SETTINGS_IMAGES_PASSWORD_CHECK_NEUTRAL_SVG);
   html_source->AddResourcePath(