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>
10 <body style="background-color: #bbbbbb;">
11 <p id="description"></p>
12 <div id="console"></div>
13 <input type=week id=week value="2012-12-24" list=suggestions>
14 <datalist id=suggestions>
15 <option label="This Week">2012-W01</option>
16 <option>2012-W02</option>
17 <option>2012-W03</option>
18 <option>2012-W04</option>
19 <option>2012-W05</option>
20 <option>2012-W06</option>
21 <option>2012-W07</option>
22 <option>2012-W08</option>
23 <option>2012-W09</option>
24 <option>2012-W10</option>
25 <option>2012-W11</option>
26 <option>2012-W12</option>
27 <option>2012-W13</option>
28 <option>2012-W14</option>
29 <option>2012-W15</option>
30 <option>2012-W16</option>
31 <option>2012-W17</option>
32 <option>2012-W18</option>
33 <option>2012-W19</option>
34 <option>2012-W20</option>
35 <option>2012-W21</option>
36 <option>2012-W22</option>
37 <option>2012-W23</option>
38 <option>2012-W24</option>
39 <option>2012-W25</option>
40 <option>2012-W26</option>
41 <option>2012-W27</option>
42 <option>2012-W28</option>
43 <option>2012-W29</option>
44 <option>2012-W30</option>
45 <option>2012-W31</option>
46 <option>2012-W32</option>
47 <option>2012-W33</option>
48 <option>2012-W34</option>
49 <option>2012-W35</option>
50 <option>2012-W36</option>
51 <option>2012-W37</option>
52 <option>2012-W38</option>
53 <option>2012-W39</option>
54 <option>2012-W40</option>
55 <option>2012-W41</option>
56 <option>2012-W42</option>
57 <option>2012-W43</option>
58 <option>2012-W44</option>
59 <option>2012-W45</option>
60 <option>2012-W46</option>
61 <option>2012-W47</option>
62 <option>2012-W48</option>
63 <option>2012-W49</option>
64 <option>2012-W50</option>
65 <option>2012-W51</option>
66 <option>2012-W52</option>
67 <option>2013-W01</option>
68 <option>2013-W02</option>
69 <option>2013-W03</option>
70 <option>2013-W04</option>
71 <option>2013-W05</option>
72 <option>2013-W06</option>
73 <option>2013-W07</option>
74 <option>2013-W08</option>
75 <option>2013-W09</option>
76 <option>2013-W10</option>
77 <option>2013-W11</option>
78 <option>2013-W12</option>
79 <option>2013-W13</option>
80 <option>2013-W14</option>
81 <option>2013-W15</option>
82 <option>2012-W00</option> <!--invalid-->
83 <option>2012-01-01</option> <!--invalid-->
84 <option>foo</option> <!--invalid-->
87 debug('Check that page popup doesn\'t exist at first.');
88 shouldBeNull('$("mock-page-popup")');
90 openPickerWithMock($('week'), test1);
93 debug('Check that page popup exists.');
94 shouldBeEqualToString('popupWindow.pagePopupController.toString()', '[object PagePopupController]');
96 debug('Check that hovering over an entry highlights it.');
97 hoverOverElement(popupWindow.document.querySelector('.suggestion-list-entry:nth-child(2)'));
98 shouldBeEqualToString('highlightedEntry()', '2012-W02');
100 debug('Check that moving the mouse outside the popup de-highlights entries.');
101 hoverOverElement(document.getElementById('description'));
102 shouldBeNull('highlightedEntry()');
104 debug('Check that mouse click closes the popup and sets the value.');
105 clickElement(popupWindow.document.querySelector('.suggestion-list-entry:nth-child(3)'));
106 waitUntilClosing(test1AfterClosing);
109 function test1AfterClosing() {
110 shouldBeNull('$("mock-page-popup")');
111 shouldBeEqualToString('document.getElementById("week").value', '2012-W03');
113 openPickerWithMock($('week'), test2);
116 var scrollTopBeforeWheelEvent = 0;
117 var scrollTopAfterWheelEvent = 0;
120 var suggestionList = popupWindow.document.getElementsByClassName('suggestion-list')[0];
122 debug('Check that you can scroll using the mouse wheel.');
124 scrollTopBeforeWheelEvent = suggestionList.scrollTop;
125 dispatchWheelEvent(suggestionList, 0, -100);
126 scrollTopAfterWheelEvent = suggestionList.scrollTop;
127 shouldBeTrue('scrollTopBeforeWheelEvent < scrollTopAfterWheelEvent');
129 scrollTopBeforeWheelEvent = suggestionList.scrollTop;
130 dispatchWheelEvent(suggestionList, 0, 100);
131 scrollTopAfterWheelEvent = suggestionList.scrollTop;
132 shouldBeTrue('scrollTopBeforeWheelEvent > scrollTopAfterWheelEvent');
135 eventSender.keyDown('escape');
136 waitUntilClosing(test2AfterClosing);
139 function test2AfterClosing() {
140 shouldBeNull('$("mock-page-popup")');
142 openPickerWithMock($('week'), test3);
146 debug('Check that you can scroll using the scroll bar.');
148 var suggestionList = popupWindow.document.getElementsByClassName('suggestion-list')[0];
149 var suggestionListOffset = cumulativeOffset(suggestionList);
150 var scrollbarCenterX = suggestionListOffset[0] + suggestionList.offsetWidth - popupWindow.getScrollbarWidth() / 2;
152 scrollTopBeforeWheelEvent = suggestionList.scrollTop;
153 eventSender.mouseMoveTo(scrollbarCenterX, suggestionListOffset[1] + 20); // 20 is the height of the up arrow button plus a few pixels
154 eventSender.mouseDown();
155 eventSender.mouseMoveTo(scrollbarCenterX, suggestionListOffset[1] + suggestionList.offsetHeight);
156 eventSender.mouseUp();
157 scrollTopAfterWheelEvent = suggestionList.scrollTop;
158 shouldBeTrue('scrollTopBeforeWheelEvent < scrollTopAfterWheelEvent');