| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <script src="../../forms/resources/picker-common.js"></script> |
| <script src="resources/suggestion-picker-common.js"></script> |
| </head> |
| <body style="background-color: #bbbbbb;"> |
| <p id="description"></p> |
| <div id="console"></div> |
| <input type=week id=week value="2012-W12" list=suggestions> |
| <datalist id=suggestions> |
| <option label="This Week">2012-W01</option> |
| <option>2012-W02</option> |
| <option>2012-W03</option> |
| <option>2012-W04</option> |
| <option>2012-W05</option> |
| <option>2012-W06</option> |
| <option>2012-W07</option> |
| <option>2012-W08</option> |
| <option>2012-W09</option> |
| <option>2012-W10</option> |
| <option>2012-W11</option> |
| <option>2012-W12</option> |
| <option>2012-W13</option> |
| <option>2012-W14</option> |
| <option>2012-W15</option> |
| <option>2012-W16</option> |
| <option>2012-W17</option> |
| <option>2012-W18</option> |
| <option>2012-W19</option> |
| <option>2012-W20</option> |
| <option>2012-W21</option> |
| <option>2012-W22</option> |
| <option>2012-W23</option> |
| <option>2012-W24</option> |
| <option>2012-W25</option> |
| <option>2012-W26</option> |
| <option>2012-W27</option> |
| <option>2012-W28</option> |
| <option>2012-W29</option> |
| <option>2012-W30</option> |
| <option>2012-W31</option> |
| <option>2012-W32</option> |
| <option>2012-W33</option> |
| <option>2012-W34</option> |
| <option>2012-W35</option> |
| <option>2012-W36</option> |
| <option>2012-W37</option> |
| <option>2012-W38</option> |
| <option>2012-W39</option> |
| <option>2012-W40</option> |
| <option>2012-W41</option> |
| <option>2012-W42</option> |
| <option>2012-W43</option> |
| <option>2012-W44</option> |
| <option>2012-W45</option> |
| <option>2012-W46</option> |
| <option>2012-W47</option> |
| <option>2012-W48</option> |
| <option>2012-W49</option> |
| <option>2012-W50</option> |
| <option>2012-W51</option> |
| <option>2012-W52</option> |
| <option>2013-W01</option> |
| <option>2013-W02</option> |
| <option>2013-W03</option> |
| <option>2013-W04</option> |
| <option>2013-W05</option> |
| <option>2013-W06</option> |
| <option>2013-W07</option> |
| <option>2013-W08</option> |
| <option>2013-W09</option> |
| <option>2013-W10</option> |
| <option>2013-W11</option> |
| <option>2013-W12</option> |
| <option>2013-W13</option> |
| <option>2013-W14</option> |
| <option>2013-W15</option> |
| <option>2013-W16</option> |
| <option>2013-W17</option> |
| <option>2013-W18</option> |
| <option>2012-W00</option> <!--invalid--> |
| <option>2012-01-01</option> <!--invalid--> |
| <option>foo</option> <!--invalid--> |
| </datalist> |
| <script> |
| description('Tests that key bindings work as expected.'); |
| |
| debug('Check that page popup doesn\'t exist at first.'); |
| shouldBeNull('document.getElementById("mock-page-popup")'); |
| |
| openPicker(document.getElementById('week'), test1); |
| |
| var expectingDidHideEvent = false; |
| |
| function test1() { |
| debug('Check that page popup exists.'); |
| shouldBeEqualToString('popupWindow.pagePopupController.toString()', '[object PagePopupController]'); |
| popupWindow.focus(); |
| |
| debug('Check that up/down arrow keys work.'); |
| shouldBeNull('highlightedEntry()'); |
| eventSender.keyDown('downArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W01'); |
| eventSender.keyDown('downArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W02'); |
| eventSender.keyDown('upArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W01'); |
| |
| debug('Check that up arrow key at top of list does nothing.'); |
| eventSender.keyDown('upArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W01'); |
| eventSender.keyDown('downArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W02'); |
| |
| debug('Check that page up/down arrow keys work.'); |
| eventSender.keyDown('pageDown'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W40'); |
| eventSender.keyDown('pageDown'); |
| shouldBeEqualToString('highlightedEntry()', '2013-W08'); |
| eventSender.keyDown('pageUp'); |
| shouldBeEqualToString('highlightedEntry()', '2012-W21'); |
| eventSender.keyDown('pageDown'); |
| shouldBeEqualToString('highlightedEntry()', '2013-W08'); |
| eventSender.keyDown('pageDown'); |
| shouldBeEqualToString('highlightedEntry()', '@openCalendarPicker'); |
| |
| debug('Check that down arrow key at bottom of list does nothing.'); |
| eventSender.keyDown('downArrow'); |
| shouldBeEqualToString('highlightedEntry()', '@openCalendarPicker'); |
| |
| debug('Check that enter key sets the highlighted value.'); |
| eventSender.keyDown('upArrow'); |
| shouldBeEqualToString('highlightedEntry()', '2013-W18'); |
| eventSender.keyDown('\n'); |
| waitUntilClosing(test1AfterClosing); |
| } |
| |
| function test1AfterClosing() { |
| shouldBeNull('document.getElementById("mock-page-popup")'); |
| shouldBeEqualToString('document.getElementById("week").value', '2013-W18'); |
| |
| debug('Reopen popup.'); |
| openPicker(document.getElementById('week'), test2); |
| } |
| |
| function test2() { |
| popupWindow.focus(); |
| |
| eventSender.keyDown('pageDown'); |
| eventSender.keyDown('pageDown'); |
| eventSender.keyDown('pageDown'); |
| shouldBeEqualToString('highlightedEntry()', '@openCalendarPicker'); |
| |
| debug('Open calendar picker.'); |
| expectingDidHideEvent = true; |
| popupWindow.addEventListener('didHide', testDidHide, false); |
| popupWindow.addEventListener('didOpenPicker', test3, false); |
| eventSender.keyDown('\n'); |
| } |
| |
| function testDidHide() { |
| popupWindow.removeEventListener('didHide', testDidHide); |
| |
| shouldBeTrue('expectingDidHideEvent'); |
| expectingDidHideEvent = false; |
| } |
| |
| function test3() { |
| popupWindow.removeEventListener('didOpenPicker', test3); |
| |
| shouldBeFalse('expectingDidHideEvent'); |
| |
| debug('Confirm calendar picker did open.'); |
| shouldBeTrue('popupWindow.document.getElementById("main").firstChild.classList.contains("calendar-picker")'); |
| |
| debug('Check that escape key closes the popup.'); |
| eventSender.keyDown('escape'); |
| waitUntilClosing(test3AfterClosing); |
| } |
| |
| function test3AfterClosing() { |
| shouldBeNull('document.getElementById("mock-page-popup")'); |
| shouldBeEqualToString('document.getElementById("week").value', '2013-W18'); |
| |
| eventSender.keyDown('F4'); |
| if (document.getElementById('mock-page-popup')) |
| testPassed('F4 opened picker.'); |
| |
| finishJSTest(); |
| } |
| |
| </script> |
| </body> |
| </html> |