src/third_party/WebKit/LayoutTests/fast/forms/suggestion-picker/time-suggestion-picker-mouse-operations.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 <script src="../../forms/resources/common.js"></script>
   6 <script src="../../forms/resources/common-wheel-event.js"></script>
   7 <script src="../../forms/resources/picker-common.js"></script>
   8 <script src="resources/suggestion-picker-common.js"></script>
   9 </head>
  10 <body style="background-color: #bbbbbb;">
  11 <p id="description"></p>
  12 <div id="console"></div>
  13 <input type=time id=time value="01:00" list=suggestions>
  14 <datalist id=suggestions>
  15     <option label="Now">01:01</option>
  16     <option>01:02</option>
  17     <option>01:03</option>
  18     <option>01:04</option>
  19     <option>01:05</option>
  20     <option>01:06</option>
  21     <option>01:07</option>
  22     <option>01:08</option>
  23     <option>01:09</option>
  24     <option>01:10</option>
  25     <option>01:11</option>
  26     <option>01:12</option>
  27     <option>01:13</option>
  28     <option>01:14</option>
  29     <option>01:15</option>
  30     <option>01:16</option>
  31     <option>01:17</option>
  32     <option>01:18</option>
  33     <option>01:19</option>
  34     <option>01:20</option>
  35     <option>01:21</option>
  36 </datalist>
  37 <script>
  38 debug('Check that page popup doesn\'t exist at first.');
  39 shouldBeNull('$("mock-page-popup")');
  40
  41 window.onload = function() {
  42     openPicker($('time'), test1);
  43 };
  44
  45
  46 function test1() {
  47     debug('Check that page popup exists.');
  48     shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
  49
  50     debug('Check that page popup exists.');
  51     shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
  52
  53     debug('Check that hovering over an entry highlights it.');
  54     hoverOverElement(popupWindow.document.querySelector(".suggestion-list-entry:nth-child(2)"));
  55     shouldBe('highlightedEntry()', '"01:02"');
  56
  57     debug('Check that moving the mouse outside the popup de-highlights entries.');
  58     hoverOverElement(document.getElementById('description'));
  59     shouldBeNull('highlightedEntry()');
  60
  61     debug('Check that mouse click closes the popup and sets the value.');
  62     clickElement(popupWindow.document.querySelector(".suggestion-list-entry:nth-child(3)"));
  63     waitUntilClosing(test1AfterClosing);
  64 }
  65
  66 function test1AfterClosing() {
  67     shouldBeNull('document.getElementById("mock-page-popup")');
  68     shouldBe('document.getElementById("time").value', '"01:03"');
  69
  70     openPicker($('time'), test2);
  71 }
  72
  73 var scrollTopBeforeWheelEvent = 0;
  74 var scrollTopAfterWheelEvent = 0;
  75
  76 function test2() {
  77     var suggestionList = popupWindow.document.getElementsByClassName("suggestion-list")[0];
  78
  79     debug('Check that you can scroll using the mouse wheel.');
  80
  81     scrollTopBeforeWheelEvent = suggestionList.scrollTop;
  82     dispatchWheelEvent(suggestionList, 0, -100);
  83     scrollTopAfterWheelEvent = suggestionList.scrollTop;
  84     shouldBeTrue('scrollTopBeforeWheelEvent < scrollTopAfterWheelEvent');
  85
  86     scrollTopBeforeWheelEvent = suggestionList.scrollTop;
  87     dispatchWheelEvent(suggestionList, 0, 100);
  88     scrollTopAfterWheelEvent = suggestionList.scrollTop;
  89     shouldBeTrue('scrollTopBeforeWheelEvent > scrollTopAfterWheelEvent');
  90
  91     popupWindow.focus();
  92     eventSender.keyDown('\x1B');
  93     waitUntilClosing(test2AfterClosing);
  94 }
  95
  96 function test2AfterClosing() {
  97     shouldBeNull('$("mock-page-popup")');
  98
  99     openPicker($('time'), test3);
 100 }
 101
 102 function test3() {
 103     debug('Check that you can scroll using the scroll bar.');
 104
 105     var suggestionList = popupWindow.document.getElementsByClassName("suggestion-list")[0];
 106     var suggestionListOffset = cumulativeOffset(suggestionList);
 107     var scrollbarCenterX = suggestionListOffset[0] + suggestionList.offsetWidth - popupWindow.getScrollbarWidth() / 2;
 108
 109     scrollTopBeforeWheelEvent = suggestionList.scrollTop;
 110     eventSender.mouseMoveTo(scrollbarCenterX, suggestionListOffset[1] + 20); // 20 is the height of the up arrow button plus a few pixels
 111     eventSender.mouseDown();
 112     eventSender.mouseMoveTo(scrollbarCenterX, suggestionListOffset[1] + suggestionList.offsetHeight);
 113     eventSender.mouseUp();
 114     scrollTopAfterWheelEvent = suggestionList.scrollTop;
 115     shouldBeTrue('scrollTopBeforeWheelEvent < scrollTopAfterWheelEvent');
 116
 117     finishJSTest();
 118 }
 119
 120 </script>
 121 </body>
 122 </html>