mirror of
https://github.com/servo/servo.git
synced 2025-07-12 01:43:43 +01:00
83 lines
3.6 KiB
HTML
83 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>Cut and Paste should trigger corresponding InputEvent</title>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<p>To manually run this test, please follow the steps below:<br/>
|
|
1. Select 'plain' => Cut (e.g. Ctrl/Cmd-X) => Paste (e.g. Ctrl/Cmd-V).<br/>
|
|
2. Select 'rich' => Cut => Paste.<br/>
|
|
3. Select 'prevent' => Paste.<br/>
|
|
4. Select 'prevent' => Cut => Select 'normal' => Paste.<br/>
|
|
<br/>
|
|
If a "PASS" result appears the test passes, otherwise it fails</p>
|
|
<textarea id="test1_plain">plain</textarea>
|
|
<p id="test2_editable" contenteditable><b>rich</b></p>
|
|
<p id="test3_editable_prevent" contenteditable>prevent</p>
|
|
<p id="test3_editable_normal" contenteditable>normal</p>
|
|
<script>
|
|
async_test(t => {
|
|
const expectedEventLog = [
|
|
'cut-[null]', 'beforeinput-deleteByCut', 'input-deleteByCut',
|
|
'paste-[null]', 'beforeinput-insertFromPaste', 'input-insertFromPaste'];
|
|
const actualEventLog = [];
|
|
|
|
for (let eventType of ['beforeinput', 'input', 'cut', 'paste']) {
|
|
document.getElementById('test1_plain').addEventListener(eventType, t.step_func(event => {
|
|
if (event.type === 'beforeinput' && event.inputType === 'insertFromPaste') {
|
|
assert_equals(event.data, 'plain');
|
|
assert_equals(event.dataTransfer, null);
|
|
}
|
|
|
|
actualEventLog.push(`${event.type}-${event.inputType || '[null]'}`);
|
|
if (actualEventLog.length === expectedEventLog.length) {
|
|
assert_array_equals(actualEventLog, expectedEventLog,
|
|
`Expected: ${expectedEventLog}; Actual: ${actualEventLog}.`);
|
|
t.done();
|
|
}
|
|
}));
|
|
}
|
|
}, 'Event order and data on textarea.');
|
|
|
|
async_test(t => {
|
|
const expectedEventLog = [
|
|
'cut-[null]', 'beforeinput-deleteByCut', 'input-deleteByCut',
|
|
'paste-[null]', 'beforeinput-insertFromPaste', 'input-insertFromPaste'];
|
|
const actualEventLog = [];
|
|
|
|
for (let eventType of ['beforeinput', 'input', 'cut', 'paste']) {
|
|
document.getElementById('test2_editable').addEventListener(eventType, t.step_func(event => {
|
|
if (event.type === 'beforeinput' && event.inputType === 'insertFromPaste') {
|
|
assert_equals(event.data, null);
|
|
assert_equals(event.dataTransfer.getData('text/plain'), 'rich');
|
|
assert_regexp_match(event.dataTransfer.getData('text/html'), /<b.*>rich<\/b>$/);
|
|
}
|
|
|
|
actualEventLog.push(`${event.type}-${event.inputType || '[null]'}`);
|
|
if (actualEventLog.length === expectedEventLog.length) {
|
|
assert_array_equals(actualEventLog, expectedEventLog,
|
|
`Expected: ${expectedEventLog}; Actual: ${actualEventLog}.`);
|
|
t.done();
|
|
}
|
|
}));
|
|
}
|
|
}, 'Event order and dataTransfer on contenteditable.');
|
|
|
|
async_test(t => {
|
|
const prevent = document.getElementById('test3_editable_prevent');
|
|
const normal = document.getElementById('test3_editable_normal');
|
|
prevent.addEventListener('beforeinput', t.step_func(event => {
|
|
if (event.inputType === 'deleteByCut' ||
|
|
event.inputType === 'insertFromPaste') {
|
|
event.preventDefault();
|
|
}
|
|
}));
|
|
|
|
normal.addEventListener('input', t.step_func(event => {
|
|
if (event.inputType === 'insertFromPaste') {
|
|
assert_equals(prevent.textContent, 'prevent');
|
|
assert_equals(normal.textContent, 'prevent');
|
|
t.done();
|
|
}
|
|
}));
|
|
}, 'preventDefault() should prevent DOM modification but allow clipboard updates.');
|
|
</script>
|