<!DOCTYPE html>
<html>
<body>
<script src="../../resources/js-test.js"></script>
<script>

description('This tests that resize event is not dispatched as a part of updateLayout');
jsTestIsAsync = true;

function createIframe(parentDocument)
{
    const iframe = document.createElement('iframe');
    iframe.style.width = '100px';
    iframe.style.height = '100px';
    parentDocument.body.appendChild(iframe);
    iframe.contentDocument.body.innerHTML = '<span>hello, world</span>';
    return iframe;
}

function updateLayout(iframe)
{
    iframe.contentDocument.querySelector("span").getBoundingClientRect();
}

const iframeA = createIframe(document);
const iframeAA = createIframe(iframeA.contentDocument);
const iframeB = createIframe(document);

const logs = [];
requestAnimationFrame(() => {
    setTimeout(() => {
        iframeAA.contentWindow.addEventListener('resize', () => logs.push('AA'));
        iframeA.contentWindow.addEventListener('resize', () => logs.push('A'));
        iframeB.contentWindow.addEventListener('resize', () => logs.push('B'));

        evalAndLog('iframeB.style.width = "200px"; updateLayout(iframeB)');
        evalAndLog('iframeA.style.width = "200px"; updateLayout(iframeA)');
        evalAndLog('iframeAA.style.width = "200px"; updateLayout(iframeAA)');
        shouldBe('logs.length', '0');
        setTimeout(() => {
            requestAnimationFrame(() => {
                debug('After requestAnimationFrame');
                shouldBe('logs.length', '3');
                shouldBeEqualToString('logs.join(", ")', 'A, AA, B');
                iframeA.remove();
                iframeB.remove();
                finishJSTest();
            });
        }, 0);
    }, 0);
});

</script>
</body>
</html>