F4 key should open the picker popup on Windows and Linux
[WebKit-https.git] / LayoutTests / platform / chromium / fast / forms / time / time-suggestion-picker-key-operations.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../../../../../fast/js/resources/js-test-pre.js"></script>
5 <script src="../../../../../fast/forms/resources/common.js"></script>
6 <script src="../../../../../fast/forms/resources/suggestion-picker-common.js"></script>
7 </head>
8 <body style="background-color: #bbbbbb;">
9 <p id="description"></p>
10 <div id="console"></div>
11 <input type=time id=time value="01:00" list=suggestions>
12 <datalist id=suggestions>
13     <option label="Now">01:01</option>
14     <option>01:02</option>
15     <option>01:03</option>
16     <option>01:04</option>
17     <option>01:05</option>
18     <option>01:06</option>
19     <option>01:07</option>
20     <option>01:08</option>
21     <option>01:09</option>
22     <option>01:10</option>
23     <option>01:11</option>
24     <option>01:12</option>
25     <option>01:13</option>
26     <option>01:14</option>
27     <option>01:15</option>
28     <option>01:16</option>
29     <option>01:17</option>
30     <option>01:18</option>
31     <option>01:19</option>
32     <option>01:20</option>
33     <option>01:21</option>
34     <option>01:22</option>
35     <option>01:23</option>
36     <option>01:24</option>
37     <option>01:25</option>
38     <option>01:26</option>
39     <option>01:27</option>
40     <option>01:28</option>
41     <option>01:29</option>
42     <option>01:30</option>
43     <option>01:31</option>
44     <option>01:32</option>
45     <option>01:33</option>
46     <option>01:34</option>
47     <option>01:35</option>
48     <option>01:36</option>
49     <option>01:37</option>
50     <option>01:38</option>
51     <option>01:39</option>
52     <option>01:40</option>
53     <option>01:41</option>
54     <option>01:42</option>
55     <option>01:43</option>
56     <option>01:44</option>
57     <option>01:45</option>
58     <option>01:46</option>
59     <option>01:47</option>
60     <option>01:48</option>
61     <option>01:49</option>
62     <option>01:50</option>
63     <option>01:51</option>
64     <option>01:52</option>
65     <option>01:53</option>
66     <option>01:54</option>
67     <option>01:55</option>
68     <option>01:56</option>
69     <option>01:57</option>
70     <option>01:58</option>
71     <option>01:59</option>
72     <option>02:00</option>
73     <option>02:01</option>
74     <option>02:02</option>
75     <option>02:03</option>
76     <option>02:04</option>
77     <option>02:05</option>
78     <option>02:06</option>
79     <option>02:07</option>
80     <option>02:08</option>
81 </datalist>
82 <script>
83 debug('Check that page popup doesn\'t exist at first.');
84 shouldBeNull('document.getElementById("mock-page-popup")');
85
86 window.onload = function() {
87     openPicker(document.getElementById('time'));
88     shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
89
90     popupWindow.addEventListener("resize", test1, false);
91 };
92
93 var timeoutTimer = setTimeout(function() {
94     testFailed("Test timed out.");
95     finishJSTest();
96 }, 5000);
97
98 function test1() {
99     debug('Check that page popup exists.');
100     shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
101     popupWindow.focus();
102
103     popupWindow.removeEventListener("resize", test1, false);
104
105     debug('Check that up/down arrow keys work.');
106     shouldBeNull('highlightedEntry()');
107     eventSender.keyDown('downArrow');
108     shouldBe('highlightedEntry()', '"01:01"');
109     eventSender.keyDown('downArrow');
110     shouldBe('highlightedEntry()', '"01:02"');
111     eventSender.keyDown('upArrow');
112     shouldBe('highlightedEntry()', '"01:01"');
113
114     debug('Check that up arrow key at top of list does nothing.');
115     eventSender.keyDown('upArrow');
116     shouldBe('highlightedEntry()', '"01:01"');
117     eventSender.keyDown('downArrow');
118     shouldBe('highlightedEntry()', '"01:02"');
119
120     debug('Check that page up/down arrow keys work.');
121     eventSender.keyDown('pageDown');
122     shouldBe('highlightedEntry()', '"01:40"');
123     eventSender.keyDown('pageDown');
124     shouldBe('highlightedEntry()', '"02:00"');
125     eventSender.keyDown('pageUp');
126     shouldBe('highlightedEntry()', '"01:21"');
127     eventSender.keyDown('pageDown');
128     shouldBe('highlightedEntry()', '"02:00"');
129     eventSender.keyDown('pageDown');
130     shouldBe('highlightedEntry()', '"02:08"');
131
132     debug('Check that down arrow key at bottom of list does nothing.');
133     eventSender.keyDown('downArrow');
134     shouldBe('highlightedEntry()', '"02:08"');
135     
136     debug('Check that enter key sets the highlighted value.');
137     eventSender.keyDown('upArrow');
138     shouldBe('highlightedEntry()', '"02:07"');
139     eventSender.keyDown("\n");
140     shouldBeNull('document.getElementById("mock-page-popup")');
141     shouldBe('document.getElementById("time").value', '"02:07"');
142
143     debug('Reopen popup.');
144     openPicker(document.getElementById('time'));
145     popupWindow.addEventListener("resize", test2, false);
146 }
147
148 function test2() {
149     popupWindow.removeEventListener("resize", test2, false);
150
151     popupWindow.focus();
152
153     debug('Check that escape key closes the popup.');
154     eventSender.keyDown('\x1B');
155     shouldBeNull('document.getElementById("mock-page-popup")');
156     shouldBe('document.getElementById("time").value', '"02:07"');
157
158     sendKey(document.getElementById('time'), "F4");
159     if (document.getElementById('mock-page-popup'))
160         testPassed("F4 opened picker.");
161
162     clearTimeout(timeoutTimer);
163     finishJSTest();
164 }
165
166 </script>
167 <script src="../../../../../fast/js/resources/js-test-post.js"></script>
168 </body>
169 </html>