image-zoom-to-25.html | Explore in Territory

<!DOCTYPE html>
<html>
<script>
if (window.testRunner) {
    testRunner.dumpAsText();
    testRunner.setPopupBlockingEnabled(false);
    testRunner.waitUntilDone();
}

function log(message)
{
    var console = document.getElementById("console");
    console.appendChild(document.createTextNode(message + "\n"));
}

function zoomPage()
{
    var newwindow = window.open("resources/dice.png");
    newwindow.onload = async function() {

        var image = newwindow.document.querySelector("img");
        var resizePromise = new Promise(resolve => newwindow.onresize = resolve);
        newwindow.resizeTo(200, 200);
        await resizePromise;

        for (var count = 0; count < 6; ++count) {
            testRunner.zoomPageOut();
            var w = Math.round(image.clientWidth);
            var h = Math.round(image.clientHeight);
            log("Size at zoom level" + (count) + " : "  + w + " x " + h);
        }
        testRunner.notifyDone();
    };
}
</script>
<body onload="zoomPage()">
<p>This tests that page zoom and image auto-sizing interact well together.  This test requires testRunner to run.  To test manually, open <a href="resources/dice.png">this image</a> in a browser window, resize the window to 200px tall and zoom out 6 times.  The image should get smaller at each step.</p>
<pre id="console"></pre>
</body>
</html>
chromium/third_party/blink/web_tests/images/image-zoom-to-25.html
