<!DOCTYPE html>
<html>
<head>
<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
<link rel="stylesheet" href="resources/external.css">
<script>
function addSubframe() {
    let iframe = document.createElement("iframe");
    iframe.id = "subframe";
    iframe.src = "resources/stylesheet-events-subframe.html";
    document.body.appendChild(iframe);
}

function removeSubframe() {
    document.getElementById("subframe").remove();
}

function test()
{
    function logStyleSheets() {
        WI.cssStyleManager.styleSheets.sort((a, b) => a.url.localeCompare(b.url)).forEach((styleSheet) => {
            let frameString = styleSheet.parentFrame.id === WI.frameResourceManager.mainFrame.id ? "<mainframe>" : "<childframe>";
            InspectorTest.log(`URL: ${sanitizeURL(styleSheet.url)} ${frameString}`);
        });
    }

    let suite = InspectorTest.createAsyncSuite("CSS.StyleSheetEvents.MultipleDocuments");

    suite.addTestCase({
        name: "CheckStyleSheets",
        description: "Ensure there is currently one stylesheet.",
        test(resolve, reject) {
            InspectorTest.expectThat(WI.cssStyleManager.styleSheets.length === 1, "Should be one stylesheets.");
            logStyleSheets();
            resolve();
        }
    });

    suite.addTestCase({
        name: "CheckStyleSheetsAfterAddingSubframe",
        description: "Ensure subframe stylesheets are added.",
        test(resolve, reject) {
            WI.cssStyleManager.awaitEvent(WI.CSSStyleManager.Event.StyleSheetAdded)
            .then((event) => {
                InspectorTest.expectThat(WI.cssStyleManager.styleSheets.length === 2, "Should be two stylesheets.");
                InspectorTest.expectThat(event.data.styleSheet.parentFrame !== WI.frameResourceManager.mainFrame.id, "New StyleSheet is for a subframe");
                logStyleSheets();
            })
            .then(resolve, reject);

            InspectorTest.evaluateInPage("addSubframe()");
        }
    });

    suite.addTestCase({
        name: "CheckStyleSheetsAfterRemovingSubframe",
        description: "Ensure subframe stylesheets are removed.",
        test(resolve, reject) {
            WI.cssStyleManager.awaitEvent(WI.CSSStyleManager.Event.StyleSheetRemoved)
            .then((event) => {
                InspectorTest.expectThat(WI.cssStyleManager.styleSheets.length === 1, "Should be one stylesheet.");
                InspectorTest.expectThat(event.data.styleSheet.parentFrame !== WI.frameResourceManager.mainFrame.id, "Removed StyleSheet is for a subframe");
                logStyleSheets();
            })
            .then(resolve, reject);

            InspectorTest.evaluateInPage("removeSubframe()");
        }
    });

    suite.runTestCasesAndFinish();
}
</script>
</head>
<body onload="runTest()">
    <p>CSS.styleSheetAdded and CSS.styleSheetRemoved for multiple documents.</p>
</body>
</html>