type-after-focus-rule-shrink-width.html

<!DOCTYPE html>
<html>
<head>
<style>

input { width: 200px; background: linear-gradient(to right, white 110px, green 100px); }
input:focus { width: 100px; }

</style>
</head>
<body>
<p>This test ensures WebKit allows text be typed in an input element, when input:focus rule shrinks the width of input element
and the focus was set by mouse down on the shrunken part of the element.</p>
<p>To manually test, click on the right half of the input element (green part). You should see 'PASS'.</p>
<div><input type="text" value="FAIL" onmousedown="setTimeout(typeText, 0)"></div>
<script>

var input = document.getElementsByTagName('input')[0];

function typeText() {
    document.execCommand('SelectAll', false, null);
    document.execCommand('InsertText', false, 'PASS');
    if (window.testRunner) {
        input.parentNode.innerHTML = input.value;
        testRunner.notifyDone();
    }
}

if (window.testRunner) {
    testRunner.dumpAsText();
    if (!window.eventSender)
        document.write('This test requires eventSender');
    else {
        testRunner.waitUntilDone();

        eventSender.mouseMoveTo(input.offsetLeft + input.offsetWidth * 2 / 3, input.offsetTop + input.offsetHeight / 2);
        eventSender.mouseDown();
        eventSender.leapForward(200);
        eventSender.mouseUp();
    }
}

</script>
</body>
</html>
chromium/third_party/blink/web_tests/fast/forms/type-after-focus-rule-shrink-width.html
