Skip to content

GitLab

T
tangled
Commit c74203cf authored by Yoshifumi Inoue's avatar Yoshifumi Inoue Committed by Commit Bot
Browse files
Options

Utilize selection_test() in editing/selection/click-before-and-after-table.html 

This patch changes "click-before-and-after-table.html" to utilize
|selection_test()| for ease of maintenance and help to implementing EditingNG.

Bug: 707656, 679977
Change-Id: I675249309b62567be60c15854624c3eede648b85
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2226105
Auto-Submit: Yoshifumi Inoue <yosin@chromium.org>
Reviewed-by: default avatarKent Tamura <tkent@chromium.org>
Commit-Queue: Kent Tamura <tkent@chromium.org>
Commit-Queue: Yoshifumi Inoue <yosin@chromium.org>
Cr-Commit-Position: refs/heads/master@{#774028}
parent ec553ab1
Hide whitespace changes
Inline Side-by-side
Showing with 88 additions and 76 deletions
third_party/blink/web_tests/editing/selection/click-before-and-after-table-expected.txt deleted 100644 → 0
View file @ ec553ab1
EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
cell one cell two
third_party/blink/web_tests/editing/selection/click-before-and-after-table.html
View file @ c74203cf
<style> <!doctype html>
td { <script src="../../resources/ahem.js"></script>
border: 1px solid #aaa; <script src="../../resources/testharness.js"></script>
} <script src="../../resources/testharnessreport.js"></script>
</style> <script src="../assert_selection.js"></script>
<body style="border: 1px solid red;" contenteditable="true"><table id="table" style="margin: 25px; border:10px solid #ccc; padding: 10px;"><tr><td>cell one</td><td>cell two</td></tr></table>
<ul id="console"></ul>
<script> <script>
if (window.testRunner) const kStyle = 'margin: 25px; border:20px solid #ccc; padding: 10px;';
testRunner.dumpEditingCallbacks(); const kSample = [
'<div contenteditable>',
function log(message) { `<table id="target" style="${kStyle}"><tbody><tr>`,
var console = document.getElementById("console"); '<td>ABC</td><td>XYZ</td>',
var li = document.createElement("li"); '</tr></tbody></table>',
var text = document.createTextNode(message); '</div>',
].join('');
console.appendChild(li);
li.appendChild(text);
}
function runAutomatedTest() {
testRunner.dumpAsText();
var s, x, y, e, top, bottom, left, right;
table = document.getElementById("table");
top = table.offsetTop; function click(x, y) {
left = table.offsetLeft; if (!window.eventSender)
bottom = top + table.offsetHeight; throw 'This test requires eventSender.';
right = left + table.offsetWidth; eventSender.leapForward(9999); // reset muose button state.
x = right + 5;
y = (top + bottom) / 2;
eventSender.mouseMoveTo(x, y);
eventSender.mouseDown();
eventSender.mouseUp();
s = window.getSelection();
if (!(s.anchorNode == document.body && s.anchorOffset == 1))
log("Failure: Clicking @ " + x + ", " + y + " after the table didn't put the caret after it. Instead: " + s.anchorNode + ", " + s.anchorOffset);
x = right - 5;
y = (top + bottom) / 2;
eventSender.leapForward(1000);
eventSender.mouseMoveTo(x, y);
eventSender.mouseDown();
eventSender.mouseUp();
s = window.getSelection();
if (s.anchorNode == document.body)
log("Failure: Clicking @ " + x + ", " + y + " inside the table put the caret before or after it. Instead: " + s.anchorNode + ", " + s.anchorOffset);
x = left - 5;
y = (top + bottom) / 2;
eventSender.leapForward(1000);
eventSender.mouseMoveTo(x, y);
eventSender.mouseDown();
eventSender.mouseUp();
s = window.getSelection();
if (s.anchorNode != table || s.anchorOffset != 0)
if (!(s.anchorNode == document.body && s.anchorOffset == 0))
log("Failure: Clicking @ " + x + ", " + y + " before the table should be the caret before it. Instead: " + s.anchorNode + ", " + s.anchorOffset);
x = left + 5;
y = (top + bottom) / 2;
eventSender.leapForward(1000);
eventSender.mouseMoveTo(x, y); eventSender.mouseMoveTo(x, y);
eventSender.mouseDown(); eventSender.mouseDown();
eventSender.mouseUp(); eventSender.mouseUp();
s = window.getSelection();
if (s.anchorNode == document.body)
log("Failure: Clicking @ " + x + ", " + y + " inside the table put the caret before or after it. Instead: " + s.anchorNode + ", " + s.anchorOffset);
} }
if (window.testRunner) function getPoints(selection) {
runAutomatedTest(); const target = selection.document.getElementById('target');
else { const left = selection.computeLeft(target);
log("This test uses the eventSender to do mouse clicks. To run it manually, click after the table, the caret should appear there (and not inside the table). Then click inside the table. The caret should appear inside it."); const top = selection.computeTop(target);
document.body.addEventListener("click", function() { var s = window.getSelection(); log("click @ " + event.clientX + ", " + event.clientY + " caret at: " + s.anchorNode + ", " + s.anchorOffset); }, true);
return {
top: top,
left: left,
bottom: top + target.offsetHeight,
right: left + target.offsetWidth,
middle: top + target.offsetHeight / 2,
}
} }
selection_test(
kSample,
selection => {
const rect = getPoints(selection);
click(rect.right + 5, rect.middle);
},
[
'<div contenteditable>',
`<table id="target" style="${kStyle}"><tbody><tr>`,
'<td>ABC</td><td>XYZ</td>',
'</tr></tbody></table>|',
'</div>',
],
'Click the after table');
selection_test(
kSample,
selection => {
const rect = getPoints(selection);
click(rect.right - 5, rect.middle);
},
[
'<div contenteditable>',
`<table id="target" style="${kStyle}"><tbody><tr>`,
'<td>ABC|</td><td>XYZ</td>',
'</tr></tbody></table>',
'</div>',
],
'Click inside of right side border of the table');
selection_test(
kSample,
selection => {
const rect = getPoints(selection);
click(rect.left - 5, rect.middle);
},
[
'<div contenteditable>',
`|<table id="target" style="${kStyle}"><tbody><tr>`,
'<td>ABC</td><td>XYZ</td>',
'</tr></tbody></table>',
'</div>',
],
'Click before the table');
selection_test(
kSample,
selection => {
const rect = getPoints(selection);
click(rect.left + 5, rect.middle);
},
[
'<div contenteditable>',
`<table id="target" style="${kStyle}"><tbody><tr>`,
'<td>|ABC</td><td>XYZ</td>',
'</tr></tbody></table>',
'</div>',
],
'Click inside of left side border of the table');
</script> </script>
</body>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment