Chromium Code Reviews| Index: third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-drawImage-shadow.html |
| diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-drawImage-shadow.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-drawImage-shadow.html |
| index f95053c8ab9fc183b9881478d8e17ea05f17c0f1..8737bcb327d8b1aa487ee7d3153240425d34c01b 100644 |
| --- a/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-drawImage-shadow.html |
| +++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-drawImage-shadow.html |
| @@ -1,9 +1,113 @@ |
| -<!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-scale-drawImage-shadow.js"></script> |
| +<script> |
| +// Ensure correct behavior of canvas with drawImage+shadow after scaling. A blue and red checkered pattern should be displayed. |
| + |
| +// 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.width = aCanvas.height = 10; |
| +var aCtx = aCanvas.getContext('2d'); |
| +aCtx.fillStyle = 'rgba(0, 0, 255, 1)'; |
| +aCtx.fillRect(0, 0, 50, 50); |
| + |
| +// 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 |
| + |
| +aCanvas.width = 10; |
| +aCtx.fillStyle = 'rgba(0, 0, 255, 0.5)'; |
| +aCtx.fillRect(0, 0, 50, 50); |
| +// Create the image object to be drawn on the master canvas. |
| +var transparentImg = new Image(); |
| +transparentImg.onload = drawImageToCanvasAndCheckPixels; |
| +transparentImg.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.width = 150; |
| +canvas.height = 110; |
| +var ctx = canvas.getContext('2d'); |
| + |
| +function testPixelShadow(x, y, color) |
| +{ |
| + assert_array_equals(ctx.getImageData(x, y, 1, 1).data, color); |
| +} |
| + |
| +function testPixelShadowAlpha(x, y, color) |
| +{ |
| + var data = ctx.getImageData(x, y, 1, 1).data; |
| + assert_array_equals(data.slice(0,3), color.slice(0,3)); |
| + assert_approx_equals(data[3], color[3], 10); |
| +} |
| + |
| +var testPixelShadowScenarios = [ |
| + ['Verify solid shadow 1', 40, 40, [255, 0, 0, 255]], |
| + ['Verify solid shadow 2', 59, 59, [255, 0, 0, 255]], |
| +]; |
| + |
| +var testPixelShadowAlphaScenarios = [ |
| + ['Verify solid alpha shadow 1', 41, 81, [255, 0, 0, 76]], |
| + ['Verify solid alpha shadow 2', 59, 99, [255, 0, 0, 76]], |
| + |
| + ['Verify blurry shadow 1', 90, 39, [255, 0, 0, 114]], |
| + ['Verify blurry shadow 2', 90, 60, [255, 0, 0, 114]], |
| + ['Verify blurry shadow 3', 79, 50, [255, 0, 0, 114]], |
| + ['Verify blurry shadow 4', 100, 50, [255, 0, 0, 114]], |
| + |
| + ['Verify blurry alpha shadow 1', 90, 79, [255, 0, 0, 34]], |
| + ['Verify blurry alpha shadow 2', 90, 100, [255, 0, 0, 34]], |
| + ['Verify blurry alpha shadow 3', 79, 90, [255, 0, 0, 34]], |
| + ['Verify blurry alpha shadow 4', 100, 90, [255, 0, 0, 34]], |
| + |
| + ['Verify blurry shadow of image with alpha 1', 130, 39, [255, 0, 0, 57]], |
| + ['Verify blurry shadow of image with alpha 2', 130, 60, [255, 0, 0, 57]], |
| + ['Verify blurry shadow of image with alpha 3', 119, 50, [255, 0, 0, 57]], |
| + ['Verify blurry shadow of image with alpha 4', 140, 50, [255, 0, 0, 57]], |
| + |
| + ['Verify blurry alpha shadow of image with alpha 1', 130, 79, [255, 0, 0, 17]], |
| + ['Verify blurry alpha shadow of image with alpha 2', 130, 100, [255, 0, 0, 17]], |
| + ['Verify blurry alpha shadow of image with alpha 3', 119, 90, [255, 0, 0, 17]], |
| + ['Verify blurry alpha shadow of image with alpha 4', 140, 90, [255, 0, 0, 17]], |
| +]; |
| + |
| +var imagesLoaded = 0; |
| +function drawImageToCanvasAndCheckPixels() { |
|
Justin Novosad
2017/02/16 15:59:28
it is a bit weird that you have to onload handlers
zakerinasab
2017/02/16 20:11:28
generate_tests replaced with loops in an async_tes
|
| + imagesLoaded = imagesLoaded + 1; |
| + if (imagesLoaded == 2) { |
| + ctx.scale(2, 2); |
| + ctx.shadowOffsetX = 20; |
| + ctx.shadowOffsetY = 20; |
| + ctx.fillStyle = 'rgba(0, 0, 255, 1)'; |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 1.0)'; |
| + ctx.drawImage(img, 10, 10); |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 0.3)'; |
| + ctx.drawImage(img, 10, 30); |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 1.0)'; |
| + ctx.shadowBlur = 10; |
| + ctx.drawImage(img, 30, 10); |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 0.3)'; |
| + ctx.drawImage(img, 30, 30); |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 1.0)'; |
| + ctx.drawImage(transparentImg, 50, 10); |
| + |
| + ctx.shadowColor = 'rgba(255, 0, 0, 0.3)'; |
| + ctx.drawImage(transparentImg, 50, 30); |
| + |
| + generate_tests(testPixelShadow, testPixelShadowScenarios); |
| + generate_tests(testPixelShadowAlpha, testPixelShadowAlphaScenarios); |
| + |
| + } |
| +} |
| + |
| +</script> |
| </body> |
| -</html> |