<!DOCTYPE html>
<meta charset="utf-8">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="resources/callback-function-detached-frame-common.js"></script>

<body>

<div id="rafTestRoot" style="width: 100px; height: 100px"></div>

<script>
const IFRAME_SRC = "resources/callback-function-detached-frame-raf-iframe.html";

promise_test(async t => {
    window.__raf0Calls__ = 0;

    const iframe = await createIframe(t, IFRAME_SRC);
    iframe.contentWindow.raf("__raf0Calls__");

    scheduleRepaint();
    await sleep(100);

    assert_equals(window.__raf0Calls__, 1);
}, "Callback function, originated in an <iframe>, is invoked if <iframe> is connected");

promise_test(async t => {
    window.__raf1Calls__ = 0;

    const iframe = await createIframe(t, IFRAME_SRC);
    iframe.contentWindow.raf("__raf1Calls__", Function);

    iframe.remove();
    assert_equals(iframe.contentWindow, null);

    scheduleRepaint();
    await sleep(100);

    assert_equals(window.__raf1Calls__, 1);
}, "Callback function, originated in an <iframe> via main window's Function constructor, is invoked even if <iframe> is disconnected");

promise_test(async t => {
    window.__raf2Calls__ = 0;

    const iframe = await createIframe(t, IFRAME_SRC);
    iframe.contentWindow.raf("__raf2Calls__");

    iframe.remove();
    assert_equals(iframe.contentWindow, null);

    scheduleRepaint();
    await sleep(100);

    assert_equals(window.__raf2Calls__, 0);
}, "Callback function, originated in an <iframe>, is not invoked if <iframe> is disconnected");

function scheduleRepaint() {
    rafTestRoot.style.height = `${parseInt(rafTestRoot.style.height) + 10}px`;
}
</script>