blob: 2880381dfd52e38e4e52770456427864c00c6062 [file] [log] [blame]
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
<script src="resources/js-test-selection-shared.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<script>
description("Ensure cursor placement matches IE6/IE7/FF3 when clicking above/below lines in padding.")
document.body.style.margin = 0;
var div = document.createElement("div");
div.style.cssText = "font-family: ahem; font-size: 20px; -webkit-text-fill-color: yellow; width: 40px; height: 80px; padding: 20px; background-color: green;";
div.contentEditable = true;
var firstText = document.createTextNode("XX");
var firstDiv = document.createElement("div");
firstDiv.appendChild(firstText);
firstDiv.style.cssText = "padding-bottom: 19px; border-bottom: 1px solid pink; margin-bottom: 20px";
div.appendChild(firstDiv);
var secondText = document.createTextNode("YY");
var secondDiv = document.createElement("div");
secondDiv.appendChild(secondText);
div.appendChild(secondDiv);
document.body.insertBefore(div, document.body.firstChild);
function clickShouldResultInRange(x, y, node, offset) {
if (window.eventSender) {
clickAt(x, y);
assertSelectionAt(node, offset);
} else {
tests.push({
testFunction: function() { assertRange(node, offset); },
clickString: " " + x + ", " + y }
)
}
}
function printClickStringForWaitingTest()
{
if (!tests[testIndex])
return;
debug("Waiting for click @ " + tests[testIndex].clickString);
}
var testIndex = 0;
var tests = [];
function runInteractiveTests()
{
testIndex = 0;
printClickStringForWaitingTest();
document.body.addEventListener("mouseup", function() {
debug("Got click @ " + event.clientX + ", " + event.clientY);
var test = tests[testIndex];
if (test) {
test.testFunction();
testIndex++;
printClickStringForWaitingTest();
}
}, false);
}
// When clicking between divs separated by margins in an editable
// text region, the browsers differ in behavior:
// FF3: vertical padding box + some sort of overhang decent?
// IE6/IE7: vertical padding box
// IE8 b2: margin box
// Safari 3: margin box (but cursor goes at end of line)
// We're going to follow IE 7's behavior and use the padding box height
// for determining if the click below a div (in the padding/margin region)
// The rules for clicking above or below the text are different on Windows and Mac.
function editingTest(editingBehavior)
{
if (window.internals)
internals.settings.setEditingBehavior(editingBehavior);
var expectMacStyleSelection = editingBehavior == "mac";
clickShouldResultInRange(10, 10, firstText, 0);
clickShouldResultInRange(40, 10, firstText, expectMacStyleSelection ? 0 : 1);
clickShouldResultInRange(70, 10, firstText, expectMacStyleSelection ? 0 : 2);
clickShouldResultInRange(10, 30, firstText, 0);
clickShouldResultInRange(70, 30, firstText, 2);
clickShouldResultInRange(10, 50, firstText, expectMacStyleSelection ? 2 : 0);
clickShouldResultInRange(40, 50, firstText, expectMacStyleSelection ? 2 : 1);
clickShouldResultInRange(70, 50, firstText, 2);
clickShouldResultInRange(10, 70, secondText, 0);
clickShouldResultInRange(40, 70, secondText, expectMacStyleSelection ? 0 : 1);
clickShouldResultInRange(70, 70, secondText, expectMacStyleSelection ? 0 : 2);
clickShouldResultInRange(10, 110, secondText, expectMacStyleSelection ? 2 : 0);
clickShouldResultInRange(40, 110, secondText, expectMacStyleSelection ? 2 : 1);
clickShouldResultInRange(70, 110, secondText, 2);
}
editingTest("mac");
editingTest("win");
// Clean up after ourselves if we're not being run in the browser
if (window.eventSender) {
document.body.removeChild(div);
} else {
runInteractiveTests();
}
var successfullyParsed = true;
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>