Allow template parameters to refer to each other.

In this CL, this is used to add "{{ size[0] }}" and "{{ size[1] }}"
in places where the canvas size was used in the test template.

Change-Id: Ieda40f3007a42ffe8706684575d194283035a56c
Bug: 1275750
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4558644
Reviewed-by: Yi Xu <yiyix@chromium.org>
Commit-Queue: Jean-Philippe Gravel <jpgravel@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1150278}

third_party/blink/web_tests/external/wpt/html/canvas/tools/gentestutilsunion.py

@@ -274,39 +274,63 @@ def _validate_test(test: Mapping[str, Any]):
             'can\'t both be specified at the same time.')
 
 
+def _render_template(jinja_env: jinja2.Environment,
+                     template: jinja2.Template,
+                     params: Mapping[str, Any]) -> str:
+    """Renders the specified jinja template.
+
+    The template is repetitively rendered until no more changes are observed.
+    This allows for template parameters to refer to other template parameters.
+    """
+    rendered = template.render(params)
+    previous = ''
+    while rendered != previous:
+        previous = rendered
+        template = jinja_env.from_string(rendered)
+        rendered = template.render(params)
+    return rendered
+
+
 def _write_reference_test(jinja_env: jinja2.Environment,
                           params: Mapping[str, Any],
                           enabled_tests: Set[TestType],
                           canvas_path: str, offscreen_path: str):
     if TestType.HTML_CANVAS in enabled_tests:
         pathlib.Path(f'{canvas_path}.html').write_text(
-            jinja_env.get_template("reftest_element.html").render(params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template("reftest_element.html"),
+                             params), 'utf-8')
     if TestType.OFFSCREEN_CANVAS in enabled_tests:
         pathlib.Path(f'{offscreen_path}.html').write_text(
-            jinja_env.get_template("reftest_offscreen.html").render(params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template("reftest_offscreen.html"),
+                             params), 'utf-8')
     if TestType.WORKER in enabled_tests:
         pathlib.Path(f'{offscreen_path}.w.html').write_text(
-            jinja_env.get_template("reftest_worker.html").render(params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template("reftest_worker.html"),
+                             params), 'utf-8')
 
     js_ref = params.get('reference', '')
     html_ref = params.get('html_reference', '')
     ref_params = dict(params)
     ref_params.update({
         'is_test_reference': True,
-        'code': jinja_env.from_string(js_ref or html_ref).render(params)
+        'code': _render_template(jinja_env,
+                                 jinja_env.from_string(js_ref or html_ref),
+                                 params)
     })
     ref_template_name = 'reftest_element.html' if js_ref else 'reftest.html'
     if TestType.HTML_CANVAS in enabled_tests:
         pathlib.Path(f'{canvas_path}-expected.html').write_text(
-            jinja_env.get_template(ref_template_name).render(ref_params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template(ref_template_name),
+                             ref_params), 'utf-8')
     if {TestType.OFFSCREEN_CANVAS, TestType.WORKER} & enabled_tests:
         pathlib.Path(f'{offscreen_path}-expected.html').write_text(
-            jinja_env.get_template(ref_template_name).render(ref_params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template(ref_template_name),
+                             ref_params), 'utf-8')
 
 
 def _write_testharness_test(jinja_env: jinja2.Environment,
@@ -317,18 +341,22 @@ def _write_testharness_test(jinja_env: jinja2.Environment,
     # Create test cases for canvas and offscreencanvas.
     if TestType.HTML_CANVAS in enabled_tests:
         pathlib.Path(f'{canvas_path}.html').write_text(
-            jinja_env.get_template("testharness_element.html").render(params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template("testharness_element.html"),
+                             params), 'utf-8')
 
     if TestType.OFFSCREEN_CANVAS in enabled_tests:
         pathlib.Path(f'{offscreen_path}.html').write_text(
-            jinja_env.get_template("testharness_offscreen.html").render(
-                params), 'utf-8')
+            _render_template(
+                jinja_env,
+                jinja_env.get_template("testharness_offscreen.html"), params),
+            'utf-8')
 
     if TestType.WORKER in enabled_tests:
         pathlib.Path(f'{offscreen_path}.worker.js').write_text(
-            jinja_env.get_template("testharness_worker.js").render(params),
-            'utf-8')
+            _render_template(jinja_env,
+                             jinja_env.get_template("testharness_worker.js"),
+                             params), 'utf-8')
 
 
 def _generate_test(test: Mapping[str, Any], jinja_env: jinja2.Environment,
@@ -383,7 +411,12 @@ def _generate_test(test: Mapping[str, Any], jinja_env: jinja2.Environment,
         'expected_img': expected_img
     })
 
