blob: ef2549052d61ab84754d56812f5bd846fe7c0ceb [file] [log] [blame]
<!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>