Chromium Code Reviews| 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..906424e774f31229c9ad33660debf9ab584f767d 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,148 @@ |
| -<!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.onload = drawImageToCanvasAndCheckPixels; |
| +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() { |
| + test(function(t) { |
|
Justin Novosad
2017/02/08 18:23:33
The test hraness may terminate before this is reac
zakerinasab
2017/02/08 19:57:49
Done.
|
| + 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); |
| + }, "Ensure correct behavior of canvas with createPattern + fillRect with shadow."); |
| +} |
| + |
| +window.jsTestIsAsync = true; |
|
Justin Novosad
2017/02/08 18:23:33
This is no longer relevant.
zakerinasab
2017/02/08 19:57:50
Done.
|
| +</script> |
| </body> |
| -</html> |