-    params['code'] = jinja_env.from_string(params['code']).render(params)
+    # Render the code on its own, as it could contain templating. The code
+    # must be rendered separately so that it could be indented as a whole into
+    # the final template.
+    params['code'] = _render_template(jinja_env,
+                                      jinja_env.from_string(params['code']),
+                                      params)
 
     canvas_path = os.path.join(html_canvas_cfg.out_dir, sub_dir, name)
     offscreen_path = os.path.join(offscreen_canvas_cfg.out_dir, sub_dir, name)

third_party/blink/web_tests/external/wpt/html/canvas/tools/yaml-new/filters.yaml

@@ -352,10 +352,10 @@
   size: [520, 420]
   code: |
     ctx.fillStyle = 'teal';
-    ctx.fillRect(0, 0, 520, 50);
-    ctx.fillRect(0, 100, 520, 50);
-    ctx.fillRect(0, 200, 520, 50);
-    ctx.fillRect(0, 300, 520, 50);
+    ctx.fillRect(0, 0, {{ size[0] }}, 50);
+    ctx.fillRect(0, 100, {{ size[0] }}, 50);
+    ctx.fillRect(0, 200, {{ size[0] }}, 50);
+    ctx.fillRect(0, 300, {{ size[0] }}, 50);
 
     ctx.fillStyle = 'crimson';
 
@@ -446,7 +446,7 @@
     ctx.fillRect(210, 310, 80, 80);
   html_reference: |
     <svg xmlns="http://www.w3.org/2000/svg"
-         width=520 height=420
+         width={{ size[0] }} height={{ size[1] }}
          color-interpolation-filters="sRGB">
       <rect x=0 y=0 width=100% height=50 fill="teal" />
       <rect x=0 y=100 width=100% height=50 fill="teal" />

third_party/blink/web_tests/external/wpt/html/canvas/tools/yaml-new/layers.yaml

@@ -127,7 +127,7 @@
   reference: |
     const svg = `
       <svg xmlns="http://www.w3.org/2000/svg"
-            width="200" height="200"
+            width="{{ size[0] }}" height="{{ size[1] }}"
             color-interpolation-filters="sRGB">
         <filter id="filter" x="-100%" y="-100%" width="300%" height="300%">
           <feColorMatrix
@@ -148,8 +148,8 @@
       </svg>`;
 
     const img = new Image();
-    img.width = 200;
-    img.height = 200;
+    img.width = {{ size[0] }};
+    img.height = {{ size[1] }};
     img.onload = () => {
       ctx.fillStyle = 'rgba(0, 0, 255, 1)';
 
@@ -324,19 +324,19 @@
       flush_canvas: createImageBitmap(canvas);
     drawImage:
       flush_canvas: |-
-        const canvas2 = new OffscreenCanvas(200, 200);
+        const canvas2 = new OffscreenCanvas({{ size[0] }}, {{ size[1] }});
         const ctx2 = canvas2.getContext('2d');
         ctx2.drawImage(canvas, 0, 0);
     getImageData:
-      flush_canvas: ctx.getImageData(0, 0, 200, 200);
+      flush_canvas: ctx.getImageData(0, 0, {{ size[0] }}, {{ size[1] }});
     requestAnimationFrame:
       canvasType: ['HTMLCanvas']
       test_type: "promise"
       flush_canvas: |-
         await new Promise(resolve => requestAnimationFrame(resolve));
     putImageData:
       flush_canvas: |-
-        const canvas2 = new OffscreenCanvas(200, 200);
+        const canvas2 = new OffscreenCanvas({{ size[0] }}, {{ size[1] }});
         const ctx2 = canvas2.getContext('2d');
         ctx.putImageData(ctx2.getImageData(0, 0, 1, 1), 0, 0);
     toBlob: