70 lines
2.8 KiB
HTML
70 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<style>
|
|
div {
|
|
width: 400px;
|
|
height: 400px;
|
|
}
|
|
</style>
|
|
<body>
|
|
<div></div>
|
|
<script>
|
|
function loadImageAndSetBackground(element, image, src, forceAsyncImageDrawing) {
|
|
return new Promise((resolve) => {
|
|
image.onload = (() => {
|
|
if (window.internals && window.testRunner && forceAsyncImageDrawing) {
|
|
// Force async image decoding for this image.
|
|
internals.setLargeImageAsyncDecodingEnabledForTesting(image, true);
|
|
|
|
image.addEventListener("webkitImageFrameReady", function() {
|
|
internals.setLargeImageAsyncDecodingEnabledForTesting(image, false);
|
|
setTimeout(function() {
|
|
// Force redraw to get the red image drawn.
|
|
testRunner.display();
|
|
resolve();
|
|
}, 0);
|
|
}, false);
|
|
|
|
// Change the background of the element.
|
|
element.style.backgroundImage = 'url(' + image.src + ')';
|
|
|
|
// Force layout and display so the image gets drawn.
|
|
document.body.offsetHeight;
|
|
testRunner.display();
|
|
} else {
|
|
// Change the background of the element.
|
|
element.style.backgroundImage = 'url(' + image.src + ')';
|
|
resolve();
|
|
}
|
|
});
|
|
image.src = src;
|
|
});
|
|
}
|
|
|
|
(function() {
|
|
if (window.internals && window.testRunner) {
|
|
internals.clearMemoryCache();
|
|
internals.settings.setWebkitImageReadyEventEnabled(true);
|
|
internals.settings.setLargeImageAsyncDecodingEnabled(true);
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
var image = new Image;
|
|
document.body.appendChild(image);
|
|
var element = document.querySelector("div");
|
|
|
|
// Load a large (400x400) red image to force sync image decoding and drawing.
|
|
loadImageAndSetBackground(element, image, "resources/red-400x400.png", true).then(() => {
|
|
// Replace the large red image with a large (400x400) green image.
|
|
// Sync image decoding and drawing have to be forced in this case.
|
|
return loadImageAndSetBackground(element, image, "resources/green-400x400.png", false);
|
|
}).then(() => {
|
|
image.remove();
|
|
// A single paint is needed to draw the large (400x400) green image.
|
|
if (window.testRunner)
|
|
testRunner.notifyDone();
|
|
});
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html> |