| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
| <title>Canvas Incremental Repaint</title> |
| <style type="text/css" media="screen"> |
| canvas { |
| width: 200px; |
| height: 150px; |
| border: 20px solid black; |
| } |
| </style> |
| <script type="text/javascript" charset="utf-8"> |
| |
| if (window.testRunner) { |
| testRunner.dumpAsText(true); |
| testRunner.waitUntilDone(); |
| } |
| |
| function runRepaintTest() |
| { |
| if (window.testRunner) { |
| document.body.offsetTop; |
| testRunner.displayAndTrackRepaints(); |
| repaintTest(); |
| testRunner.notifyDone(); |
| } else { |
| setTimeout(repaintTest, 0); |
| } |
| } |
| |
| function repaintTest() |
| { |
| var canvas = document.getElementById('canvas1'); |
| var ctx = canvas.getContext('2d'); |
| |
| ctx.fillStyle = 'green'; |
| |
| ctx.save(); |
| ctx.setTransform(1, 0, 0, 1, 50, 200); |
| // Test the the transform applies the matrix in the correct order. |
| ctx.transform(1, 0, 0, -1, 0, 0); |
| ctx.fillRect(0, 100, 200, 80); |
| ctx.restore(); |
| } |
| |
| </script> |
| </head> |
| <body onload="runRepaintTest()"> |
| <canvas id="canvas1"></canvas> |
| </body> |
| </html> |