<!DOCTYPE html>
<html>
<head>
    <script src="../../../../resources/js-test-pre.js"></script>
    <script src="../../../../resources/basic-gestures.js"></script>
    <style>
        body {
            margin: none;
            touch-action: none;
        }
    </style>
    <meta name="viewport" content="initial-scale=1">
</head>
<body>
    <p id="description"></p>
    <div id="console">
    </div>
    <script>
        description("Test that a drag is registered as a pointerdown, then pointermoves, then pointerup.");
        window.jsTestIsAsync = true;

        function runTest()
        {
            window.addEventListener("pointerdown", event => debug("pointerdown fired."));

            let seenMove = false;
            window.addEventListener("pointermove", event => {
                if (!seenMove)
                    debug("At least one pointermove was fired.");
                seenMove = true;
            });

            window.addEventListener("pointerup", event => {
                debug("pointerup fired.");
                finishJSTest();
            });

            if (window.testRunner)
                touchAndDragFromPointToPoint(50, 50, 40, 40).then(() => liftUpAtPoint(40, 40));
        }

        window.addEventListener("load", runTest, false);
    </script>
    <script src="../../../../resources/js-test-post.js"></script>
</body>
</html>