3e875fcf6e877be8e3aa7ea2a6bd83a9e0938557
[WebKit-https.git] / LayoutTests / fast / forms / date / calendar-picker-key-operations.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../../js/resources/js-test-pre.js"></script>
5 <script src="calendar-picker-common.js"></script>
6 </head>
7 <body>
8 <p id="description"></p>
9 <div id="console"></div>
10 <input type=date id=date value="2000-01-02">
11 <script>
12 description("Tests if calendar picker key bindings work as expected.");
13
14 debug('Check that page popup doesn\'t exist at first.');
15 shouldBeNull('document.getElementById("mock-page-popup")');
16
17 openPicker(document.getElementById('date'));
18
19 popupWindow.addEventListener("resize", test1, false);
20
21 function test1() {
22     popupWindow.removeEventListener("resize", test1, false);
23
24     debug('Check that page popup exists.');
25     shouldBe('popupWindow.pagePopupController.toString()', '"[object PagePopupController]"');
26
27     shouldBe('selectedDate()', '"2000-01-02"');
28     shouldBe('currentMonth()', '"2000-0"');
29
30     debug('Check that arrow keys work properly even when going between weeks and months.');
31
32     eventSender.keyDown('upArrow');
33     shouldBe('selectedDate()', '"1999-12-26"');
34     shouldBe('currentMonth()', '"2000-0"');
35     // Move from first row of January 2000 to last row of December 1999.
36     eventSender.keyDown('upArrow');
37     shouldBe('selectedDate()', '"2000-01-02"');
38     shouldBe('currentMonth()', '"1999-11"');
39     
40     eventSender.keyDown('downArrow');
41     shouldBe('selectedDate()', '"1999-12-26"');
42     shouldBe('currentMonth()', '"2000-0"');
43     eventSender.keyDown('downArrow');
44     shouldBe('selectedDate()', '"2000-01-02"');
45     shouldBe('currentMonth()', '"2000-0"');
46
47     eventSender.keyDown('upArrow');
48     shouldBe('selectedDate()', '"1999-12-26"');
49     shouldBe('currentMonth()', '"2000-0"');
50
51     // Move from top left of January 2000 to bottom right of December 1999.
52     eventSender.keyDown('leftArrow');
53     shouldBe('selectedDate()', '"2000-01-08"');
54     shouldBe('currentMonth()', '"1999-11"');
55
56     eventSender.keyDown('rightArrow');
57     shouldBe('selectedDate()', '"1999-12-26"');
58     shouldBe('currentMonth()', '"2000-0"');
59
60     debug("press m");
61     eventSender.keyDown('m');
62     shouldBe('selectedDate()', '"2000-01-26"');
63     shouldBe('currentMonth()', '"2000-1"');
64
65     debug("press shift + m");
66     eventSender.keyDown('M');
67     shouldBe('selectedDate()', '"1999-12-26"');
68     shouldBe('currentMonth()', '"2000-0"');
69
70     debug("press y");
71     eventSender.keyDown('y');
72     shouldBe('selectedDate()', '"2000-12-31"');
73     shouldBe('currentMonth()', '"2001-0"');
74
75     debug("press shift + y");
76     eventSender.keyDown('Y');
77     shouldBe('selectedDate()', '"1999-12-26"');
78     shouldBe('currentMonth()', '"2000-0"');
79
80     debug("press d");
81     eventSender.keyDown('d');
82     shouldBe('selectedDate()', '"2009-12-27"');
83     shouldBe('currentMonth()', '"2010-0"');
84
85     debug("press shift + d");
86     eventSender.keyDown('D');
87     shouldBe('selectedDate()', '"1999-12-26"');
88     shouldBe('currentMonth()', '"2000-0"');
89
90     eventSender.keyDown('\n');
91     shouldBeNull('document.getElementById("mock-page-popup")');
92     shouldBe('document.getElementById("date").value', '"1999-12-26"');
93
94     openPicker(document.getElementById('date'));
95     popupWindow.addEventListener("resize", test2, false);
96 }
97
98 function test2() {
99     popupWindow.removeEventListener("resize", test2, false);
100
101     // Test twice in case midnight.
102     shouldBeTrue('testToday() || testToday()');
103
104     debug('Check if tabbing works.');
105     shouldBe('focusedElement()', '".days-area-container"');
106     eventSender.keyDown('\t');
107     shouldBe('focusedElement()', '".today-button[value=Today]"');
108     eventSender.keyDown('\t');
109     shouldBe('focusedElement()', '".clear-button[value=Clear]"');
110     eventSender.keyDown('\t');
111     shouldBe('focusedElement()', '".year-month-button[value=<<]"');
112     eventSender.keyDown('\t', ['shiftKey']);
113     shouldBe('focusedElement()', '".clear-button[value=Clear]"');
114
115     eventSender.keyDown('\x1B');
116     shouldBeNull('document.getElementById("mock-page-popup")');
117     shouldBe('document.getElementById("date").value', '"1999-12-26"');
118
119     finishJSTest();
120 }
121
122 function testToday() {
123     eventSender.keyDown('t');
124     var now = new Date();
125     var expectedDate = serializeDate(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate());
126     var expectedMonth = now.getUTCFullYear() + "-" + now.getMonth();
127     return selectedDate() === expectedDate && currentMonth() === expectedMonth;
128 }
129
130 function serializeDate(year, month, day) {
131     var yearString = String(year);
132     if (yearString.length < 4)
133         yearString = ("000" + yearString).substr(-4, 4);
134     return yearString + "-" + ("0" + (month + 1)).substr(-2, 2) + "-" + ("0" + day).substr(-2, 2);
135 }
136
137 function focusedElement() {
138     var element = popupWindow.document.activeElement;
139     if (!element)
140         return null;
141     var identifier = "." + element.className;
142     if (element.value)
143         identifier += "[value=" + element.value + "]";
144     return identifier;
145 }
146
147 </script>
148 <script src="../../js/resources/js-test-post.js"></script>
149 </body>
150