| <!DOCTYPE html> |
| <style> |
| canvas { |
| position: absolute; |
| width: 600px; |
| height: 500px; |
| top: 50px; |
| left: 50px; |
| /* object-fit and object-position make the content of the canvas not affected |
| by the resize in repaintTest(). */ |
| object-fit: contain; |
| object-position: 0 0; |
| background-color: #030; |
| } |
| </style> |
| Tests paint invalidation of canvas when it's resized which doesn't affect its contents. Passes if there is only incremental invalidation for the resized background. |
| <canvas id="canvas" width="500" height="500"></canvas> |
| |
| <script src="resources/text-based-repaint.js"></script> |
| <script> |
| function repaintTest() { |
| document.getElementById('canvas').style.width = '500px'; |
| } |
| onload = runRepaintAndPixelTest; |
| |
| var ctx = document.getElementById('canvas').getContext('2d'); |
| ctx.beginPath(); |
| ctx.arc(250, 250, 250, 0, 2 * Math.PI); |
| ctx.fillStyle = 'green'; |
| ctx.fill(); |
| </script> |