<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">

.tests {
    width: 250px;
    float: left;
    list-style: none;
}

.tests div, .tests pre {
    border: solid 1px black;
    width: 200px;
    font-size: 13px;
    line-height: 13px;
    padding: 13px;
}

</style>
</head>
<body>
<p>This tests selecting LTR/RTL text that spans multiple lines in RTL/LTR block (opposite directionality).
To manually test, select text in each of editable regions below by dragging mouse from one edge to another.
The entire line should be selected.</p>
<div id="tests">
<ol class="tests">
<li><div contenteditable title="0 3, 4 6">abc<br>def</div></li>
<li><div contenteditable title="0 3">ابص</div></li>
<li><div contenteditable dir="rtl" title="0 3">abc</div></li>
<li><div contenteditable title="0 3, 4, 5 6">ابص<span dir="ltr"><br><br>a</span></div></li>
<li><div contenteditable dir="rtl" title="0 3, 4, 5 6">abc<span dir="rtl"><br><br>ا</span></div></li>
<li><div contenteditable title="0 3, 4, 5 6">ابص<br><br>a</div></li>
<li><div contenteditable dir="rtl" title="0 3, 4, 5 6">ابص<br><br>a</div></li>
</ol>
<ol class="tests">
<li><pre contenteditable title="0 3, 4, 5 6"><span dir="rtl">ابص

a</span></pre></li>
<li><pre contenteditable dir="rtl" title="0 3, 4, 5 6"><span dir="ltr">abc

a</span></pre></li>
<li><pre contenteditable dir="rtl" title="0 3, 4, 5 6">abc<span dir="rtl">

a</span></pre></li>
</ol>
</div>
<pre id="log"><script>

function selectLineSafely(test, lineTop) {
    var y = test.offsetTop + lineTop + 5;
    eventSender.mouseMoveTo(test.offsetLeft + 5, y);
    eventSender.mouseDown();

    eventSender.leapForward(200);

    eventSender.mouseMoveTo(test.offsetLeft + test.offsetWidth - 5, y);
    eventSender.mouseUp();
}

if (window.testRunner) {
    testRunner.dumpAsText();

    if (!window.eventSender)
        document.writeln('This test requires eventSender');
    else {
        var tests = document.getElementsByTagName('li');
        var testNumber = 0;

        for (var i = 0; i < tests.length; i++) {
            var test = tests[i].firstChild;
            offsets = test.title.split(', ');

            for (var j = 0; j < offsets.length; j++) {
                function log(msg) {
                    return document.write('TEST ' + (i + 1) + ' line ' + (j + 1) + ':' + msg + '\n');
                }

                var start = parseInt(offsets[j].split(' ')[0]);
                var afterEnd = parseInt(offsets[j].split(' ')[1]); // Might be NaN
                var selection = window.getSelection();

                selectLineSafely(test, 13 * (j + 1));

                var actual = selection.toString();
                var expected = test.innerText.substr(start, afterEnd);
                if (actual == expected)
                    log('PASS');
                else
                    log('FAIL - expected "' + expected + '" but got "' + actual + '"');
            }
        }
    }

    document.getElementById('tests').style.display = 'none';
} else {
    document.addEventListener('selectionchange', function () {
        var selection = window.getSelection();
        if (selection.isCollapsed)
            document.getElementById('log').innerHTML += selection.baseOffset + '\n';
        else
            document.getElementById('log').innerHTML += selection.baseOffset + ':' + selection.extentOffset + '\n';
    });
}

</script></pre>
</body>
</html>
