<!DOCTYPE html>
<html>
<body>
<div id="reference" style="position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: yellow; z-index: 1"></div>

<div style="position: absolute; z-index: 2">
    <p>This test checks that the yellow reference DOM node (which should be as
    big as the window) gets resized when the window is resized.</p>
    
    <p>To avoid relayouts and repaints caused by DOM-based logging, it doesn't
    output anything. Please check the console for confirmation that the node
    dimensions increase by 10x10.</p>
</div>
<script>
    if (window.testRunner) {
        testRunner.dumpAsText();
        testRunner.waitUntilDone();
    }
    var referenceNode = document.getElementById('reference');
    console.log('Initial reference node dimensions ' +
        referenceNode.offsetWidth + ' x ' + referenceNode.offsetHeight);
    console.log('Increasing window size by 10 x 10');
    addEventListener('resize', finishTest);
    var widthBefore = innerWidth;
    resizeBy(10, 10);
    function finishTest() {
        if (innerWidth != widthBefore + 10)
            return;
        console.log('Post-resize reference node dimensions ' +
            referenceNode.offsetWidth + ' x ' + referenceNode.offsetHeight);
        if (window.testRunner)
            testRunner.notifyDone();
    }
</script>

</body>
</html>
