<!DOCTYPE html>
<html>
<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
</head>
<body>
<p id="description">This tests hit testing on relative positioned children. To manually test, select text by a mouse drag
starting in the blue box but outside red boxes and ending inside a red box.</p>
<div id="tests" style="margin-bottom: 200px; width: 300px; border: solid 5px #ccf;">
<div style="position: relative; left: 50px; width: 200px; border: solid 5px #f66;">
first line<br>
second line<br>
third line<br>
</div>
<div style="position: relative; left: 300px; width: 200px; border: solid 5px #f66;">
first line<br>
second line<br>
third line<br>
</div>
<div style="position: relative; left: 250px; width: 200px; border: solid 5px #f66;">
first line<br>
second line<br>
third line<br>
</div>
<div class="testVerticalSelection" style="position: relative; top: 4em; width: 200px; border: solid 5px #f66;">
first line<br>
second line<br>
third line<br>
</div>
</div>
<div id="console"></div>
<script>

function runTest(boxName, testDiv) {
    var testVerticalSelection = testDiv.className == 'testVerticalSelection';

    var expectedString = [null, "first line", "second line", "third line"];
    for (var line = 1; line <= 3; line++) {
        var y = testDiv.offsetTop + testDiv.offsetHeight * (line - 1) / 3 + 5;
        if (testVerticalSelection)
            eventSender.mouseMoveTo(testDiv.offsetLeft, y - 20);
        else
            eventSender.mouseMoveTo(testDiv.offsetLeft - 10, y);
        eventSender.mouseDown();

        eventSender.leapForward(200);

        eventSender.mouseMoveTo(testDiv.offsetLeft + testDiv.offsetWidth - 20, y);
        eventSender.mouseUp();

        var actual = window.getSelection().toString();
        var action = "Selecting line " + line + ' of ' + boxName + ' selected "' + actual + '"';
        if (actual == expectedString[line])
            testPassed(action);
        else
            testFailed(action + ', expected "' + expectedString[line] + '"')

        if (testVerticalSelection)
            break;
    }
}

if (window.testRunner) {
    var tests = document.getElementById('tests').getElementsByTagName('div');
    for (var i = 0; i < tests.length; i++)
        runTest("box " + (i + 1), tests[i]);
    document.getElementById('tests').style.display = 'none';
}

</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>
