drawElementImage-dest-rect.tentative.html

Enable keyboard shortcuts

This test has a WPT meta file that expects 1 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /html/canvas/element/manual/draw-element-image/drawElementImage-dest-rect.tentative.html - WPT Dashboard Interop Dashboard

<!DOCTYPE HTML>

<title>canvas.drawElementImage dest rect variants</title>

<script src='/resources/testharness.js'></script>

<script src='/resources/testharnessreport.js'></script>

<script src='/html/canvas/resources/canvas-tests.js'></script>

<script src="/html/canvas/resources/wait-for-canvas-paint.js"></script>

<style>

  #child {

    width: 100px;

    height: 100px;

    background-color: green;

</style>

<canvas id="canvas" width="200" height="200" layoutsubtree>

  <div id="child">

  </div>

</canvas>

<script>

  'use strict';

  promise_test(async t => {

    const child = document.getElementById('child');

    const context = canvas.getContext('2d', { willReadFrequently: true });

    context.fillStyle = 'white';

    context.fillRect(0, 0, 200, 200);

    await waitForCanvasPaint(canvas);

    context.drawElementImage(child, 0, 0, 100, 100);

    var canvasTransform = canvas.getElementTransform(child);

    assert_equals(canvasTransform.e, 0, "CanvasTransform x translate for dest 0, 0, 100, 100");

    assert_equals(canvasTransform.f, 0, "CanvasTransform y translate for dest 0, 0, 100, 100");

    context.drawElementImage(child, 200, 0, -100, 100);

    canvasTransform = canvas.getElementTransform(child);

    assert_equals(canvasTransform.e, 100, "CanvasTransform x translate for dest 200, 0, -100, 100");

    assert_equals(canvasTransform.f, 0, "CanvasTransform y translate for dest 200, 0, -100, 100");

    context.drawElementImage(child, 0, 200, 100, -100);

    canvasTransform = canvas.getElementTransform(child);

    assert_equals(canvasTransform.e, 0, "CanvasTransform x translate for dest 0, 200, 100, -100");

    assert_equals(canvasTransform.f, 100, "CanvasTransform y translate for dest 0, 200, 100, -100");

    context.drawElementImage(child, 200, 200, -100, -100);

    canvasTransform = canvas.getElementTransform(child);

    assert_equals(canvasTransform.e, 100, "CanvasTransform x translate for dest 200, 200, -100, -100");

    assert_equals(canvasTransform.f, 100, "CanvasTransform y translate for dest 200, 200, -100, -100");

    const imgData = context.getImageData(0, 0, canvas.width, canvas.height);

    const expected = [0, 128, 0, 255];

    assert_array_equals(_getPixelFromImageData(imgData, 1, 0), expected,

      "top left top left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 0, 99), expected,

      "top left bottom left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 99, 0), expected,

      "top left top right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 99, 99), expected,

      "top left bottom right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 100, 0), expected,

      "top right top left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 100, 99), expected,

      "top right bottom left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 199, 0), expected,

      "top right top right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 199, 99), expected,

      "top right bottom right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 0, 100), expected,

      "bottom left top left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 0, 199), expected,

      "bottom left bottom left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 99, 100), expected,

      "bottom left top right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 99, 199), expected,

      "bottom left bottom right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 100, 100), expected,

      "bottom right top left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 100, 199), expected,

      "bottom right bottom left incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 199, 100), expected,

      "bottom right top right incorrect");

    assert_array_equals(_getPixelFromImageData(imgData, 199, 199), expected,

      "bottom right bottom right incorrect");

}, 'drawElementImage handles negative dest width and height');

</script>