<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../editing/assert_selection.js"></script>
<script>
test(() => {
  assert_not_equals(window.eventSender, undefined,
    'This test requires eventSender.');

  assert_selection(
    '<span>Dragme</span><input>',
    selection => {
        function mouseMoveTo(element) {
            const mouseX  = element.offsetParent.offsetLeft +
                            element.offsetLeft +
                            element.offsetWidth / 2 +
                            selection.document.offsetLeft;
            const mouseY = element.offsetParent.offsetTop +
                           element.offsetTop +
                           element.offsetHeight / 2 +
                           selection.document.offsetTop;
            eventSender.mouseMoveTo(mouseX, mouseY);
        }

        const input = selection.document.querySelector('input');
        const span = selection.document.querySelector('span');

        input.addEventListener('focus', () => input.remove());

        // Double click at center of SPAN
        mouseMoveTo(span);
        eventSender.mouseDown();
        eventSender.mouseUp();
        eventSender.mouseDown();
        eventSender.mouseUp();

        // Start drag
        eventSender.leapForward(1000);
        eventSender.mouseDown();

        // Drop at center of INPUT
        eventSender.leapForward(500);
        mouseMoveTo(input);
        eventSender.leapForward(500);
        eventSender.mouseUp();
    },
    '<span>Dragme|</span>');
}, 'Drag-and-drop to removed INPUT');
</script>