Web UI Polymer 3: Change style module autogeneration for CSS Build

Change the way style module JS files are autogenerated so that Polymer
CSS build will correctly replace mixins. This is necessary for mixins
to be correctly handled in optimized Web UI pages.

Bug: 965770
Change-Id: I1de91006c4b0828a6371ef525c066293691e0e16
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1892093
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#711118}

tools/polymer/polymer.py

@@ -387,12 +387,13 @@ def _process_style_module(js_file, html_file):
   # example cr_icons_css.html.
   js_template = \
 """%(js_imports)s
-const styleElement = document.createElement('dom-module');
-styleElement.setAttribute('assetpath', 'chrome://resources/');
-styleElement.innerHTML = `%(html_template)s`;
-styleElement.register('%(style_id)s');""" % {
-  'js_imports': '\n'.join(js_imports),
+const template = document.createElement('template');
+template.innerHTML = `
+<dom-module id="%(style_id)s" assetpath="chrome://resources/">%(html_template)s</dom-module>
+`;
+document.body.appendChild(template.content.cloneNode(true));""" % {
   'html_template': html_template,
+  'js_imports': '\n'.join(js_imports),
   'style_id': style_id,
 }
 

tools/polymer/tests/style_module_expected.js

 import {Polymer, html} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 import './some_other_style.m.js';
-const styleElement = document.createElement('dom-module');
-styleElement.setAttribute('assetpath', 'chrome://resources/');
-styleElement.innerHTML = `
+const template = document.createElement('template');
+template.innerHTML = `
+<dom-module id="cr-foo-style" assetpath="chrome://resources/">
   <template>
     <style include="some-other-style">
       :host {
@@ -10,5 +10,6 @@ styleElement.innerHTML = `
       }
     </style>
   </template>
+</dom-module>
 `;
-styleElement.register('cr-foo-style');
+document.body.appendChild(template.content.cloneNode(true));
\ No newline at end of file