<!DOCTYPE html>
<html>
<head>
<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
<script>
let callback1 = (event) => { };
let callback2 = (event) => { };

function addListener(name, options) {
    document.addEventListener(name, callback1, options);
}

function removeListener(name) {
    document.removeEventListener(name, callback1);
}

function addAttribute(name, callbackNumber) {
    if (callbackNumber === 1)
        document[name] = callback1;
    else if (callbackNumber === 2)
        document[name] = callback2;
}

function removeAttribute(name) {
    document[name] = null;
}

function click() {
    document.body.click();
}

function test() {
    let node = null;

    function addListener(name, options = {}) {
        InspectorTest.log(`Adding listener "${name}".`);
        InspectorTest.evaluateInPage(`addListener("${name}", ${JSON.stringify(options)})`);
    }

    function removeListener(name) {
        InspectorTest.log(`Removing listener "${name}".`);
        InspectorTest.evaluateInPage(`removeListener("${name}")`);
    }

    function addAttribute(name, callbackNumber) {
        InspectorTest.log(`Adding attribute "${name}" with callback ${callbackNumber}.`);
        InspectorTest.evaluateInPage(`addAttribute("${name}", ${callbackNumber})`);
    }

    function removeAttribute(name) {
        InspectorTest.log(`Removing attribute "${name}".`);
        InspectorTest.evaluateInPage(`removeAttribute("${name}")`);
    }

    function logListeners(expectedCount) {
        return DOMAgent.getEventListenersForNode(node.id).then(({listeners}) => {
            listeners = listeners.filter((listener) => listener.nodeId === node.id);

            InspectorTest.expectEqual(listeners.length, expectedCount, `There should be ${expectedCount} event listeners.`);

            for (let eventListener of listeners)
                InspectorTest.log(`  - "${eventListener.type}"`);
        });
    }

    let suite = InspectorTest.createAsyncSuite("DOM.eventListeners");

    suite.addTestCase({
        name: "DOM.eventListeners.Initial",
        description: "Test that the document has no event listeners.",
        test(resolve, reject) {
            DOMAgent.getEventListenersForNode(node.id).then(({listeners}) => {
                listeners = listeners.filter((listener) => listener.nodeId === node.id);

                InspectorTest.expectEqual(listeners.length, 0, "There should be no event listeners.");

                for (let eventListener of listeners)
                    InspectorTest.log(eventListener.type);
            }).then(resolve, reject);
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.Add",
        description: "Test that adding an event listener is tracked.",
        test(resolve, reject) {
            WI.DOMNode.awaitEvent(WI.DOMNode.Event.EventListenersChanged).then((event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                return logListeners(1);
            }).then(resolve, reject);

            addListener("test");
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.Remove",
        description: "Test that adding an event listener is removed.",
        test(resolve, reject) {
            let eventCount = 0;

            WI.DOMNode.addEventListener(WI.DOMNode.Event.EventListenersChanged, (event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                eventCount++;
                if (eventCount === 1)
                    logListeners(0).then(resolve, reject);
                else
                    reject("Event listeners changed too many times.");
            });

            removeListener("test");
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.AddAndRemove",
        description: "Test that a full add-remove cycle is tracked.",
        test(resolve, reject) {
            let eventCount = 0;

            WI.DOMNode.addEventListener(WI.DOMNode.Event.EventListenersChanged, (event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                eventCount++;
                if (eventCount === 1) {
                    logListeners(1).then(() => {
                        InspectorTest.log("");

                        removeListener("test");
                    });
                } else if (eventCount === 2)
                    logListeners(0).then(resolve, reject);
                else
                    reject("Event listeners changed too many times.");
            });

            addListener("test");
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.Once",
        description: "Test that an event listener that removes itself after firing is tracked.",
        test(resolve, reject) {
            let eventCount = 0;

            WI.DOMNode.addEventListener(WI.DOMNode.Event.EventListenersChanged, (event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                eventCount++;
                if (eventCount === 1) {
                    logListeners(1).then(() => {
                        InspectorTest.log("");
                        InspectorTest.log("Trigger \"click\" event.");

                        InspectorTest.evaluateInPage(`click()`);
                    });
                } else if (eventCount === 2)
                    logListeners(0).then(resolve, reject);
                else
                    reject("Event listeners changed too many times.");
            });

            addListener("click", {once: true});
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.AttributeAddAndRemove",
        description: "Test that adding/removing an event listener via an attribute is tracked.",
        test(resolve, reject) {
            let eventCount = 0;

            WI.DOMNode.addEventListener(WI.DOMNode.Event.EventListenersChanged, (event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                eventCount++;
                if (eventCount === 1) {
                    logListeners(1).then(() => {
                        InspectorTest.log("");

                        removeAttribute("onload");
                    });
                } else if (eventCount === 2)
                    logListeners(0).then(resolve, reject);
                else
                    reject("Event listeners changed too many times.");
            });

            addAttribute("onload", 1);
        }
    });

    suite.addTestCase({
        name: "DOM.eventListeners.AttributeReplace",
        description: "Test that replacing an attribute event listener without removing it is tracked.",
        test(resolve, reject) {
            let eventCount = 0;

            WI.DOMNode.addEventListener(WI.DOMNode.Event.EventListenersChanged, (event) => {
                InspectorTest.assert(event.target === node, "Target should be document node.");

                eventCount++;
                if (eventCount === 1) {
                    logListeners(1).then(() => {
                        InspectorTest.log("");

                        addAttribute("onload", 2);
                    });
                } else if (eventCount === 2) {
                    InspectorTest.log("Attribute event listener replaced.");

                    logListeners(1).then(() => {
                        InspectorTest.log("");

                        removeAttribute("onload");
                    });
                } else if (eventCount === 3)
                    logListeners(0).then(resolve, reject);
                else
                    reject("Event listeners changed too many times.");
            });

            addAttribute("onload", 1);
        }
    });

    WI.domManager.requestDocument(async (documentNode) => {
        node = documentNode;

        InspectorTest.assert(node !== WI.domManager.inspectedNode);
        InspectorTest.log("Changing inspected node to #document...");
        await Promise.all([
            WI.domManager.awaitEvent(WI.DOMManager.Event.InspectedNodeChanged),
            WI.domManager.setInspectedNode(node),
        ]);
        InspectorTest.assert(node === WI.domManager.inspectedNode);

        suite.runTestCasesAndFinish();
    });
}
</script>
</head>
<body onload="runTest()">
    <p>Testing events for adding and removing event listeners.</p>
</body>
</html>