summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/fast/canvas
diff options
context:
space:
mode:
authorcommit-queue@webkit.org <commit-queue@webkit.org@bbb929c8-8fbe-4397-9dbb-9b2b20218538>2010-12-14 18:30:34 +0000
committercommit-queue@webkit.org <commit-queue@webkit.org@bbb929c8-8fbe-4397-9dbb-9b2b20218538>2010-12-14 18:30:34 +0000
commit6347ee438f71a42ffddfaff2b95ce2a3ecec799f (patch)
tree3997bc6cbde58780c0bda3bebba319f9fbd2429f /third_party/WebKit/LayoutTests/fast/canvas
parentce0d9c8b6650bbb5d63f431ebfb0c7b31f41d294 (diff)
downloadchromium_src-6347ee438f71a42ffddfaff2b95ce2a3ecec799f.zip
chromium_src-6347ee438f71a42ffddfaff2b95ce2a3ecec799f.tar.gz
chromium_src-6347ee438f71a42ffddfaff2b95ce2a3ecec799f.tar.bz2
2010-12-14 Helder Correia <helder@sencha.com>
Reviewed by Ariya Hidayat. [Qt] Canvas shadow offset should not be affected by any transformation https://bugs.webkit.org/show_bug.cgi?id=50422 On a canvas context, shadows are currently affected by all transformations except scaling. According to the spec: http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#shadows "The shadowOffsetX and shadowOffsetY attributes specify the distance that the shadow will be offset in the positive horizontal and positive vertical distance respectively. Their values are in coordinate space units. They are not affected by the current transformation matrix." NOTE: this applies only to canvas, not to box shadows. Add new test to ensure that shadows are correctly transformed keeping the relative offset to the shape. * fast/canvas/canvas-scale-strokePath-shadow-expected.txt: * fast/canvas/canvas-transforms-fillRect-shadow-expected.txt: Added. * fast/canvas/canvas-transforms-fillRect-shadow.html: Added. * fast/canvas/script-tests/canvas-scale-fillPath-shadow.js: * fast/canvas/script-tests/canvas-scale-fillRect-shadow.js: * fast/canvas/script-tests/canvas-scale-strokePath-shadow.js: Now using a lineWidth > 1 to make it easier to test and more fair among all ports, since there can be different transformation smoothness or aliasing settings. * fast/canvas/script-tests/canvas-transforms-fillRect-shadow.js: Added. 2010-12-14 Helder Correia <helder@sencha.com> Reviewed by Ariya Hidayat. [Qt] Canvas shadow offset should not be affected by any transformation https://bugs.webkit.org/show_bug.cgi?id=50422 On a canvas context, shadows are currently affected by all transformations except scaling. According to the spec: http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#shadows "The shadowOffsetX and shadowOffsetY attributes specify the distance that the shadow will be offset in the positive horizontal and positive vertical distance respectively. Their values are in coordinate space units. They are not affected by the current transformation matrix." NOTE: this applies only to canvas, not to box shadows. Test: fast/canvas/canvas-transforms-fillRect-shadow.html * platform/graphics/ContextShadow.cpp: (WebCore::ContextShadow::ContextShadow): (WebCore::ContextShadow::calculateLayerBoundingRect): * platform/graphics/ContextShadow.h: (WebCore::ContextShadow::setShadowsIgnoreTransforms): (WebCore::ContextShadow::shadowsIgnoreTransforms): (WebCore::ContextShadow::offset): * platform/graphics/qt/ContextShadowQt.cpp: (WebCore::ContextShadow::beginShadowLayer): (WebCore::ContextShadow::endShadowLayer): * platform/graphics/qt/GraphicsContextQt.cpp: (WebCore::mustUseContextShadow): (WebCore::GraphicsContext::fillPath): (WebCore::GraphicsContext::strokePath): (WebCore::GraphicsContext::fillRect): (WebCore::GraphicsContext::fillRoundedRect): (WebCore::GraphicsContext::setPlatformShadow): git-svn-id: svn://svn.chromium.org/blink/trunk@74040 bbb929c8-8fbe-4397-9dbb-9b2b20218538
Diffstat (limited to 'third_party/WebKit/LayoutTests/fast/canvas')
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-strokePath-shadow-expected.txt12
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow-expected.txt57
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow.html13
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillPath-shadow.js8
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillRect-shadow.js8
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-strokePath-shadow.js37
-rw-r--r--third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-transforms-fillRect-shadow.js133
7 files changed, 236 insertions, 32 deletions
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-strokePath-shadow-expected.txt b/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-strokePath-shadow-expected.txt
index e56201f..a337c4b 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-strokePath-shadow-expected.txt
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-scale-strokePath-shadow-expected.txt
@@ -30,27 +30,27 @@ PASS d[3] is around 76
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 20
+PASS d[3] is around 149
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 22
+PASS d[3] is around 116
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 28
+PASS d[3] is around 115
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 22
+PASS d[3] is around 70
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 15
+PASS d[3] is around 70
PASS d[0] is 255
PASS d[1] is 0
PASS d[2] is 0
-PASS d[3] is around 17
+PASS d[3] is around 69
PASS successfullyParsed is true
TEST COMPLETE
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow-expected.txt b/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow-expected.txt
new file mode 100644
index 0000000..013b891
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow-expected.txt
@@ -0,0 +1,57 @@
+Ensure correct behavior of canvas with fillRect+shadow after translation+rotation+scaling. A blue and red checkered pattern should be displayed.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is 255
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is 255
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is 255
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 127
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 127
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 127
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 106
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 106
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 83
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 36
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 36
+PASS d[0] is 255
+PASS d[1] is 0
+PASS d[2] is 0
+PASS d[3] is around 36
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow.html
new file mode 100644
index 0000000..2fc4e9a
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-transforms-fillRect-shadow.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<link rel="stylesheet" href="../js/resources/js-test-style.css">
+<script src="../js/resources/js-test-pre.js"></script>
+</head>
+<body>
+<p id="description"></p>
+<div id="console"></div>
+<script src="script-tests/canvas-transforms-fillRect-shadow.js"></script>
+<script src="../js/resources/js-test-post.js"></script>
+</body>
+</html>
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillPath-shadow.js b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillPath-shadow.js
index 05286f5..3ca3321 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillPath-shadow.js
+++ b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillPath-shadow.js
@@ -79,13 +79,13 @@ shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(299, 295, 1, 1).data;
+d = ctx.getImageData(298, 295, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(200, 299, 1, 1).data;
+d = ctx.getImageData(200, 298, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
@@ -98,13 +98,13 @@ shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(299, 405, 1, 1).data;
+d = ctx.getImageData(298, 405, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(205, 499, 1, 1).data;
+d = ctx.getImageData(205, 498, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillRect-shadow.js b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillRect-shadow.js
index 99a1e59..f495c91 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillRect-shadow.js
+++ b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-fillRect-shadow.js
@@ -58,13 +58,13 @@ shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(299, 295, 1, 1).data;
+d = ctx.getImageData(298, 298, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(200, 299, 1, 1).data;
+d = ctx.getImageData(201, 298, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
@@ -77,13 +77,13 @@ shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(299, 405, 1, 1).data;
+d = ctx.getImageData(298, 405, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(205, 499, 1, 1).data;
+d = ctx.getImageData(205, 498, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-strokePath-shadow.js b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-strokePath-shadow.js
index 5198d94..91b927f 100644
--- a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-strokePath-shadow.js
+++ b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-scale-strokePath-shadow.js
@@ -35,6 +35,7 @@ ctx.scale(2, 2);
ctx.shadowOffsetX = 100;
ctx.shadowOffsetY = 100;
ctx.strokeStyle = 'rgba(0, 0, 255, 1)';
+ctx.lineWidth = 5;
ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
ctx.beginPath();
@@ -76,79 +77,79 @@ ctx.stroke();
var d; // imageData.data
// Verify solid shadow.
-d = ctx.getImageData(200, 205, 1, 1).data;
+d = ctx.getImageData(250, 200, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(299, 295, 1, 1).data;
+d = ctx.getImageData(300, 290, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
-d = ctx.getImageData(201, 299, 1, 1).data;
+d = ctx.getImageData(200, 250, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBe('d[3]', '255');
// Verify solid alpha shadow.
-d = ctx.getImageData(200, 405, 1, 1).data;
+d = ctx.getImageData(201, 405, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(299, 405, 1, 1).data;
+d = ctx.getImageData(201, 500, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
-d = ctx.getImageData(205, 499, 1, 1).data;
+d = ctx.getImageData(300, 499, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
shouldBeAround('d[3]', '76');
// Verify blurry shadow.
-d = ctx.getImageData(394, 208, 1, 1).data;
+d = ctx.getImageData(404, 210, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '20');
+shouldBeAround('d[3]', '149');
-d = ctx.getImageData(503, 301, 1, 1).data;
+d = ctx.getImageData(505, 250, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '22');
+shouldBeAround('d[3]', '116');
-d = ctx.getImageData(504, 250, 1, 1).data;
+d = ctx.getImageData(450, 205, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '28');
+shouldBeAround('d[3]', '115');
// Verify blurry alpha shadow.
-d = ctx.getImageData(405, 405, 1, 1).data;
+d = ctx.getImageData(505, 450, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '22');
+shouldBeAround('d[3]', '70');
-d = ctx.getImageData(415, 495, 1, 1).data;
+d = ctx.getImageData(505, 450, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '15');
+shouldBeAround('d[3]', '70');
-d = ctx.getImageData(450, 504, 1, 1).data;
+d = ctx.getImageData(450, 405, 1, 1).data;
shouldBe('d[0]', '255');
shouldBe('d[1]', '0');
shouldBe('d[2]', '0');
-shouldBeAround('d[3]', '17');
+shouldBeAround('d[3]', '69');
var successfullyParsed = true;
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-transforms-fillRect-shadow.js b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-transforms-fillRect-shadow.js
new file mode 100644
index 0000000..b67f244
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-transforms-fillRect-shadow.js
@@ -0,0 +1,133 @@
+description("Ensure correct behavior of canvas with fillRect+shadow after translation+rotation+scaling. A blue and red checkered pattern should be displayed.");
+
+function print(message, color)
+{
+ var paragraph = document.createElement("div");
+ paragraph.appendChild(document.createTextNode(message));
+ paragraph.style.fontFamily = "monospace";
+ if (color)
+ paragraph.style.color = color;
+ document.getElementById("console").appendChild(paragraph);
+}
+
+function shouldBeAround(a, b)
+{
+ var evalA;
+ try {
+ evalA = eval(a);
+ } catch(e) {
+ evalA = e;
+ }
+
+ if (Math.abs(evalA - b) < 10)
+ print("PASS " + a + " is around " + b , "green")
+ else
+ print("FAIL " + a + " is not around " + b + " (actual: " + evalA + ")", "red");
+}
+
+var canvas = document.createElement('canvas');
+document.body.appendChild(canvas);
+canvas.setAttribute('width', '600');
+canvas.setAttribute('height', '600');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(0, 0, 255, 1.0)';
+ctx.shadowOffsetX = 100;
+ctx.shadowOffsetY = 100;
+
+ctx.translate(-100, -100);
+ctx.rotate(Math.PI/2);
+ctx.scale(2, 2);
+
+ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
+ctx.fillRect(100, -150, 50, 50);
+
+ctx.shadowColor = 'rgba(255, 0, 0, 0.5)';
+ctx.fillRect(200, -150, 50, 50);
+
+ctx.shadowBlur = 5;
+ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
+ctx.fillRect(100, -250, 50, 50);
+
+ctx.shadowColor = 'rgba(255, 0, 0, 0.5)';
+ctx.fillRect(200, -250, 50, 50);
+
+var d; // imageData.data
+
+// Verify solid shadow.
+d = ctx.getImageData(200, 205, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBe('d[3]', '255');
+
+d = ctx.getImageData(298, 298, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBe('d[3]', '255');
+
+d = ctx.getImageData(201, 298, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBe('d[3]', '255');
+
+// Verify solid alpha shadow.
+d = ctx.getImageData(201, 401, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '127');
+
+d = ctx.getImageData(299, 450, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '127');
+
+d = ctx.getImageData(205, 498, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '127');
+
+// Verify blurry shadow.
+d = ctx.getImageData(399, 205, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '106');
+
+d = ctx.getImageData(500, 205, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '106');
+
+d = ctx.getImageData(499, 299, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '83');
+
+// Verify blurry alpha shadow.
+d = ctx.getImageData(398, 405, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '36');
+
+d = ctx.getImageData(405, 501, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '36');
+
+d = ctx.getImageData(405, 501, 1, 1).data;
+shouldBe('d[0]', '255');
+shouldBe('d[1]', '0');
+shouldBe('d[2]', '0');
+shouldBeAround('d[3]', '36');
+
+var successfullyParsed = true;