<body onload="runTest()">
<script src="../../resources/js-test-pre.js"></script>

<script>
async function runTest()
{
    if (!window.testRunner)
        return;

    var accessKeyModifiers = ["altKey"];
    if (navigator.userAgent.search(/\bMac OS X\b/) != -1)
        accessKeyModifiers = ["ctrlKey", "altKey"];

    testRunner.dumpEditingCallbacks();
    testRunner.waitUntilDone();
    testRunner.dumpAsText();

    shouldBe("first.selectionStart", "11");
    shouldBe("first.selectionEnd", "18");
    eventSender.keyDown("\t");
    shouldBe("first.selectionStart", "11");
    shouldBe("first.selectionEnd", "18");

    shouldBe("second.selectionStart", "11");
    shouldBe("second.selectionEnd", "18");
    eventSender.keyDown("J", accessKeyModifiers);
    shouldBe("second.selectionStart", "11");
    shouldBe("second.selectionEnd", "18");

    shouldBe("third.selectionStart", "11");
    shouldBe("third.selectionEnd", "18");
    third.focus();
    shouldBe("third.selectionStart", "11");
    shouldBe("third.selectionEnd", "18");

    shouldBe("fourth.selectionStart", "11");
    shouldBe("fourth.selectionEnd", "18");
    await eventSender.asyncMouseMoveTo(fourth.offsetLeft + 4, fourth.offsetTop + 4);
    await eventSender.asyncMouseDown();
    await eventSender.asyncMouseUp();
    shouldBe("fourth.selectionStart", "0");
    shouldBe("fourth.selectionEnd", "0");

    shouldBe("fifth.selectionStart", "11");
    shouldBe("fifth.selectionEnd", "18");
    var fifthLabel = document.getElementById("fifthLabel");
    await eventSender.asyncMouseMoveTo(fifthLabel.offsetLeft + 4, fifthLabel.offsetTop + 4);
    await eventSender.asyncMouseDown();
    await eventSender.asyncMouseUp();
    shouldBe("fifth.selectionStart", "11");
    shouldBe("fifth.selectionEnd", "18");

    shouldBe("sixth.selectionStart", "11");
    shouldBe("sixth.selectionEnd", "18");
    eventSender.keyDown("U", accessKeyModifiers);
    shouldBe("sixth.selectionStart", "11");
    shouldBe("sixth.selectionEnd", "18");

    shouldBe("seventh.selectionStart", "11");
    shouldBe("seventh.selectionEnd", "18");
    var seventLabel = document.getElementById("seventhLabel");
    seventhLabel.focus();
    shouldBe("seventh.selectionStart", "11");
    shouldBe("seventh.selectionEnd", "18");

    shouldBe("eighth.selectionStart", "11");
    shouldBe("eighth.selectionEnd", "18");
    var eighthLegend = document.getElementById("eighthLegend");
    eighthLegend.focus();
    shouldBe("eighth.selectionStart", "11");
    shouldBe("eighth.selectionEnd", "18");

    shouldBe("ninth.selectionStart", "11");
    shouldBe("ninth.selectionEnd", "18");
    eventSender.keyDown("I", accessKeyModifiers);
    shouldBe("ninth.selectionStart", "11");
    shouldBe("ninth.selectionEnd", "18");
    testRunner.notifyDone();
}
</script>

<h2>&lt;textarea&gt; focus selection</h2>

<p>This test checks whether the selection is restored, cleared, or set
to the full range when using different ways to focus a text
area. These results all match Mozilla. When running manually, please
follow the steps below. In the test harness, the test runs
automatically.</p>

1) Hit tab, only the word "SUCCESS" should be selected:
<textarea id="first">FAILURE or SUCCESS</textarea>
<script>
    var first = document.getElementById("first");
    first.focus();
    first.setSelectionRange(11, 18);
    first.blur();
</script>

<br>

2) Hit Ctrl-Option-J (or Alt-J on Windows), only the word "SUCCESS" should be selected:
<textarea id="second" accesskey="j">FAILURE or SUCCESS</textarea>
<script>
    var second = document.getElementById("second");
    second.focus();
    second.setSelectionRange(11, 18);
    second.blur();
</script>

<br>

3) <input type="button" onclick="document.getElementById('third').focus()" value="Click this button">, only the word "SUCCESS" should be selected:
<textarea id="third">FAILURE or SUCCESS</textarea>
<script>
    var third = document.getElementById("third");
    third.focus();
    third.setSelectionRange(11, 18);
    third.blur();
</script>

<br>

4) Click in the input field, nothing should be selected:
<textarea id="fourth">FAILURE and FAILURE</textarea>
<script>
    var fourth = document.getElementById("fourth");
    fourth.focus();
    fourth.setSelectionRange(11, 18);
    fourth.blur();
</script>

<br>

5) <label id="fifthLabel" for="fifth" style="color: blue">Click this label, only the word "SUCCESS" should be selected:</label>
<textarea id="fifth">FAILURE or SUCCESS</textarea>
<script>
    var second = document.getElementById("fifth");
    fifth.focus();
    fifth.setSelectionRange(11, 18);
    fifth.blur();
</script>

<br>

6) <label id="sixthLabel" for="sixth" accesskey="u">Hit Ctrl-Option-U (or Alt-U on Windows), only the word "SUCCESS" should be selected:</label>
<textarea id="sixth">FAILURE or SUCCESS</textarea>
<script>
    var sixth = document.getElementById("sixth");
    sixth.focus();
    sixth.setSelectionRange(11, 18);
    sixth.blur();
</script>

<br>

7) <input type="button" onclick="document.getElementById('seventhLabel').focus()" value="Click this button"><label id="seventhLabel" for="seventh">, only the word "SUCCESS" should be selected:</label>
<textarea id="seventh">FAILURE or SUCCESS</textarea>
<script>
    var seventh = document.getElementById("seventh");
    seventh.focus();
    seventh.setSelectionRange(11, 18);
    seventh.blur();
</script>

<br>

8) <input type="button" onclick="document.getElementById('eighthLegend').focus()" value="Click this button">
<fieldset>
<legend id="eighthLegend">, only the word "SUCCESS" should be selected:</legend>
<textarea id="eighth">FAILURE or SUCCESS</textarea>
<script>
    var eighth = document.getElementById("eighth");
    eighth.focus();
    eighth.setSelectionRange(11, 18);
    eighth.blur();
</script>
</fieldset>
<br>


9) <fieldset>
<legend id="eighthLegend" accesskey="i">Hit Ctrl-Option-I (or Alt-I on Windows), only the word "SUCCESS" should be selected:</legend>
<textarea id="ninth">FAILURE or SUCCESS</textarea>
<script>
    var ninth = document.getElementById("ninth");
    ninth.focus();
    ninth.setSelectionRange(11, 18);
    ninth.blur();
</script>
</fieldset>
<br>

<p id="description"></p>
<div id="console"></div>

</body>