| <!DOCTYPE html> |
| <html> |
| <head> |
| </head> |
| <body> |
| <p>This test passes if you see a green box below (possibly with a green border).</p> |
| <img id="image"> |
| <div style="position: relative;"> |
| <canvas id="canvas" width="100" height="100"></canvas> |
| <div style="position: absolute; left: -3px; top: -3px; width: 6px; height: 106px; background: green;"></div> |
| <div style="position: absolute; left: 97px; top: -3px; width: 6px; height: 106px; background: green;"></div> |
| <div style="position: absolute; left: -3px; top: -3px; width: 106px; height: 6px; background: green;"></div> |
| <div style="position: absolute; left: -3px; top: 97px; width: 106px; height: 6px; background: green;"></div |
| </div> |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| } |
| // Emulate a big PDF on iOS (which has the PDFImageCachingPolicy set to BelowMemoryLimit). |
| if (window.internals) |
| internals.settings.setPDFImageCachingPolicy("Disabled"); |
| let canvas = document.getElementById("canvas"); |
| let context = canvas.getContext("2d"); |
| let image = document.getElementById("image"); |
| image.addEventListener("load", function() { |
| var state = 0; |
| function tick() { |
| context.drawImage(image, 0, 0, 100, 100); |
| if (state < 10) { |
| context.fillRect(0, 0, 100, 100); |
| ++state; |
| requestAnimationFrame(tick); |
| } else { |
| image.style.display = "none"; |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| } |
| requestAnimationFrame(tick); |
| }); |
| image.src = "resources/green_rectangle.pdf"; |
| </script> |
| </body> |
| </html> |