<!doctype html>
<html>
<head>
<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
<script>
function test()
{
    let suite = InspectorTest.createAsyncSuite("DOM.highlightNodeList");

    let mainFrame = WI.frameResourceManager.mainFrame;
    let childFrames = mainFrame.childFrameCollection.toArray();
    InspectorTest.expectEqual(childFrames.length, 1, "Page should have a subframe.");

    const highlightConfig = {
        showInfo: true,
        contentColor: {r: 255, g: 255, b: 255},
        paddingColor: {r: 255, g: 255, b: 255},
        borderColor: {r: 255, g: 255, b: 255},
        marginColor: {r: 255, g: 255, b: 255},
    };

    function getHighlight(callback) {
        InspectorTest.evaluateInPage("window.internals.inspectorHighlightObject()", (error, value, wasThrown) => {
            InspectorTest.assert(!error, "Unexpected error dumping highlight: " + error);
            InspectorTest.assert(!wasThrown, "Unexpected exception when dumping highlight.");
            callback(JSON.parse(value));
        });
    }

    function dumpHighlight(expectedElements, callback) {
        getHighlight((highlightPayloadList) => {
            InspectorTest.expectThat(highlightPayloadList.length === expectedElements, `Should highlight ${expectedElements} element(s).`);
            if (highlightPayloadList.length) {
                InspectorTest.log("Highlighted Elements:");
                for (let highlightPayload of highlightPayloadList)
                    InspectorTest.log(JSON.stringify(highlightPayload.elementData, null, 2));
            }
            callback();
        });
    }

    let mainFrameDocumentNodeId = 0;
    let childFrameDocumentNodeId = 0;

    suite.addTestCase({
        name: "DOM.highlightNodeList.CheckEmptyHighlight",
        description: "Check that highlight list is initially empty.",
        test(resolve, reject) {
            getHighlight((highlightObjectPayload) => {
                InspectorTest.expectEqual(highlightObjectPayload.length, 0, "Highlight should not exist.");
                resolve();
            });
        }
    });

    suite.addTestCase({
        name: "DOM.highlightNodeList.emptyNodeList",
        description: "Checks that an empty array highlights no elements.",
        test(resolve, reject) {
            DOMAgent.highlightNodeList([], highlightConfig, (error) => {
                if (error) {
                    reject(error);
                    return;
                }

                const expectedElements = 0;
                dumpHighlight(expectedElements, resolve);
            });
        }
    });

    suite.addTestCase({
        name: "DOM.highlightNodeList.mainFrameNode",
        description: "Should highlight all div in the main frame.",
        test(resolve, reject) {
            WI.domTreeManager.querySelectorAll(mainFrameDocumentNodeId, "div", (nodeIds) => {
                DOMAgent.highlightNodeList(nodeIds, highlightConfig, (error) => {
                    if (error) {
                        reject(error);
                        return;
                    }

                    const expectedElements = 3;
                    dumpHighlight(expectedElements, resolve);
                });
            });
        }
    });

    suite.addTestCase({
        name: "DOM.highlightNodeList.childFrameNode",
        description: "Should highlight all div in the child frame.",
        test(resolve, reject) {
            WI.domTreeManager.querySelectorAll(childFrameDocumentNodeId, "div", (nodeIds) => {
                DOMAgent.highlightNodeList(nodeIds, highlightConfig, (error) => {
                    if (error) {
                        reject(error);
                        return;
                    }

                    const expectedElements = 2;
                    dumpHighlight(expectedElements, resolve);
                });
            });
        }
    });

    suite.addTestCase({
        name: "DOM.highlightNodeList.invalidNodeId",
        description: "Bad node id should not cause an error.",
        test(resolve, reject) {
            const invalidNodeId = 9999999;
            DOMAgent.highlightNodeList([invalidNodeId], highlightConfig, (error) => {
                if (error) {
                    reject(error);
                    return;
                }

                const expectedElements = 0;
                dumpHighlight(expectedElements, resolve);
            });
        }
    });

    // ------

    suite.addTestCase({
        name: "DOM.highlightNodeList.nonIntegerNodeId",
        description: "Non-integer item for node id should cause an error.",
        test(resolve, reject) {
            const nonIntegerNodeId = "DOES_NOT_EXIST";
            DOMAgent.highlightNodeList([nonIntegerNodeId], highlightConfig, (error) => {
                InspectorTest.expectThat(error, "Should produce an error.");
                InspectorTest.log("Error: " + error);
                resolve();
            });
        }
    });

    WI.domTreeManager.requestDocument((documentNode) => {
        mainFrameDocumentNodeId = documentNode.id;
        RuntimeAgent.evaluate.invoke({expression: "document", objectGroup: "test", contextId: childFrames[0].pageExecutionContext.id}, (error, remoteObjectPayload) => {
            let remoteObject = WI.RemoteObject.fromPayload(remoteObjectPayload)
            remoteObject.pushNodeToFrontend((documentNodeId) => {
                childFrameDocumentNodeId = documentNodeId;

                suite.runTestCasesAndFinish();
            });
        })
    });
}
</script>
</head>
<body onload="runTest()">
    <p>Tests for the DOM.highlightNodeList command.</p>
    <div style="width: 500px; height: 500px">
        <div class="class-one" style="width: 10px; height: 20px"></div>
        <div id="id-one" class="class-two" style="width:100px; height: 200px"></div>
        <iframe class="class-one" src="resources/highlight-iframe.html"></iframe>
    </div>
</body>
</html>