| <!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> |
