<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../resources/gesture-util.js"></script>
<script src="../../../../resources/testdriver.js"></script>
<script src="../../../../resources/testdriver-actions.js"></script>
<script src="../../../..//resources/testdriver-vendor.js"></script>
<style>
#draggableDiv {
background-color: teal;
height: 100px;
width: 100px;
}
#draggableText {
/* Leave adequate margin to avoid ambiguity due to touch adjustment. */
margin-top: 20px;
}
</style>
</head>
<body>
<p>This test checks long press behavior when both touch drag/drop and touch editing are enabled.<br>
1. Check that long press on a draggable element starts drag.<br>
2. Check that long press on non-draggable text selects the text.<br>
3. Check that long press on selected text starts drag.</p>
<div id="draggableDiv" draggable='true'>Drag me</div>
<div><span id='draggableText'>Some text</span></div>
<script>
if (window.internals)
internals.settings.setTouchDragDropEnabled(true);
function dragStartEvent(test, target) {
return new Promise((resolve, reject) => {
const dragStartListener = (event) => {
event.preventDefault();
resolve(event.target);
}
const pointerupListener = (event) => {
reject('missing dragstart event');
}
target.addEventListener('dragstart', dragStartListener);
document.addEventListener('pointerup', pointerupListener);
test.add_cleanup(() => {
target.removeEventListener('dragstart', dragStartListener);
document.removeEventListener('pointerup', pointerupListener);
});
});
}
promise_test(async t => {
preventContextMenu(t);
const draggableDiv = document.getElementById('draggableDiv');
const dragPromise = dragStartEvent(t, draggableDiv);
const longpressOptions = { duration: 1200 };
await touchLongPressElement(draggableDiv, longpressOptions);
const result = await dragPromise;
assert_equals(result.id, 'draggableDiv');
}, 'Long-press on a draggable element');
promise_test(async t => {
preventContextMenu(t);
const draggableText = document.getElementById('draggableText');
// Position long-press off-center to select the second word.
const longpressOptions = { x: 20, duration: 1200 };
await touchLongPressElement(draggableText, longpressOptions);
assert_equals(document.getSelection().toString(), 'text');
const dragPromise = dragStartEvent(t, draggableText);
await touchLongPressElement(draggableText, longpressOptions);
const result = await dragPromise;
assert_equals(result.data, 'Some text');
}, 'Long-press text editing');
</script>
</body>
</html>
Codebase Browser
chromium