| Index: third_party/WebKit/LayoutTests/fast/canvas/canvas-createPattern-fillRect-shadow.html
|
| diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-createPattern-fillRect-shadow.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-createPattern-fillRect-shadow.html
|
| index b309e61ff1ff096d1deaaf54c44d98b692e34a30..d9e5abf52f16fd446496f54c9de85aafc7852170 100644
|
| --- a/third_party/WebKit/LayoutTests/fast/canvas/canvas-createPattern-fillRect-shadow.html
|
| +++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-createPattern-fillRect-shadow.html
|
| @@ -1,9 +1,150 @@
|
| -<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
| -<html>
|
| -<head>
|
| -<script src="../../resources/js-test.js"></script>
|
| -</head>
|
| +<script src="../../resources/testharness.js"></script>
|
| +<script src="../../resources/testharnessreport.js"></script>
|
| <body>
|
| -<script src="script-tests/canvas-createPattern-fillRect-shadow.js"></script>
|
| +<script>
|
| +
|
| +// Create auxiliary canvas to draw to and create an image from.
|
| +// This is done instead of simply loading an image from the file system
|
| +// because that would throw a SECURITY_ERR DOM Exception.
|
| +var aCanvas = document.createElement('canvas');
|
| +aCanvas.setAttribute('width', '200');
|
| +aCanvas.setAttribute('height', '200');
|
| +var aCtx = aCanvas.getContext('2d');
|
| +
|
| +// Draw a circle on the same canvas.
|
| +aCtx.beginPath();
|
| +aCtx.fillStyle = 'blue';
|
| +aCtx.arc(100, 100, 100, 0, Math.PI * 2, false);
|
| +aCtx.fill();
|
| +
|
| +// Create the image object to be drawn on the master canvas.
|
| +var img = new Image();
|
| +img.src = aCanvas.toDataURL(); // set a data URI of the base64 encoded image as the source
|
| +
|
| +// Create master canvas.
|
| +var canvas = document.createElement('canvas');
|
| +document.body.appendChild(canvas);
|
| +canvas.setAttribute('width', '700');
|
| +canvas.setAttribute('height', '1100');
|
| +var ctx = canvas.getContext('2d');
|
| +
|
| +function drawImageToCanvasAndCheckPixels() {
|
| + ctx.shadowOffsetX = 250;
|
| + ctx.fillStyle = ctx.createPattern(img, 'repeat');
|
| +
|
| + ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
|
| + ctx.fillRect(50, 50, 200, 200);
|
| +
|
| + ctx.shadowColor = 'rgba(255, 0, 0, 0.2)';
|
| + ctx.fillRect(50, 300, 200, 200);
|
| +
|
| + ctx.shadowBlur = 10;
|
| + ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
|
| + ctx.fillRect(50, 550, 200, 200);
|
| +
|
| + ctx.shadowColor = 'rgba(255, 0, 0, 0.2)';
|
| + ctx.fillRect(50, 800, 200, 200);
|
| +
|
| + checkPixels();
|
| +}
|
| +
|
| +function checkPixels() {
|
| + var imageData, data;
|
| +
|
| + // Verify solid shadow.
|
| + imageData = ctx.getImageData(300, 50, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_equals(d[3], 255);
|
| +
|
| + imageData = ctx.getImageData(300, 249, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_equals(d[3], 255);
|
| +
|
| + imageData = ctx.getImageData(490, 240, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_equals(d[3], 255);
|
| +
|
| + // Verify solid alpha shadow.
|
| + imageData = ctx.getImageData(310, 350, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 51, 10);
|
| +
|
| + imageData = ctx.getImageData(490, 490, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 51, 10);
|
| +
|
| + imageData = ctx.getImageData(300, 499, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 51, 10);
|
| +
|
| + // Verify blurry shadow.
|
| + imageData = ctx.getImageData(310, 550, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 141, 10);
|
| +
|
| + imageData = ctx.getImageData(490, 750, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 113, 10);
|
| +
|
| + imageData = ctx.getImageData(499, 499, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 51, 10);
|
| +
|
| + // Verify blurry alpha shadow.
|
| + imageData = ctx.getImageData(300, 850, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 29, 10);
|
| +
|
| + imageData = ctx.getImageData(500, 875, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 23, 10);
|
| +
|
| + imageData = ctx.getImageData(300, 900, 1, 1);
|
| + d = imageData.data;
|
| + assert_equals(d[0], 255);
|
| + assert_equals(d[1], 0);
|
| + assert_equals(d[2], 0);
|
| + assert_approx_equals(d[3], 29, 10);
|
| +}
|
| +
|
| +async_test(t => {
|
| + img.onload = function() {
|
| + t.step(drawImageToCanvasAndCheckPixels);
|
| + t.done();
|
| + }
|
| +}, "Ensure correct behavior of canvas with createPattern + fillRect with shadow.");
|
| +</script>
|
| </body>
|
| -</html>
|
|
|