Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(606)

Unified Diff: third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html

Issue 2674863003: Use testharness.js instead of js-test.js in LayoutTests/fast/canvas tests. (Closed)
Patch Set: Addressing comments Created 3 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html
index 10f2cad4dfdf80afa7f48191fb27668ab395fb1e..b4f725814211e0c601e53f8736d3f9152abd58db 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-drawImage-shadow.html
@@ -1,9 +1,144 @@
-<!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-drawImage-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 = 'green';
+aCtx.arc(100, 100, 150, 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 enconded image as the source
+
+// Create master canvas.
+var canvas = document.createElement('canvas');
+document.body.appendChild(canvas);
+canvas.setAttribute('width', '600');
+canvas.setAttribute('height', '600');
+var ctx = canvas.getContext('2d');
+
+function drawImageToCanvasAndCheckPixels() {
+ ctx.shadowOffsetX = 250;
+ ctx.shadowColor = 'rgba(240, 50, 50, 1.0)';
+ ctx.drawImage(img, 50, 50);
+
+ ctx.shadowOffsetX = 250;
+ ctx.shadowBlur = 6;
+ ctx.shadowColor = 'rgba(50, 50, 200, 0.9)';
+ ctx.shadowColor = 'rgba(0, 0, 255, 1.0)';
+ ctx.drawImage(img, 50, 300);
+
+ checkPixels();
+}
+
+function checkPixels() {
+ test(function(t) {
+ var imageData, data;
+
+ // Verify solid shadow.
+ imageData = ctx.getImageData(260, 300, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ imageData = ctx.getImageData(350, 100, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 240);
+ assert_equals(d[1], 50);
+ assert_equals(d[2], 50);
+ assert_equals(d[3], 255);
+
+ imageData = ctx.getImageData(400, 200, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 240);
+ assert_equals(d[1], 50);
+ assert_equals(d[2], 50);
+ assert_equals(d[3], 255);
+
+ imageData = ctx.getImageData(490, 65, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ imageData = ctx.getImageData(485, 65, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ // Verify blurry shadow.
+ imageData = ctx.getImageData(260, 400, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ imageData = ctx.getImageData(350, 300, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 255);
+ assert_not_equals(d[3], 255);
+
+ imageData = ctx.getImageData(300, 400, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 255);
+ assert_not_equals(d[3], 255);
+
+ imageData = ctx.getImageData(300, 500, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 255);
+ assert_not_equals(d[3], 255);
+
+ imageData = ctx.getImageData(400, 500, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 255);
+ assert_not_equals(d[3], 255);
+
+ imageData = ctx.getImageData(400, 400, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 255);
+
+ imageData = ctx.getImageData(490, 315, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ imageData = ctx.getImageData(485, 320, 1, 1);
+ d = imageData.data;
+ assert_equals(d[0], 0);
+ assert_equals(d[1], 0);
+ assert_equals(d[2], 0);
+ assert_equals(d[3], 0);
+
+ }, "Ensure correct behavior of canvas with image shadow. A square with a cut-out top-right corner should be displayed with solid shadow (top) and blur shadow (bottom).");
+}
+</script>
</body>
-</html>

Powered by Google App Engine
This is Rietveld 408576698