| <!doctype html> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script src="../../assert_selection.js"></script> |
| <script src="../../../resources/ahem.js"></script> |
| <script> |
| // This test verifies mouse drag should not cross editing boundary. |
| |
| function drag(selection) { |
| if (!window.eventSender) |
| throw 'This test requires eventSender.'; |
| |
| // Reset mouse state |
| eventSender.mouseMoveTo(0, 0); |
| eventSender.leapForward(9999); |
| |
| const from = selection.document.getElementById('from'); |
| eventSender.mouseMoveTo( |
| selection.computeLeft(from) + from.offsetWidth / 2, |
| selection.computeTop(from) + from.offsetHeight / 2); |
| eventSender.mouseDown(); |
| eventSender.leapForward(200); |
| |
| const to = selection.document.getElementById('to'); |
| eventSender.mouseMoveTo( |
| selection.computeLeft(to) + to.offsetWidth / 2, |
| selection.computeTop(to) + to.offsetHeight / 2); |
| eventSender.mouseUp(); |
| } |
| |
| const kStyle = [ |
| '<style>', |
| '* { font: 10px Ahem; }', |
| 'input { width: 64px; }', |
| '</style>', |
| ].join(''); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<span id="from">ABCDEF</span>', |
| '<span id="to">012345</span>', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<span id="from">ABC^DEF</span>', |
| '<span id="to">012|345</span>', |
| ], |
| {dumpAs: 'flattree'}, |
| '1 Drag left to right from SPAN to SPAN'); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<input id="from" readonly type="text" value="ABCDEF">', |
| '<span id="to">012345</span>', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<input id="from" readonly type="text" value="ABCDEF">', |
| '<div>ABC^DEF|</div>', |
| '</input>', |
| '<span id="to">012345</span>', |
| ], |
| {dumpAs: 'flattree'}, |
| '2 Drag left to right from INPUT to SPAN'); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| '<span id="from">012345</span>', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| '<div>ABCDEF</div>', |
| '</input>', |
| '<span id="from">|012^345</span>', |
| ], |
| {dumpAs: 'flattree'}, |
| '3 Drag right to left from SPAN to INPUT'); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<span id="from">012345</span>', |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<span id="from">012^345|</span>', |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| '<div>ABCDEF</div>', |
| '</input>', |
| ], |
| {dumpAs: 'flattree'}, |
| '4 Drag left to right from SPAN to INPUT'); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<input id="from" readonly type="text" value="ABCDEF">', |
| '<span>xyz</span>', |
| '<input id="to" readonly type="text" value="012345">', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<input id="from" readonly type="text" value="ABCDEF">', |
| '<div>ABC^DEF|</div>', |
| '</input>', |
| '<span>xyz</span>', |
| '<input id="to" readonly type="text" value="012345">', |
| '<div>012345</div>', |
| '</input>', |
| ], |
| {dumpAs: 'flattree'}, |
| '5 Drag left to right from INPUT to INPUT'); |
| |
| selection_test( |
| [ |
| kStyle, |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| '<span>xyz</span>', |
| '<input id="from" readonly type="text" value="012345">', |
| ], |
| selection => drag(selection), |
| [ |
| kStyle, |
| '<input id="to" readonly type="text" value="ABCDEF">', |
| '<div>ABCDEF</div>', |
| '</input>', |
| '<span>xyz</span>', |
| '<input id="from" readonly type="text" value="012345">', |
| '<div>|012^345</div>', |
| '</input>', |
| ], |
| {dumpAs: 'flattree'}, |
| '6 Drag right to left from INPUT to INPUT'); |
| </script> |
