1 description("Ensure correct behavior when drawing a canvas on a canvas with shadows. A blue and red checkered pattern should be displayed.");
3 function print(message
, color
)
5 var paragraph
= document
.createElement("div");
6 paragraph
.appendChild(document
.createTextNode(message
));
7 paragraph
.style
.fontFamily
= "monospace";
9 paragraph
.style
.color
= color
;
10 document
.getElementById("console").appendChild(paragraph
);
13 function shouldBeAround(a
, b
)
22 if (Math
.abs(evalA
- b
) < 15)
23 print("PASS " + a
+ " is around " + b
, "green")
25 print("FAIL " + a
+ " is not around " + b
+ " (actual: " + evalA
+ ")", "red");
28 var canvas
= document
.createElement('canvas');
29 document
.body
.appendChild(canvas
);
30 canvas
.setAttribute('width', '600');
31 canvas
.setAttribute('height', '600');
32 var ctx
= canvas
.getContext('2d');
33 ctx
.shadowOffsetX
= 100;
34 ctx
.shadowOffsetY
= 100;
36 var aCanvas
= document
.createElement('canvas');
40 var aCtx
= aCanvas
.getContext('2d');
41 aCtx
.fillStyle
= 'rgba(0, 0, 255, 1.0)';
42 aCtx
.fillRect(100, 100, 100, 100);
44 ctx
.shadowColor
= 'rgba(255, 0, 0, 1.0)';
45 ctx
.drawImage(aCanvas
, 0, 0);
47 ctx
.shadowColor
= 'rgba(255, 0, 0, 0.5)';
48 ctx
.drawImage(aCanvas
, 0, 200);
51 ctx
.shadowColor
= 'rgba(255, 0, 0, 1.0)';
52 ctx
.drawImage(aCanvas
, 200, 0);
54 ctx
.shadowColor
= 'rgba(255, 0, 0, 0.5)';
55 ctx
.drawImage(aCanvas
, 200, 200);
57 var d
; // imageData.data
59 // Verify solid shadow.
60 d
= ctx
.getImageData(200, 205, 1, 1).data
;
61 shouldBe('d[0]', '255');
62 shouldBe('d[1]', '0');
63 shouldBe('d[2]', '0');
64 shouldBe('d[3]', '255');
66 d
= ctx
.getImageData(299, 295, 1, 1).data
;
67 shouldBe('d[0]', '255');
68 shouldBe('d[1]', '0');
69 shouldBe('d[2]', '0');
70 shouldBe('d[3]', '255');
72 d
= ctx
.getImageData(200, 299, 1, 1).data
;
73 shouldBe('d[0]', '255');
74 shouldBe('d[1]', '0');
75 shouldBe('d[2]', '0');
76 shouldBe('d[3]', '255');
78 // Verify solid alpha shadow.
79 d
= ctx
.getImageData(200, 405, 1, 1).data
;
80 shouldBe('d[0]', '255');
81 shouldBe('d[1]', '0');
82 shouldBe('d[2]', '0');
83 shouldBeAround('d[3]', '127');
85 d
= ctx
.getImageData(299, 405, 1, 1).data
;
86 shouldBe('d[0]', '255');
87 shouldBe('d[1]', '0');
88 shouldBe('d[2]', '0');
89 shouldBeAround('d[3]', '127');
91 d
= ctx
.getImageData(205, 499, 1, 1).data
;
92 shouldBe('d[0]', '255');
93 shouldBe('d[1]', '0');
94 shouldBe('d[2]', '0');
95 shouldBeAround('d[3]', '127');
97 // Verify blurry shadow.
98 d
= ctx
.getImageData(500, 211, 1, 1).data
;
99 shouldBe('d[0]', '255');
100 shouldBe('d[1]', '0');
101 shouldBe('d[2]', '0');
102 shouldBeAround('d[3]', '100');
104 d
= ctx
.getImageData(399, 205, 1, 1).data
;
105 shouldBe('d[0]', '255');
106 shouldBe('d[1]', '0');
107 shouldBe('d[2]', '0');
108 shouldBeAround('d[3]', '100');
110 d
= ctx
.getImageData(450, 300, 1, 1).data
;
111 shouldBe('d[0]', '255');
112 shouldBe('d[1]', '0');
113 shouldBe('d[2]', '0');
114 shouldBeAround('d[3]', '100');
116 // Verify blurry alpha shadow.
117 d
= ctx
.getImageData(500, 411, 1, 1).data
;
118 shouldBe('d[0]', '255');
119 shouldBe('d[1]', '0');
120 shouldBe('d[2]', '0');
121 shouldBeAround('d[3]', '50');
123 d
= ctx
.getImageData(399, 405, 1, 1).data
;
124 shouldBe('d[0]', '255');
125 shouldBe('d[1]', '0');
126 shouldBe('d[2]', '0');
127 shouldBeAround('d[3]', '50');
129 d
= ctx
.getImageData(450, 500, 1, 1).data
;
130 shouldBe('d[0]', '255');
131 shouldBe('d[1]', '0');
132 shouldBe('d[2]', '0');
133 shouldBeAround('d[3]', '50');