<!DOCTYPE html>
<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
<meta charset="UTF-8">
<link rel="stylesheet" href="/html/canvas/resources/canvas-grid-reftest.css">
{% if test_type == 'promise' %}<html class="reftest-wait">
<script>pending_tests = {{ variants | length }};</script>
{% endif %}
<link rel="match" href="{{ reference_file_link }}">
{% if fuzzy %}<meta name=fuzzy content="{{ fuzzy }}">
{% endif %}
{% if timeout %}<meta name="timeout" content="{{ timeout }}">
{% endif %}
<title>Canvas test: {{ name }}</title>
<h1>{{ name }}</h1>
<p class="desc">{{ desc }}</p>
{% if notes %}<p class="notes">{{ notes }}{% endif %}

<div class="grid-container" style="--grid-width: {{ grid_width }}">
{% for variant in variants %}
<span>
  {% for variant_name in variant.grid_variant_names %}
  <div>{{ variant_name }}</div>
  {% endfor %}
  <canvas class="grid-cell-content" id="canvas{{ variant.id
      }}" width="{{ variant.size[0]
      }}" height="{{ variant.size[1]
      }}"{{ variant.canvas }}>
    <p class="fallback">FAIL (fallback content)</p>
  </canvas>
  <script type="module">
    const canvas = new OffscreenCanvas({{ variant.size[0] }}, {{
                                          variant.size[1] }});
    const ctx = canvas.getContext('2d'{%
        if variant.attributes %}, {{ variant.attributes }}{% endif %});

    {{ variant.code | trim | indent(4) }}

    const outputCanvas = document.getElementById("canvas{{ variant.id }}");
    const outputCtx = outputCanvas.getContext('2d'{%
        if variant.attributes %}, {{ variant.attributes }}{% endif %});
    outputCtx.drawImage(canvas, 0, 0);
{% if test_type == 'promise' %}
    if (--pending_tests == 0) {
      document.documentElement.classList.remove("reftest-wait");
    }
{% endif %}
  </script>
</span>

{% endfor %}
</div>
{% if test_type == 'promise' %}</html>{% endif %}
