Web UI Polymer 3: Update polymer script to handle cr.define()

Handle cr.define() statements in files that define Polymer elements,
assuming that:
- There is only 1 cr.define() per file
- Nothing after the cr_define_end annotation is needed (similar to
js_modulizer.py).

Also adding a test.

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

tools/polymer/polymer.py

@@ -294,28 +294,45 @@ def _process_v3_ready(js_file, html_file):
   out_filename = os.path.basename(js_file)
   return lines, out_filename
 
-
 def _process_dom_module(js_file, html_file):
   html_template = _extract_template(html_file, 'dom-module')
   js_imports = _generate_js_imports(html_file)
 
+  # Remove IFFE opening/closing lines.
   IIFE_OPENING = '(function() {\n'
   IIFE_OPENING_ARROW = '(() => {\n'
   IIFE_CLOSING = '})();'
 
+  # Remove this line.
+  CR_DEFINE_START_REGEX = 'cr.define\('
+  # Ignore all lines after this comment, including the line it appears on.
+  CR_DEFINE_END_REGEX = r'\s*// #cr_define_end'
+
+  # Replace export annotations with 'export'.
+  EXPORT_LINE_REGEX = '/* #export */'
+
   with open(js_file) as f:
     lines = f.readlines()
 
   imports_added = False
   iife_found = False
+  cr_define_found = False
+  cr_define_end_line = -1
 
   for i, line in enumerate(lines):
     if not imports_added:
       if line.startswith(IIFE_OPENING) or line.startswith(IIFE_OPENING_ARROW):
+        assert not cr_define_found, 'cr.define() and IFFE in the same file'
         # Replace the IIFE opening line with the JS imports.
         line = '\n'.join(js_imports) + '\n\n'
         imports_added = True
         iife_found = True
+      elif re.match(CR_DEFINE_START_REGEX, line):
+        assert not cr_define_found, 'Multiple cr.define()s are not supported'
+        assert not iife_found, 'cr.define() and IFFE in the same file'
+        line = '\n'.join(js_imports) + '\n\n'
+        cr_define_found = True
+        imports_added = True
       elif line.startswith('Polymer({\n'):
         # Place the JS imports right before the opening "Polymer({" line.
         line = line.replace(
@@ -329,12 +346,23 @@ def _process_dom_module(js_file, html_file):
         r'Polymer({',
         'Polymer({\n  _template: html`%s`,' % html_template)
 
+    line = line.replace(EXPORT_LINE_REGEX, 'export')
+
     if line.startswith('cr.exportPath('):
       line = ''
 
+    if re.match(CR_DEFINE_END_REGEX, line):
+      assert cr_define_found, 'Found cr_define_end without cr.define()'
+      cr_define_end_line = i
+      break
+
     line = _rewrite_namespaces(line)
     lines[i] = line
 
+  if cr_define_found:
+    assert cr_define_end_line != -1, 'No cr_define_end found'
+    lines = lines[0:cr_define_end_line]
+
   if iife_found:
     last_line = lines[-1]
     assert last_line.startswith(IIFE_CLOSING), 'Could not detect IIFE closing'

tools/polymer/polymer_test.py

@@ -35,7 +35,8 @@ class PolymerModulizerTest(unittest.TestCase):
       '--js_file',  js_file,
       '--html_file',  html_file,
       '--html_type',  html_type,
-      '--namespace_rewrites',  'Polymer.PaperRippleBehavior|PaperRippleBehavior',
+      '--namespace_rewrites',
+      'Polymer.PaperRippleBehavior|PaperRippleBehavior',
       '--auto_imports',
       'ui/webui/resources/html/polymer.html|Polymer,html',
       'third_party/polymer/v1_0/components-chromium/paper-behaviors/paper-ripple-behavior.html|PaperRippleBehavior',
@@ -66,6 +67,13 @@ class PolymerModulizerTest(unittest.TestCase):
         'dom-module', 'dom_module.html', 'dom_module_iife_arrow.js',
         'dom_module_iife_arrow.m.js', 'dom_module_iife_expected.js')
 
+  # Test case where HTML is extracted from a Polymer2 <dom-module> that also
+  # has a 'cr.define()' in its JS file.
+  def testDomModuleWithDefine(self):
+    self._run_test(
+        'dom-module', 'dom_module.html', 'dom_module_with_define.js',
+        'dom_module_with_define.m.js', 'dom_module_with_define_expected.js')
+
   # Test case where HTML is extracted from a Polymer2 style module.
   def testStyleModule(self):
     self._run_test(

tools/polymer/tests/dom_module_with_define.js

+cr.define('cr.testFoo', () => {
+  let instance_ = null;
+
+  let bar_ = 1;
+
+  /* #export */ const someExport = true;
+
+  /* #export */ function getInstance() {
+    return assert(instance_);
+  }
+
+  function getBarInternal_() {
+    return bar_;
+  }
+
+  /* #export */ function getBar(isTest) {
+    return isTest ? 0 : getBarInternal_();
+  }
+
+  /* #export */ let CrTestFooElement = Polymer({
+    is: 'cr-test-foo',
+    behaviors: [Polymer.PaperRippleBehavior],
+  });
+
+  // #cr_define_end
+  return {
+    CrTestFooElement: CrTestFooElement,
+    someExport: someExport,
+    getInstance: getInstance,
+    getBar: getBar,
+  };
+});

tools/polymer/tests/dom_module_with_define_expected.js

+import {Polymer, html} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+import {PaperRippleBehavior} from 'chrome://resources/polymer/v3_0/paper-behaviors/paper-ripple-behavior.js';
+import '../shared_vars_css.m.js';
+import './foo.m.js';
+
+  let instance_ = null;
+
+  let bar_ = 1;
+
+  export const someExport = true;
+
+  export function getInstance() {
+    return assert(instance_);
+  }
+
+  function getBarInternal_() {
+    return bar_;
+  }
+
+  export function getBar(isTest) {
+    return isTest ? 0 : getBarInternal_();
+  }
+
+  export let CrTestFooElement = Polymer({
+  _template: html`
+    <style>
+      div {
+        font-size: 2rem;
+      }
+    </style>
+    <div>Hello world</div>
+`,
+    is: 'cr-test-foo',
+    behaviors: [PaperRippleBehavior],
+  });
+