<head>
<script>
if (window.testRunner)
    testRunner.dumpEditingCallbacks();
</script>

<style>
table, td {
    border: 1px solid #aaa;
}
</style>

<script>
function log(str) {
    var li = document.createElement("li");
    li.appendChild(document.createTextNode(str));
    var console = document.getElementById("console");
    console.appendChild(li);
}

function assert(bool) {
    if (!bool)
        log("Failure");
    else
        log("Success");
}
</script>
</head>

<body contentEditable="true">
<p>This tests moving the caret in content of mixed editability.  The caret should jump to the next editable region that shares a common editable ancestor when it reaches non-editable content.</p>
<div id="e1">editable content</div>
<table cellpadding="5" contentEditable="false">
<tr>
<td>non-editable content</td>
<td>non-editable content</td>
<td id="e2" contentEditable="true">editable content</td>
</table>
<div id="e3">editable content</div>

<ul id="console"></ul>
</body>

<script>
if (window.testRunner)
    testRunner.dumpAsText();
    
var s = window.getSelection();
var e1 = document.getElementById("e1");
var e2 = document.getElementById("e2");
var e3 = document.getElementById("e3");

s.collapse(e1.firstChild, e1.firstChild.length);
s.modify("move", "forward", "character");
s.modify("move", "forward", "character");
assert(s.anchorNode == e2.firstChild && s.anchorOffset == 0);

s.modify("move", "backward", "character");
s.modify("move", "backward", "character");
assert(s.anchorNode == e1.firstChild && s.anchorOffset == e1.firstChild.length);
    
s.collapse(e2.firstChild, e2.firstChild.length);
s.modify("move", "forward", "character");
s.modify("move", "forward", "character");
assert(s.anchorNode == e3.firstChild && s.anchorOffset == 0);

s.modify("move", "backward", "character");
s.modify("move", "backward", "character");
assert(s.anchorNode == e2.firstChild && s.anchorOffset == e2.firstChild.length)
</script>