| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| iframe { |
| width: 200px; |
| height: 100px; |
| } |
| </style> |
| </head> |
| <body> |
| <iframe frameBorder="0" srcdoc="<body style='image-rendering: crisp-edges; background-position: -100px -33000px; background-size: 400px 66200px;'></body>"></iframe> |
| <script> |
| function setElementImageBackground(element, image) { |
| return new Promise((resolve) => { |
| element.style.backgroundImage = 'url(' + image.src + ')'; |
| |
| // Force layout and display so the image frame starts decoding |
| document.body.offsetHeight; |
| testRunner.display(); |
| |
| element.addEventListener("webkitImageFrameReady", function() { |
| resolve(); |
| }, false); |
| }); |
| } |
| |
| (function() { |
| if (window.internals && window.testRunner) { |
| internals.clearMemoryCache(); |
| internals.settings.setWebkitImageReadyEventEnabled(true); |
| internals.settings.setLargeImageAsyncDecodingEnabled(true); |
| testRunner.waitUntilDone(); |
| } |
| |
| var image = new Image(); |
| image.onload = function() { |
| // Force async image decoding for this image. |
| if (window.internals) |
| internals.setLargeImageAsyncDecodingEnabledForTesting(image, true); |
| |
| var iframeDocument = document.querySelector('iframe').contentWindow.document; |
| |
| if (window.internals && window.testRunner) { |
| setElementImageBackground(iframeDocument.querySelector("body"), image).then(() => { |
| testRunner.notifyDone(); |
| }); |
| } else |
| iframeDocument.querySelector("body").style.backgroundImage = 'url(' + image.src + ')'; |
| } |
| image.src = "resources/sprite-sheet-red-green-blue.png"; |
| })(); |
| </script> |
| </body> |
| </html> |
