image-zoom-to-500.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(400, 400);
        await resizePromise;

        if (window.testRunner) {
            for (var count = 0; count < 10; ++count) {
                testRunner.zoomPageIn();
                log("Size at zoom level" + (count) + " : "  + image.clientWidth + "x" + image.clientHeight);
            }

            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 600px tall and zoom in 10 times.  The image should get bigger at each step proportionately.</p>
<pre id="console"></pre>
</body>
</html>
chromium/third_party/blink/web_tests/images/image-zoom-to-500.html
