thin-drawImages.html | Explore in Territory

<!DOCTYPE html>
<title>Canvas.drawImage with narrow destination.</title>
<script src="../../resources/js-test.js"></script>
<script>
function verifyCovered(imgData, offset, stride, length) {
  while (length) {
    if (imgData[offset + 3] === 0)
      return false;
    offset += stride * 4;
    length--;
  }
  return true;
}

ImageData.prototype.pixelOffset = function(x, y) {
  return (x + y * this.width) * 4;
}

var sourceImage = document.createElement("canvas");
sourceImage.height = sourceImage.width = 1;
sourceImage.getContext("2d").fillRect(0, 0, 1, 1);

var c = document.createElement("canvas");
c.width = c.height = 100;
var ctx = c.getContext("2d");

// Thin horizontal image.
ctx.drawImage(sourceImage, 10, 5.5, 10, 0.95);

// Thin vertical image.
ctx.drawImage(sourceImage, 5.5, 5, 0.95, 10);

// Rotated 90 degrees
ctx.save();
ctx.translate(20, 15);
ctx.rotate(Math.PI / 2);
ctx.drawImage(sourceImage, 0, -.5, 10, 0.95);
ctx.restore();

// Rotated -90 degrees
ctx.save();
ctx.translate(25, 15);
ctx.rotate(-Math.PI / 2);
ctx.drawImage(sourceImage, -.5, 0, 0.95, 10);
ctx.restore();

imgData = ctx.getImageData(0, 0, c.width, c.height);
shouldBeTrue("verifyCovered(imgData.data, imgData.pixelOffset(10, 5), 1, 10)");
shouldBeTrue("verifyCovered(imgData.data, imgData.pixelOffset(5, 5), imgData.width, 10)");
shouldBeTrue("verifyCovered(imgData.data, imgData.pixelOffset(25, 15), 1, 10)");
shouldBeTrue("verifyCovered(imgData.data, imgData.pixelOffset(20, 15), imgData.width, 10)");

successfullyParsed = true;
</script>
chromium/third_party/blink/web_tests/fast/canvas/thin-drawImages.html
