OLD | NEW |
1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
2 <head> | 2 <head> |
3 <title>Canvas test: drawFocusIfNeeded</title> | 3 <title>Canvas test: drawFocusIfNeeded with Path2D</title> |
4 <script src="../../resources/js-test.js"></script> | 4 <script src="../../resources/js-test.js"></script> |
5 </head> | 5 </head> |
6 <body style="padding: 0; margin: 0"> | 6 <body style="padding: 0; margin: 0"> |
7 <canvas id="canvas" class="output" width="300" height="350"> | 7 <canvas id="canvas" class="output" width="300" height="350"> |
8 <button id="button1"></button> | 8 <button id="button1"></button> |
9 <button id="button2"></button> | 9 <button id="button2"></button> |
10 </canvas> | 10 </canvas> |
11 <script> | 11 <script> |
12 if (window.testRunner) | 12 if (window.testRunner) |
13 testRunner.dumpAsText(); | 13 testRunner.dumpAsText(); |
14 | 14 |
15 document.getElementById("button1").focus(); | 15 document.getElementById("button1").focus(); |
16 | 16 |
17 var canvas = document.getElementById("canvas").getContext("2d"); | 17 var canvas = document.getElementById("canvas").getContext("2d"); |
18 | 18 |
| 19 shouldThrow('canvas.drawFocusIfNeeded(undefined);'); |
| 20 shouldThrow('canvas.drawFocusIfNeeded(undefined, undefined);'); |
19 shouldThrow('canvas.drawFocusIfNeeded(null);'); | 21 shouldThrow('canvas.drawFocusIfNeeded(null);'); |
| 22 shouldThrow('canvas.drawFocusIfNeeded(null, null);'); |
20 shouldThrow('canvas.drawFocusIfNeeded();'); | 23 shouldThrow('canvas.drawFocusIfNeeded();'); |
21 | 24 |
22 canvas.beginPath(); | 25 var path = new Path2D(); |
23 canvas.rect(50, 50, 200, 100); | 26 path.rect(50, 50, 200, 100); |
24 canvas.fillStyle = "#ccf"; | 27 canvas.fillStyle = "#ccf"; |
25 canvas.fill(); | 28 canvas.fill(path); |
26 // re-test null case after having defined a path (regression test for crbug.com/
353248) | 29 // re-test null case after having defined a path (regression test for crbug.com/
353248) |
27 shouldThrow('canvas.drawFocusIfNeeded(null);'); | 30 shouldThrow('canvas.drawFocusIfNeeded(null);'); |
28 canvas.drawFocusIfNeeded(document.getElementById("button1")); | 31 shouldThrow('canvas.drawFocusIfNeeded(null, null);'); |
| 32 canvas.drawFocusIfNeeded(path, document.getElementById("button1")); |
29 | 33 |
30 canvas.beginPath(); | 34 path = new Path2D(); |
31 canvas.rect(50, 200, 200, 100); | 35 path.rect(50, 200, 200, 100); |
32 canvas.fillStyle = "#cfc"; | 36 canvas.fillStyle = "#cfc"; |
33 canvas.fill(); | 37 canvas.fill(path); |
34 canvas.drawFocusIfNeeded(document.getElementById("button2")); | 38 canvas.drawFocusIfNeeded(path, document.getElementById("button2")); |
35 | 39 |
36 // The top rect"s focus ring is tied to button1, which is focused. | 40 // The top rect"s focus ring is tied to button1, which is focused. |
37 // It should have an outline in some color other than the background color. | 41 // It should have an outline in some color other than the background color. |
38 var imageData = canvas.getImageData(49, 50, 1, 1); | 42 var imageData = canvas.getImageData(49, 50, 1, 1); |
39 var data = imageData.data; | 43 var data = imageData.data; |
40 shouldBe("data[0] != 0 || data[1] != 0 || data[2] != 0", "true"); | 44 shouldBe("data[0] != 0 || data[1] != 0 || data[2] != 0", "true"); |
41 | 45 |
42 // The bottom rect"s focus ring is tied to button2, which is not focused. | 46 // The bottom rect"s focus ring is tied to button2, which is not focused. |
43 imageData = canvas.getImageData(49, 200, 1, 1); | 47 imageData = canvas.getImageData(49, 200, 1, 1); |
44 data = imageData.data; | 48 data = imageData.data; |
45 shouldBe("data[0] == 0 && data[1] == 0 && data[2] == 0", "true"); | 49 shouldBe("data[0] == 0 && data[1] == 0 && data[2] == 0", "true"); |
46 </script> | 50 </script> |
47 </body> | 51 </body> |
OLD | NEW |