number-spinbutton-gets-disabled-or-readonly.html

<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<input id="readonlyNumber" type="number" onmouseup="mouseupEventOnReadonlyNumber()" />
<input id="disabledNumber" type="number" onmouseup="mouseupEventOnDisabledNumber()" />
<p>
This tests if the value of a number input form does not continue
to increase/decrease in the following scenario.<br/>
(1) Click the spin button of the input form.<br/>
(2) Hook the 'mouseup' event and disable the input form.<br/>
(3) Enable the input form after some delay.<br/>
To run this test manually, input any value in the input form
and then click the spin-down button.
At this point, click the spin-down button quickly and
do not move the cursor from the spin-down button after the click.
If the value decreases by just 1, this test passes.
</p>
<div id="console"></div>
<script>
var testInputs;
var testDelays;
var input;
var delay;
window.jsTestIsAsync = true;

if (window.testRunner && window.eventSender) {
    testInputs = [document.getElementById("readonlyNumber"), document.getElementById("disabledNumber")];
    setTimeout(function() {
        nextInputTest();
    }, 0);
}

function nextInputTest() {
    if (testInputs.length == 0) {
        finishJSTest();
    } else {
        input = testInputs.shift();
        input.focus();
        testDelays = [1, 10, 100];
        debug("");
        debug("Test on a " + (input.id == "readonlyNumber" ? "readonly" : "disabled") + " number input form:");
        nextDelayTest();
    }
}

function nextDelayTest() {
    if (testDelays.length == 0) {
        nextInputTest();
    } else {
        delay = testDelays.shift();
        initializeInputAttributes(input, 1234567);
        debug("delay = " + delay + " ms");
        clickSpinDownButton(input);
        setTimeout(function() {
            shouldBeEqualToString('input.value', "1234566");
            nextDelayTest();
        }, 500);
    }
}

function mouseupEventOnReadonlyNumber() {
    input.readOnly = true;
    setTimeout(function() {
        input.readOnly = false;
    }, delay);
}

function mouseupEventOnDisabledNumber() {
    input.disabled = true;
    setTimeout(function() {
        input.disabled = false;
    }, delay);
}

function initializeInputAttributes(input, value) {
    input.value = value;
    input.disabled = false;
    input.readOnly = false;
}

function clickSpinDownButton(input) {
    var x = input.offsetLeft + input.offsetWidth - 6;
    var y = input.offsetTop + input.offsetHeight - 6;
    eventSender.mouseMoveTo(x, y);
    eventSender.mouseDown();
    eventSender.mouseUp();
}
</script>
</body>
</html>
chromium/third_party/blink/web_tests/fast/forms/number/number-spinbutton-gets-disabled-or-readonly.html
