OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <title>drawSystemFocusRing() dirty rect test</title> |
| 5 <script src="../../resources/js-test.js"></script> |
| 6 </head> |
| 7 <body> |
| 8 <p>This test is passed if result1 is exactly the same with result2.</p> |
| 9 <p> |
| 10 <button id="result1">Result1</button> |
| 11 <button id="result2">Result2</button> |
| 12 </p> |
| 13 <canvas id="canvas" class="output" width="300" height="300"> |
| 14 <button id="button"></button> |
| 15 </canvas> |
| 16 <script> |
| 17 |
| 18 var canvas = document.getElementById("canvas"); |
| 19 var context = canvas.getContext("2d"); |
| 20 var button = document.getElementById("button"); |
| 21 var result1 = document.getElementById("result1"); |
| 22 var result2 = document.getElementById("result2"); |
| 23 |
| 24 function drawResult(separateFrame) { |
| 25 |
| 26 button.focus(); |
| 27 |
| 28 requestAnimationFrame(function() { |
| 29 context.beginPath(); |
| 30 context.rect(0, 0, 300, 300); |
| 31 context.fill(); |
| 32 |
| 33 context.beginPath(); |
| 34 context.rect(50, 50, 200, 100); |
| 35 |
| 36 if (separateFrame) |
| 37 requestAnimationFrame(function() { |
| 38 context.drawSystemFocusRing(button); |
| 39 }); |
| 40 else |
| 41 context.drawSystemFocusRing(button); |
| 42 }); |
| 43 } |
| 44 |
| 45 result1.addEventListener("click", function() { |
| 46 drawResult(false); |
| 47 }, false); |
| 48 |
| 49 result2.addEventListener("click", function() { |
| 50 drawResult(true); |
| 51 }, false); |
| 52 |
| 53 </script> |
| 54 </body> |
| 55 </html> |
OLD | NEW |