third_party/WebKit/LayoutTests/fast/forms/number/number-spinbutton-changeevent-trigger.html

   1 <!DOCTYPE>
   2 <html>
   3 <body>
   4 <script src="../../../resources/js-test.js"></script>
   5 <script src="../resources/common.js"></script>
   6 <input type="number" id="num1" onchange="handleChangeEvent(this);" oninput="handleInputEvent(this);">
   7 <script>
   8 var changeEventCounter = 0;
   9 var inputEventCounter = 0;
  10
  11 function handleChangeEvent(element) {
  12     ++changeEventCounter;
  13 }
  14
  15 function handleInputEvent(element) {
  16     ++inputEventCounter;
  17 }
  18
  19 var numberInput1= document.getElementById('num1');
  20 numberInput1.focus();
  21 debug('Should not trigger any event');
  22 hoverOverElement(numberInput1);
  23 shouldBe('inputEventCounter',  '0');
  24 shouldBe('changeEventCounter', '0');
  25
  26 numberInput1.value = 0;
  27 eventSender.mouseMoveTo(numberInput1.offsetLeft + numberInput1.offsetWidth - 10, numberInput1.offsetTop + numberInput1.offsetHeight / 4);
  28 eventSender.mouseDown();
  29 debug('Input event is triggered but no change event is triggered on mouse down');
  30 shouldBe('inputEventCounter',  '1');
  31 shouldBe('changeEventCounter', '0');
  32 shouldBeEqualToString('numberInput1.value', '1');
  33 eventSender.mouseUp();
  34 debug('Change events occurs on mouse up');
  35 shouldBe('inputEventCounter',  '1');
  36 shouldBe('changeEventCounter', '1');
  37 shouldBeEqualToString('numberInput1.value', '1');
  38
  39 debug('Pressed more than once, still events are triggered');
  40 eventSender.mouseMoveTo(numberInput1.offsetLeft + numberInput1.offsetWidth - 10, numberInput1.offsetTop + numberInput1.offsetHeight / 4);
  41 eventSender.mouseDown();
  42 eventSender.mouseUp();
  43 shouldBe('inputEventCounter',  '2');
  44 shouldBe('changeEventCounter', '2');
  45 shouldBeEqualToString('numberInput1.value', '2');
  46
  47 debug('When moving away from field, it should not trigger event, only on value change');
  48 numberInput1.blur();
  49 shouldBe('inputEventCounter',  '2');
  50 shouldBe('changeEventCounter', '2');
  51 shouldBeEqualToString('numberInput1.value', '2');
  52
  53 </script>
  54 </body>
  55 </html>