/toolkit/content/tests/chrome/test_datepicker.xul

http://github.com/zpao/v8monkey · Unknown · 416 lines · 345 code · 71 blank · 0 comment · 0 complexity · 7f62d2e2a355ea8603039d4ff64ebb0a MD5 · raw file

  1. <?xml version="1.0"?>
  2. <?xml-stylesheet href="chrome://global/skin" type="text/css"?>
  3. <?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" type="text/css"?>
  4. <!--
  5. XUL Widget Test for datepicker
  6. -->
  7. <window title="datepicker" width="500" height="600"
  8. onload="setTimeout(testtag_datepickers, 0);"
  9. xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  10. <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
  11. <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
  12. <hbox onpopupshown="testtag_datepicker_UI_popup()"
  13. onpopuphidden="testtag_finish()">
  14. <datepicker id="datepicker"/>
  15. <datepicker id="datepicker-popup" type="popup"/>
  16. <hbox onDOMMouseScroll="mouseScrolled = event.defaultPrevented;">
  17. <datepicker id="datepicker-grid" type="grid"/>
  18. </hbox>
  19. </hbox>
  20. <!-- Test-only key bindings, but must not conflict with the application. -->
  21. <keyset id="mainKeyset">
  22. <key id="key_alt_z" key="Z" oncommand="return" modifiers="alt"/>
  23. <key id="key_ctrl_q" key="Q" oncommand="return" modifiers="control"/>
  24. <key id="key_meta_e" key="E" oncommand="return" modifiers="meta"/>
  25. </keyset>
  26. <body xmlns="http://www.w3.org/1999/xhtml">
  27. <p id="display"></p>
  28. <div id="content" style="display: none">
  29. </div>
  30. <pre id="test">
  31. </pre>
  32. </body>
  33. <script>
  34. <![CDATA[
  35. var mouseScrolled = false;
  36. SimpleTest.waitForExplicitFinish();
  37. function testtag_datepickers()
  38. {
  39. var dppopup = document.getElementById("datepicker-popup");
  40. testtag_datepicker(document.getElementById("datepicker"), "", "datepicker");
  41. testtag_datepicker(dppopup, "popup", "datepicker popup");
  42. testtag_datepicker(document.getElementById("datepicker-grid"), "grid", "datepicker grid");
  43. dppopup.open = true;
  44. }
  45. function testtag_finish()
  46. {
  47. ok(!document.getElementById("datepicker-popup").open, "datepicker popup open false again");
  48. var dpgrid = document.getElementById("datepicker-grid");
  49. synthesizeMouseScroll(dpgrid, 5, 5, { delta: 10 });
  50. is(mouseScrolled, true, "mouse scrolled");
  51. is(dpgrid.displayedMonth, 2, "mouse scroll changed month");
  52. SimpleTest.finish();
  53. }
  54. function testtag_datepicker(dp, type, testid)
  55. {
  56. testid += " ";
  57. var today = new Date();
  58. var tyear = today.getFullYear();
  59. var tmonth = today.getMonth();
  60. var tdate = today.getDate();
  61. // testtag_comparedate(dp, testid + "initial", tyear, tmonth, tdate);
  62. // check that setting the value property works
  63. dp.value = testtag_getdatestring(tyear, tmonth, tdate);
  64. testtag_comparedate(dp, testid + "set value", tyear, tmonth, tdate);
  65. // check that setting the dateValue property works
  66. dp.dateValue = today;
  67. testtag_comparedate(dp, testid + "set dateValue", tyear, tmonth, tdate);
  68. ok(dp.value !== today, testid + " set dateValue different date");
  69. ok(!dp.readOnly, testid + "readOnly");
  70. dp.readOnly = true;
  71. ok(dp.readOnly, testid + "set readOnly");
  72. dp.readOnly = false;
  73. ok(!dp.readOnly, testid + "clear readOnly");
  74. var setDateField = function(field, value, expectException,
  75. expectedYear, expectedMonth, expectedDate)
  76. {
  77. var exh = false;
  78. try {
  79. dp[field] = value;
  80. } catch (ex) { exh = true; }
  81. is(exh, expectException, testid + "set " + field + " " + value);
  82. testtag_comparedate(dp, testid + "set " + field + " " + value,
  83. expectedYear, expectedMonth, expectedDate);
  84. }
  85. // check the value property
  86. setDateField("value", "2003-1-27", false, 2003, 0, 27);
  87. setDateField("value", "2002-11-8", false, 2002, 10, 8);
  88. setDateField("value", "2001-07-02", false, 2001, 6, 2);
  89. setDateField("value", "2002-10-25", false, 2002, 9, 25);
  90. // check that the year, month and date fields can be set properly
  91. setDateField("year", 2002, false, 2002, 9, 25);
  92. setDateField("year", 0, true, 2002, 9, 25);
  93. setDateField("month", 6, false, 2002, 6, 25);
  94. setDateField("month", 9, false, 2002, 9, 25);
  95. setDateField("month", 10, false, 2002, 10, 25);
  96. setDateField("month", -1, true, 2002, 10, 25);
  97. setDateField("month", 12, true, 2002, 10, 25);
  98. setDateField("date", 9, false, 2002, 10, 9);
  99. setDateField("date", 10, false, 2002, 10, 10);
  100. setDateField("date", 15, false, 2002, 10, 15);
  101. setDateField("date", 0, true, 2002, 10, 15);
  102. setDateField("date", 32, true, 2002, 10, 15);
  103. // check that dates overflow properly
  104. setDateField("value", "2002-2-40", false, 2002, 2, 12);
  105. setDateField("value", "2003-03-32", false, 2003, 3, 1);
  106. setDateField("value", "2003-12-32", false, 2004, 0, 1);
  107. // check leap year handling
  108. setDateField("value", "1600-2-29", false, 1600, 1, 29);
  109. setDateField("value", "2000-2-29", false, 2000, 1, 29);
  110. setDateField("value", "2003-2-29", false, 2003, 2, 1);
  111. setDateField("value", "2004-2-29", false, 2004, 1, 29);
  112. setDateField("value", "2100-2-29", false, 2100, 2, 1);
  113. // check invalid values for the value and dateValue properties
  114. dp.value = "2002-07-15";
  115. setDateField("value", "", true, 2002, 6, 15);
  116. setDateField("value", "2-2", true, 2002, 6, 15);
  117. setDateField("value", "2000-5-6-6", true, 2002, 6, 15);
  118. setDateField("value", "2000-a-19", true, 2002, 6, 15);
  119. setDateField("dateValue", "none", true, 2002, 6, 15);
  120. // grid and popup types can display a different month than the current one
  121. var isGridOrPopup = (type == "grid" || type == "popup");
  122. dp.displayedMonth = 3;
  123. testtag_comparedate(dp, testid + "set displayedMonth",
  124. 2002, isGridOrPopup ? 6 : 3, 15, 3);
  125. dp.displayedYear = 2009;
  126. testtag_comparedate(dp, testid + "set displayedYear",
  127. isGridOrPopup ? 2002 : 2009, isGridOrPopup ? 6 : 3, 15, 3, 2009);
  128. if (isGridOrPopup) {
  129. dp.value = "2008-02-29";
  130. dp.displayedYear = 2009;
  131. is(dp.displayedMonth, 1, "set displayedYear during leap year");
  132. }
  133. is(dp.open, false, testid + "open false");
  134. if (type != "popup") {
  135. dp.open = true;
  136. ok(!dp.open, testid + "open still false");
  137. }
  138. // check the fields
  139. if (type != "grid") {
  140. ok(dp.yearField instanceof HTMLInputElement, testid + "yearField");
  141. ok(dp.monthField instanceof HTMLInputElement, testid + "monthField");
  142. ok(dp.dateField instanceof HTMLInputElement, testid + "dateField");
  143. testtag_datepicker_UI_fields(dp, testid);
  144. dp.readOnly = true;
  145. // check that keyboard usage doesn't change the value when the datepicker
  146. // is read only
  147. testtag_datepicker_UI_key(dp, testid + "readonly ", "2003-01-29",
  148. dp.yearField, 2003, 0, 29, 2003, 0, 29);
  149. testtag_datepicker_UI_key(dp, testid + "readonly ", "2003-04-29",
  150. dp.monthField, 2003, 3, 29, 2003, 3, 29);
  151. testtag_datepicker_UI_key(dp, testid + "readonly ", "2003-06-15",
  152. dp.dateField, 2003, 5, 15, 2003, 5, 15);
  153. dp.readOnly = false;
  154. }
  155. else {
  156. testtag_datepicker_UI_grid(dp, "grid", testid);
  157. }
  158. }
  159. function testtag_datepicker_UI_fields(dp, testid)
  160. {
  161. testid += "UI";
  162. dp.focus();
  163. // test adjusting the date with the up and down keys
  164. testtag_datepicker_UI_key(dp, testid, "2003-01-29", dp.yearField, 2004, 0, 29, 2003, 0, 29);
  165. testtag_datepicker_UI_key(dp, testid, "1600-02-29", dp.yearField, 1601, 1, 28, 1600, 1, 28);
  166. testtag_datepicker_UI_key(dp, testid, "2000-02-29", dp.yearField, 2001, 1, 28, 2000, 1, 28);
  167. testtag_datepicker_UI_key(dp, testid, "2004-02-29", dp.yearField, 2005, 1, 28, 2004, 1, 28);
  168. testtag_datepicker_UI_key(dp, testid, "2003-04-29", dp.monthField, 2003, 4, 29, 2003, 3, 29);
  169. testtag_datepicker_UI_key(dp, testid, "2003-01-15", dp.monthField, 2003, 1, 15, 2003, 0, 15);
  170. testtag_datepicker_UI_key(dp, testid, "2003-12-29", dp.monthField, 2003, 0, 29, 2003, 11, 29);
  171. testtag_datepicker_UI_key(dp, testid, "2003-03-31", dp.monthField, 2003, 3, 30, 2003, 2, 30);
  172. testtag_datepicker_UI_key(dp, testid, "2003-06-15", dp.dateField, 2003, 5, 16, 2003, 5, 15);
  173. testtag_datepicker_UI_key(dp, testid, "2003-06-01", dp.dateField, 2003, 5, 2, 2003, 5, 1);
  174. testtag_datepicker_UI_key(dp, testid, "2003-06-30", dp.dateField, 2003, 5, 1, 2003, 5, 30);
  175. testtag_datepicker_UI_key(dp, testid, "1600-02-28", dp.dateField, 1600, 1, 29, 1600, 1, 28);
  176. testtag_datepicker_UI_key(dp, testid, "2000-02-28", dp.dateField, 2000, 1, 29, 2000, 1, 28);
  177. testtag_datepicker_UI_key(dp, testid, "2003-02-28", dp.dateField, 2003, 1, 1, 2003, 1, 28);
  178. testtag_datepicker_UI_key(dp, testid, "2004-02-28", dp.dateField, 2004, 1, 29, 2004, 1, 28);
  179. testtag_datepicker_UI_key(dp, testid, "2100-02-28", dp.dateField, 2100, 1, 1, 2100, 1, 28);
  180. synthesizeKeyExpectEvent('Z', { altKey: true }, $("key_alt_z"), "command", testid + " alt shortcut");
  181. synthesizeKeyExpectEvent('Q', { ctrlKey: true }, $("key_ctrl_q"), "command", testid + " ctrl shortcut");
  182. synthesizeKeyExpectEvent('E', { metaKey: true }, $("key_meta_e"), "command", testid + " meta shortcut");
  183. }
  184. function testtag_datepicker_UI_grid(dp, type, testid)
  185. {
  186. testid += "UI ";
  187. // check that pressing the cursor keys moves the date properly. For grid
  188. // types, focus the grid first. For popup types, the grid should be focused
  189. // automatically when opening the popup.
  190. var ktarget = dp;
  191. if (type == "grid")
  192. dp.focus();
  193. else
  194. ktarget = dp.attachedControl;
  195. dp.value = "2003-02-22";
  196. synthesizeKeyExpectEvent("VK_LEFT", { }, ktarget, "change", testid + "key left");
  197. is(dp.value, "2003-02-21", testid + "key left");
  198. synthesizeKeyExpectEvent("VK_RIGHT", { }, ktarget, "change", testid + "key right");
  199. is(dp.value, "2003-02-22", testid + "key right");
  200. synthesizeKeyExpectEvent("VK_RIGHT", { }, ktarget, "change", testid + "key right next week");
  201. is(dp.value, "2003-02-23", testid + "key right next week");
  202. synthesizeKeyExpectEvent("VK_LEFT", { }, ktarget, "change", testid + "key left previous week");
  203. is(dp.value, "2003-02-22", testid + "key left previous week");
  204. synthesizeKeyExpectEvent("VK_UP", { }, ktarget, "change", testid + "key up");
  205. is(dp.value, "2003-02-15", testid + "key up");
  206. synthesizeKeyExpectEvent("VK_DOWN", { }, ktarget, "change", testid + "key down");
  207. is(dp.value, "2003-02-22", testid + "key down");
  208. synthesizeKeyExpectEvent("VK_DOWN", { }, ktarget, "change");
  209. is(dp.value, "2003-03-01", testid + "key down next month", testid + "key down next month");
  210. synthesizeKeyExpectEvent("VK_UP", { }, ktarget, "change");
  211. is(dp.value, "2003-02-22", testid + "key up previous month", testid + "key up previous month");
  212. // the displayed month may be changed with the page up and page down keys,
  213. // however this only changes the displayed month, not the current value.
  214. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down");
  215. is(dp.value, "2003-02-22", testid + "key page down");
  216. // the monthchange event is fired when the displayed month is changed
  217. synthesizeKeyExpectEvent("VK_UP", { }, ktarget, "monthchange", testid + "key up after month change");
  218. is(dp.value, "2003-02-15", testid + "key up after month change");
  219. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up");
  220. is(dp.value, "2003-02-15", testid + "key page up");
  221. // check handling at the start and end of the month
  222. dp.value = "2010-10-01";
  223. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up 2010-10-01");
  224. is(dp.displayedMonth, 8, testid + "key page up 2010-10-01 displayedMonth");
  225. is(dp.displayedYear, 2010, testid + "key page up 2010-10-01 displayedYear");
  226. dp.value = "2010-10-01";
  227. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down 2010-10-01");
  228. is(dp.displayedMonth, 10, testid + "key page down 2010-10-01 displayedMonth");
  229. is(dp.displayedYear, 2010, testid + "key page down 2010-10-01 displayedYear");
  230. dp.value = "2010-10-31";
  231. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up 2010-10-31");
  232. is(dp.displayedMonth, 8, testid + "key page up 2010-10-31 displayedMonth");
  233. is(dp.displayedYear, 2010, testid + "key page up 2010-10-01 displayedYear");
  234. dp.value = "2010-10-31";
  235. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down 2010-10-31");
  236. is(dp.displayedMonth, 10, testid + "key page down 2010-10-31 displayedMonth");
  237. is(dp.displayedYear, 2010, testid + "key page up 2010-10-31 displayedYear");
  238. // check handling at the end of february
  239. dp.value = "2010-03-31";
  240. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up 2010-03-31");
  241. is(dp.displayedMonth, 1, testid + "key page up 2010-03-31 displayedMonth");
  242. is(dp.displayedYear, 2010, testid + "key page up 2010-03-31 displayedYear");
  243. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up 2010-02-28");
  244. is(dp.displayedMonth, 0, testid + "key page up 2010-02-28 displayedMonth");
  245. is(dp.displayedYear, 2010, testid + "key page up 2010-02-28 displayedYear");
  246. dp.value = "2010-01-31";
  247. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down 2010-01-31");
  248. is(dp.displayedMonth, 1, testid + "key page down 2010-01-31 displayedMonth");
  249. is(dp.displayedYear, 2010, testid + "key page up 2010-01-31 displayedYear");
  250. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down 2010-02-28");
  251. is(dp.displayedMonth, 2, testid + "key page down 2010-02-28 displayedMonth");
  252. is(dp.displayedYear, 2010, testid + "key page up 2010-02-28 displayedYear");
  253. // check handling at the end of february during a leap year
  254. dp.value = "2008-01-31";
  255. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange", testid + "key page down 2008-01-31");
  256. is(dp.displayedMonth, 1, testid + "key page down 2008-01-31 displayedMonth");
  257. is(dp.displayedYear, 2008, testid + "key page up 2008-01-31 displayedYear");
  258. dp.value = "2008-03-31";
  259. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange", testid + "key page up 2008-03-31");
  260. is(dp.displayedMonth, 1, testid + "key page up 2008-03-31 displayedMonth");
  261. is(dp.displayedYear, 2008, testid + "key page up 2008-03-31 displayedYear");
  262. // the value of a read only datepicker cannot be changed
  263. dp.value = "2003-02-15";
  264. dp.readOnly = true;
  265. synthesizeKeyExpectEvent("VK_LEFT", { }, ktarget, "!change", testid + "key left read only");
  266. is(dp.value, "2003-02-15", testid + "key left read only");
  267. synthesizeKeyExpectEvent("VK_RIGHT", { }, ktarget, "!change", testid + "key right read only");
  268. is(dp.value, "2003-02-15", testid + "key right read only");
  269. synthesizeKeyExpectEvent("VK_DOWN", { }, ktarget, "!change", testid + "key down read only");
  270. is(dp.value, "2003-02-15", testid + "key down read only");
  271. synthesizeKeyExpectEvent("VK_UP", { }, ktarget, "!change", testid + "key up read only");
  272. is(dp.value, "2003-02-15", testid + "key up read only");
  273. // month can still be changed even when readonly
  274. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "monthchange",
  275. testid + "key page up read only");
  276. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "monthchange",
  277. testid + "key page down read only");
  278. dp.readOnly = false;
  279. synthesizeKeyExpectEvent("VK_LEFT", { }, ktarget, "change", testid + "key left changeable again");
  280. is(dp.value, "2003-02-14", testid + "key left changeable again");
  281. // the value of a disabled datepicker cannot be changed
  282. dp.disabled = true;
  283. synthesizeKeyExpectEvent("VK_LEFT", { }, ktarget, "!change", testid + "key left disabled");
  284. is(dp.value, "2003-02-14", testid + "key left disabled");
  285. synthesizeKeyExpectEvent("VK_RIGHT", { }, ktarget, "!change", testid + "key right disabled");
  286. is(dp.value, "2003-02-14", testid + "key right disabled");
  287. synthesizeKeyExpectEvent("VK_DOWN", { }, ktarget, "!change", testid + "key down disabled");
  288. is(dp.value, "2003-02-14", testid + "key down disabled");
  289. synthesizeKeyExpectEvent("VK_UP", { }, ktarget, "!change", testid + "key up disabled");
  290. is(dp.value, "2003-02-14", testid + "key up disabled");
  291. // month cannot be changed even when disabled
  292. synthesizeKeyExpectEvent("VK_PAGE_DOWN", { }, ktarget, "!monthchange",
  293. testid + "key page down disabled");
  294. synthesizeKeyExpectEvent("VK_PAGE_UP", { }, ktarget, "!monthchange",
  295. testid + "key page up disabled");
  296. dp.disabled = false;
  297. synthesizeKeyExpectEvent("VK_RIGHT", { }, ktarget, "change", testid + "key right enabled again");
  298. is(dp.value, "2003-02-15", testid + "key right enabled again");
  299. }
  300. function testtag_datepicker_UI_popup()
  301. {
  302. var dppopup = document.getElementById("datepicker-popup");
  303. is(dppopup.open, true, "datepicker popup after open");
  304. testtag_datepicker_UI_grid(dppopup, "popup", "datepicker popup ");
  305. dppopup.open = false;
  306. }
  307. function testtag_datepicker_UI_key(dp, testid, value, field,
  308. uyear, umonth, udate,
  309. dyear, dmonth, ddate)
  310. {
  311. dp.value = value;
  312. field.focus();
  313. synthesizeKey("VK_UP", { });
  314. testtag_comparedate(dp, testid + " " + value + " key up", uyear, umonth, udate);
  315. synthesizeKey("VK_DOWN", { });
  316. testtag_comparedate(dp, testid + " " + value + " key down", dyear, dmonth, ddate);
  317. }
  318. function testtag_getdatestring(year, month, date)
  319. {
  320. month = (month < 9) ? ("0" + ++month) : month + 1;
  321. if (date < 10)
  322. date = "0" + date;
  323. return year + "-" + month + "-" + date;
  324. }
  325. function testtag_comparedate(dp, testid, year, month, date, displayedMonth, displayedYear)
  326. {
  327. is(dp.value, testtag_getdatestring(year, month, date), testid + " value");
  328. if (testid.indexOf("initial") == -1)
  329. is(dp.getAttribute("value"),
  330. testtag_getdatestring(year, month, date),
  331. testid + " value attribute");
  332. var dateValue = dp.dateValue;
  333. ok(dateValue.getFullYear() == year &&
  334. dateValue.getMonth() == month &&
  335. dateValue.getDate() == date,
  336. testid + " dateValue");
  337. is(dp.year, year, testid + " year");
  338. is(dp.month, month, testid + " month");
  339. is(dp.displayedMonth, displayedMonth ? displayedMonth : month, testid + " displayedMonth");
  340. is(dp.displayedYear, displayedYear ? displayedYear : year, testid + " displayedYear");
  341. is(dp.date, date, testid + " date");
  342. }
  343. ]]>
  344. </script>
  345. </window>