line-height-zoom-get-computed-style.html

<!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 el = document.getElementById('test');

    if (window.testRunner) {
        var count=0;
        while(count <10) {
            testRunner.zoomPageIn();
            var num = parseFloat(document.defaultView.getComputedStyle(el, null).getPropertyValue('line-height'));
            log("Line height at zoom level" + (count) + " : " + num.toFixed(2));
            ++count;
            if (count == 10)
                testRunner.notifyDone();
        }
    } else {
        var num = parseFloat(document.defaultView.getComputedStyle(el, null).getPropertyValue('line-height'));
        log("Line height is" + " : " + num.toFixed(2));
    }
}

</script>
<head>
<style type="text/css">
p {
display: inline-block;
background-color: #000;
color: #fff;
line-height: 120%;
}
p:hover {
background-color: #fff;
color: #000;
}
</style>
</head>
<body onload="zoomPage()">
<p id="test">This tests that page zoom and getComputedStyle of line-height works well together.  This test requires testRunner to run.  To test manually, open this page in a browser window, and zoom in & reload for about 10 times. This text should get bigger at each step proportionately and the line-height should be constant.</p>
<pre id="console"></pre>
</body>
</html>
chromium/third_party/blink/web_tests/fast/css/line-height-zoom-get-computed-style.html
