number-spinbutton-changeevent-trigger.html

<!DOCTYPE>
<html>
<body>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
<input type="number" id="num1" onchange="handleChangeEvent(this);" oninput="handleInputEvent(this);">
<script>
var changeEventCounter = 0;
var inputEventCounter = 0;

function handleChangeEvent(element) {
    ++changeEventCounter;
}

function handleInputEvent(element) {
    ++inputEventCounter;
}

var numberInput1= document.getElementById('num1');
numberInput1.focus();
debug('Should not trigger any event');
hoverOverElement(numberInput1);
shouldBe('inputEventCounter',  '0');
shouldBe('changeEventCounter', '0');

numberInput1.value = 0;
eventSender.mouseMoveTo(numberInput1.offsetLeft + numberInput1.offsetWidth - 10, numberInput1.offsetTop + numberInput1.offsetHeight / 4);
eventSender.mouseDown();
debug('Input event is triggered but no change event is triggered on mouse down');
shouldBe('inputEventCounter',  '1');
shouldBe('changeEventCounter', '0');
shouldBeEqualToString('numberInput1.value', '1');
eventSender.mouseUp();
debug('Change events occurs on mouse up');
shouldBe('inputEventCounter',  '1');
shouldBe('changeEventCounter', '1');
shouldBeEqualToString('numberInput1.value', '1');

debug('Pressed more than once, still events are triggered');
eventSender.mouseMoveTo(numberInput1.offsetLeft + numberInput1.offsetWidth - 10, numberInput1.offsetTop + numberInput1.offsetHeight / 4);
eventSender.mouseDown();
eventSender.mouseUp();
shouldBe('inputEventCounter',  '2');
shouldBe('changeEventCounter', '2');
shouldBeEqualToString('numberInput1.value', '2');

debug('When moving away from field, it should not trigger event, only on value change');
numberInput1.blur();
shouldBe('inputEventCounter',  '2');
shouldBe('changeEventCounter', '2');
shouldBeEqualToString('numberInput1.value', '2');

</script>
</body>
</html>
chromium/third_party/blink/web_tests/fast/forms/number/number-spinbutton-changeevent-trigger.html
