<html>
    <head>
        <script src="../../resources/testharness.js"></script>
        <script src="../../resources/testharnessreport.js"></script>
        <script>
            
            function resetField()
            { 
                event.target.value = '';
            }

            function runTest()
            {
                test(() => {
                    assert_own_property(
                        window, 'eventSender',
                        'This test requires eventSender. To test this manually drag the link into the text field.');

                    elementToDrag = document.getElementById("elementToDrag");
                    x1 = elementToDrag.offsetLeft + elementToDrag.offsetWidth / 2;
                    y1 = elementToDrag.offsetTop + elementToDrag.offsetHeight / 2;

                    dragTarget = document.getElementById("dragTarget");
                    x2 = dragTarget.offsetLeft + dragTarget.offsetWidth / 2;
                    y2 = dragTarget.offsetTop + dragTarget.offsetHeight / 2;

                    eventSender.mouseMoveTo(x1,y1);
                    eventSender.mouseDown();
                    eventSender.leapForward(400);
                    eventSender.mouseMoveTo(x2, y2);
                    eventSender.mouseUp();
                    assert_equals(dragTarget.value, elementToDrag.href);

                    //clean up output
                    elementToDrag.parentNode.removeChild(elementToDrag);
                    dragTarget.parentNode.removeChild(dragTarget);
                }, "This tests that we don't lose data dropped onto an input field that changes its content during a drop event");
            }
        </script>
    </head>
    <body>
        <p id="description"></p>
        <a id="elementToDrag" href="http://example.com">A link!</a>
        <input id="dragTarget" type="text" value="Original Text" onfocus="resetField()" />
        <div id="console"></div>
        <script>
             runTest();
        </script>
    </body>
</html>