<!DOCTYPE HTML> <html> <!-- https://bugzilla.mozilla.org/show_bug.cgi?id=466586 --> <head> <title>Test for Bug 466586</title> <script src="/tests/SimpleTest/SimpleTest.js"></script> <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> </head> <body onload="loadSmall();"> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=89419">Mozilla Bug 466586</a> <p id="display"></p> <div id="content" style="display: none"> <img id="big" src="big.png"/> </div> <pre id="test"> <script type="application/javascript"> SimpleTest.waitForExplicitFinish(); var jsBig = new Image(); // We have loaded the large png with id "big". We want to test if it will be // kicked out of the cache and thus have to be reloaded, but to ensure that, we // need to get the cache to look at what is there. So we load another image, // this one small. function loadSmall() { // Trivial check, for reference. is(document.getElementById("big").width, 3000, "HTML 'big' image width after page onload()"); var small = new Image(); small.onload = smallLoaded; small.src = "red.png"; } function smallLoaded() { jsBig.src = document.getElementById("big").src; // Check that it is not needed to wait for onload(). is(jsBig.width, 3000, "JS 'big' image width before its onload()"); // Check again after onload(), for reference. jsBig.onload = jsBigLoaded; } function jsBigLoaded() { is(jsBig.width, 3000, "JS 'big' image width after its onload()"); SimpleTest.finish(); } </script> </pre> </body> </html>