<script src="../../../../resources/js-test.js"></script>
<script src="../../../../resources/ui-helper.js"></script>
<script>
jsTestIsAsync = true;
touchEndEventCount = 0;

async function runTest()
{
    let output = "";
    window.addEventListener("touchstart", function(event) {
        event.preventDefault();
        testPassed(`touchstart on window - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false });

    window.addEventListener("touchmove", function(event) {
        event.preventDefault();
        testPassed(`touchmove on window - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false, "once": true });

    window.addEventListener("touchend", function(event) {
        event.preventDefault();
        testPassed(`touchend on window - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
        touchEndEventCount++;
    }, { "passive": false });

    document.addEventListener("touchstart", function(event) {
        event.preventDefault();
        testPassed(`touchstart on document - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false });

    document.addEventListener("touchmove", function(event) {
        event.preventDefault();
        testPassed(`touchmove on document - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false, "once": true });

    document.addEventListener("touchend", function(event) {
        event.preventDefault();
        testPassed(`touchend on document - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
        touchEndEventCount++;
    }, { "passive": false });

    document.documentElement.addEventListener("touchstart", function(event) {
        event.preventDefault();
        testPassed(`touchstart on documentElement - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false });

    document.documentElement.addEventListener("touchmove", function(event) {
        event.preventDefault();
        testPassed(`touchmove on documentElement - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false, "once": true });

    document.documentElement.addEventListener("touchend", function(event) {
        event.preventDefault();
        testPassed(`touchend on documentElement - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
        touchEndEventCount++;
    }, { "passive": false });

    let body = document.querySelector("body");

    body.addEventListener("touchstart", function(event) {
        event.preventDefault();
        testPassed(`touchstart on body - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false });

    body.addEventListener("touchmove", function(event) {
        event.preventDefault();
        testPassed(`touchmove on body - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
    }, { "passive": false, "once": true });

    body.addEventListener("touchend", function(event) {
        event.preventDefault();
        testPassed(`touchend on body - cancelable: ${event.cancelable} defaultPrevented: ${event.defaultPrevented}`);
        touchEndEventCount++;
    }, { "passive": false });

    if (window.testRunner && testRunner.runUIScript) {
        description("This test verifies that active touchstart and touchend event listeners can be added to document, window, documentElement, and body. This test requires WebKitTestRunner.");
        await UIHelper.dragFromPointToPoint(50, 250, 50, 30, 0.1);
        await new Promise(resolve => shouldBecomeEqual("touchEndEventCount", "4", resolve));
        finishJSTest();
    }
}

window.addEventListener('load', runTest, false);
</script>
<body style="height: 500vh">
<div id=output>
This test requires UIScriptController to run.
</div>
</body>