<input id="a" type="text" value="this text field has a lot of text in it so that it needs to scrol">
<input id="b" type="text" style="direction: rtl" value="this text field has a lot of text in it so that it needs to scrol">
<input id="c" type="text" value="this text field has a lot of text in it so that it needs to scrol">
<p>Tests scrolling back to the beginning when a text field blurs. The first field should be scrolled to the left, the second and third scrolled to the right.</p>
<script>
if (window.testRunner)
    testRunner.waitUntilDone();

function wait()
{
    return new Promise((resolve) => {
        requestAnimationFrame(() => setTimeout(resolve, 0));
    });
}

async function runTest()
{
    if (!window.eventSender) {
        document.body.innerHTML += 'This test requires eventSender.keyDown';
        return;
    }

    var a = document.getElementById("a");
    a.focus();
    await wait();
    a.setSelectionRange(66, 66);
    if (window.eventSender)
        eventSender.keyDown("l");

    var b = document.getElementById("b");
    b.focus();
    await wait();
    b.setSelectionRange(66, 66);
    if (window.eventSender)
        eventSender.keyDown("l");

    var c = document.getElementById("c");
    c.focus();
    await wait();
    c.setSelectionRange(66, 66);
    if (window.eventSender)
        eventSender.keyDown("l");

    if (window.testRunner)
        testRunner.notifyDone();
}

window.onload = runTest;

</script>
