options.js 78 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181
  1. module('Options', {
  2. setup: function(){},
  3. teardown: function(){
  4. $('#qunit-fixture *').each(function(){
  5. var t = $(this);
  6. if ('datepicker' in t.data())
  7. t.datepicker('remove');
  8. });
  9. }
  10. });
  11. test('Autoclose', function(){
  12. var input = $('<input />')
  13. .appendTo('#qunit-fixture')
  14. .val('2012-03-05')
  15. .datepicker({
  16. format: 'yyyy-mm-dd',
  17. autoclose: true
  18. }),
  19. dp = input.data('datepicker'),
  20. picker = dp.picker,
  21. target;
  22. input.focus();
  23. ok(picker.is(':visible'), 'Picker is visible');
  24. target = picker.find('.datepicker-days tbody td:nth(7)');
  25. equal(target.text(), '4'); // Mar 4
  26. target.click();
  27. ok(picker.is(':not(:visible)'), 'Picker is hidden');
  28. datesEqual(dp.dates[0], UTCDate(2012, 2, 4));
  29. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  30. });
  31. test('Custom date formatter functions', function(){
  32. var input = $('<input />')
  33. .appendTo('#qunit-fixture')
  34. .val('2015-09-18T00:00:00.000Z')
  35. .datepicker({
  36. format: {
  37. /*
  38. Say our UI should display a week ahead,
  39. but textbox should store the actual date.
  40. This is useful if we need UI to select local dates,
  41. but store in UTC
  42. */
  43. toDisplay: function (date, format, language) {
  44. var d = new Date(date);
  45. d.setDate(d.getDate() - 7);
  46. return d.toISOString();
  47. },
  48. toValue: function (date, format, language) {
  49. var d = new Date(date);
  50. d.setDate(d.getDate() + 7);
  51. return new Date(d);
  52. }
  53. },
  54. autoclose: true
  55. }),
  56. dp = input.data('datepicker'),
  57. picker = dp.picker,
  58. target;
  59. //Value is ISO format and is 7 days older than UI
  60. equal(input.val(), '2015-09-18T00:00:00.000Z');
  61. datesEqual(dp.dates[0], UTCDate(2015, 8, 25));
  62. datesEqual(dp.viewDate, UTCDate(2015, 8, 25));
  63. input.focus();
  64. ok(picker.is(':visible'), 'Picker is visible');
  65. target = picker.find('.datepicker-days tbody td:nth(5)');
  66. equal(target.text(), '4'); // Sep 4
  67. target.click();
  68. ok(picker.is(':not(:visible)'), 'Picker is hidden');
  69. //Value is now 28th Aug 2015 in ISO format
  70. //and is 7 days older than UI
  71. equal(input.val(), '2015-08-28T00:00:00.000Z');
  72. datesEqual(dp.dates[0], UTCDate(2015, 8, 4));
  73. datesEqual(dp.viewDate, UTCDate(2015, 8, 4));
  74. });
  75. test('Startview: year view (integer)', function(){
  76. var input = $('<input />')
  77. .appendTo('#qunit-fixture')
  78. .val('2012-03-05')
  79. .datepicker({
  80. format: 'yyyy-mm-dd',
  81. startView: 1
  82. }),
  83. dp = input.data('datepicker'),
  84. picker = dp.picker,
  85. target;
  86. input.focus();
  87. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  88. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  89. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  90. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  91. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  92. });
  93. test('Startview: year view (string)', function(){
  94. var input = $('<input />')
  95. .appendTo('#qunit-fixture')
  96. .val('2012-03-05')
  97. .datepicker({
  98. format: 'yyyy-mm-dd',
  99. startView: 'year'
  100. }),
  101. dp = input.data('datepicker'),
  102. picker = dp.picker,
  103. target;
  104. input.focus();
  105. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  106. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  107. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  108. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  109. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  110. });
  111. test('Startview: decade view (integer)', function(){
  112. var input = $('<input />')
  113. .appendTo('#qunit-fixture')
  114. .val('2012-03-05')
  115. .datepicker({
  116. format: 'yyyy-mm-dd',
  117. startView: 2
  118. }),
  119. dp = input.data('datepicker'),
  120. picker = dp.picker,
  121. target;
  122. input.focus();
  123. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  124. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  125. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  126. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  127. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  128. });
  129. test('Startview: decade view (string)', function(){
  130. var input = $('<input />')
  131. .appendTo('#qunit-fixture')
  132. .val('2012-03-05')
  133. .datepicker({
  134. format: 'yyyy-mm-dd',
  135. startView: 'decade'
  136. }),
  137. dp = input.data('datepicker'),
  138. picker = dp.picker,
  139. target;
  140. input.focus();
  141. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  142. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  143. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  144. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  145. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  146. });
  147. test('Startview: century view (integer)', function(){
  148. var input = $('<input />')
  149. .appendTo('#qunit-fixture')
  150. .val('2012-03-05')
  151. .datepicker({
  152. format: 'yyyy-mm-dd',
  153. startView: 3
  154. }),
  155. dp = input.data('datepicker'),
  156. picker = dp.picker,
  157. target;
  158. input.focus();
  159. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  160. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  161. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  162. ok(picker.find('.datepicker-decades').is(':visible'), 'Decades view visible');
  163. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  164. });
  165. test('Startview: century view (string)', function(){
  166. var input = $('<input />')
  167. .appendTo('#qunit-fixture')
  168. .val('2012-03-05')
  169. .datepicker({
  170. format: 'yyyy-mm-dd',
  171. startView: 'century'
  172. }),
  173. dp = input.data('datepicker'),
  174. picker = dp.picker,
  175. target;
  176. input.focus();
  177. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  178. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  179. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  180. ok(picker.find('.datepicker-decades').is(':visible'), 'Decades view visible');
  181. ok(picker.find('.datepicker-centuries').is(':not(:visible)'), 'Centuries view hidden');
  182. });
  183. test('Startview: millennium view (integer)', function(){
  184. var input = $('<input />')
  185. .appendTo('#qunit-fixture')
  186. .val('2012-03-05')
  187. .datepicker({
  188. format: 'yyyy-mm-dd',
  189. startView: 4
  190. }),
  191. dp = input.data('datepicker'),
  192. picker = dp.picker,
  193. target;
  194. input.focus();
  195. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  196. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  197. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  198. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  199. ok(picker.find('.datepicker-centuries').is(':visible'), 'Centuries view visible');
  200. });
  201. test('Startview: millennium view (string)', function(){
  202. var input = $('<input />')
  203. .appendTo('#qunit-fixture')
  204. .val('2012-03-05')
  205. .datepicker({
  206. format: 'yyyy-mm-dd',
  207. startView: 'millennium'
  208. }),
  209. dp = input.data('datepicker'),
  210. picker = dp.picker,
  211. target;
  212. input.focus();
  213. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  214. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  215. ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
  216. ok(picker.find('.datepicker-decades').is(':not(:visible)'), 'Decades view hidden');
  217. ok(picker.find('.datepicker-centuries').is(':visible'), 'Centuries view visible');
  218. });
  219. test('Today Button: today button not default', function(){
  220. var input = $('<input />')
  221. .appendTo('#qunit-fixture')
  222. .val('2012-03-05')
  223. .datepicker({
  224. format: 'yyyy-mm-dd'
  225. }),
  226. dp = input.data('datepicker'),
  227. picker = dp.picker,
  228. target;
  229. input.focus();
  230. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  231. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  232. });
  233. test('Today Button: today visibility when enabled', function(){
  234. var input = $('<input />')
  235. .appendTo('#qunit-fixture')
  236. .val('2012-03-05')
  237. .datepicker({
  238. format: 'yyyy-mm-dd',
  239. todayBtn: true
  240. }),
  241. dp = input.data('datepicker'),
  242. picker = dp.picker,
  243. target;
  244. input.focus();
  245. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  246. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  247. picker.find('.datepicker-days thead th.datepicker-switch').click();
  248. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  249. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  250. picker.find('.datepicker-months thead th.datepicker-switch').click();
  251. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  252. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  253. });
  254. test('Today Button: today invisible when enabled and startDate is after today', function () {
  255. var startDate = new Date();
  256. startDate.setDate(startDate.getDate() + 1);
  257. var input = $('<input />')
  258. .appendTo('#qunit-fixture')
  259. .val('2012-03-05')
  260. .datepicker({
  261. format: 'yyyy-mm-dd',
  262. startDate: startDate,
  263. todayBtn: true
  264. }),
  265. dp = input.data('datepicker'),
  266. picker = dp.picker,
  267. target;
  268. input.focus();
  269. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  270. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  271. picker.find('.datepicker-days thead th.datepicker-switch').click();
  272. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  273. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  274. picker.find('.datepicker-months thead th.datepicker-switch').click();
  275. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  276. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  277. });
  278. test('Today Button: today invisible when enabled and endDate is before today', function () {
  279. var endDate = new Date();
  280. endDate.setDate(endDate.getDate() - 1);
  281. var input = $('<input />')
  282. .appendTo('#qunit-fixture')
  283. .val('2012-03-05')
  284. .datepicker({
  285. format: 'yyyy-mm-dd',
  286. endDate: endDate,
  287. todayBtn: true
  288. }),
  289. dp = input.data('datepicker'),
  290. picker = dp.picker,
  291. target;
  292. input.focus();
  293. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  294. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  295. picker.find('.datepicker-days thead th.datepicker-switch').click();
  296. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  297. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  298. picker.find('.datepicker-months thead th.datepicker-switch').click();
  299. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  300. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  301. });
  302. test('Today Button: today visible when enabled and today is between startDate and enDate', function () {
  303. var startDate = new Date();
  304. startDate.setDate(startDate.getDate() - 1);
  305. var endDate = new Date();
  306. endDate.setDate(endDate.getDate() + 1);
  307. var input = $('<input />')
  308. .appendTo('#qunit-fixture')
  309. .val('2012-03-05')
  310. .datepicker({
  311. format: 'yyyy-mm-dd',
  312. startDate: startDate,
  313. endDate: endDate,
  314. todayBtn: true
  315. }),
  316. dp = input.data('datepicker'),
  317. picker = dp.picker,
  318. target;
  319. input.focus();
  320. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  321. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  322. picker.find('.datepicker-days thead th.datepicker-switch').click();
  323. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  324. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  325. picker.find('.datepicker-months thead th.datepicker-switch').click();
  326. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  327. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  328. });
  329. test('Today Button: today visible when enabled and daysOfWeekDisabled does not include current day', function () {
  330. var input = $('<input />')
  331. .appendTo('#qunit-fixture')
  332. .val('2012-03-05')
  333. .datepicker({
  334. format: 'yyyy-mm-dd',
  335. daysOfWeekDisabled: [(new Date().getDay() + 1) % 7],
  336. todayBtn: true
  337. }),
  338. dp = input.data('datepicker'),
  339. picker = dp.picker,
  340. target;
  341. input.focus();
  342. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  343. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  344. picker.find('.datepicker-days thead th.datepicker-switch').click();
  345. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  346. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  347. picker.find('.datepicker-months thead th.datepicker-switch').click();
  348. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  349. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  350. });
  351. test('Today Button: today invisible when enabled and daysOfWeekDisabled includes current day', function () {
  352. var input = $('<input />')
  353. .appendTo('#qunit-fixture')
  354. .val('2012-03-05')
  355. .datepicker({
  356. format: 'yyyy-mm-dd',
  357. daysOfWeekDisabled: [new Date().getDay()],
  358. todayBtn: true
  359. }),
  360. dp = input.data('datepicker'),
  361. picker = dp.picker,
  362. target;
  363. input.focus();
  364. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  365. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  366. picker.find('.datepicker-days thead th.datepicker-switch').click();
  367. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  368. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  369. picker.find('.datepicker-months thead th.datepicker-switch').click();
  370. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  371. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  372. });
  373. test('Today Button: today visibility when linked', function () {
  374. var input = $('<input />')
  375. .appendTo('#qunit-fixture')
  376. .val('2012-03-05')
  377. .datepicker({
  378. format: 'yyyy-mm-dd',
  379. todayBtn: 'linked'
  380. }),
  381. dp = input.data('datepicker'),
  382. picker = dp.picker,
  383. target;
  384. input.focus();
  385. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  386. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  387. picker.find('.datepicker-days thead th.datepicker-switch').click();
  388. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  389. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  390. picker.find('.datepicker-months thead th.datepicker-switch').click();
  391. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  392. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  393. });
  394. test('Today Button: today invisible when linked and startDate is after today', function () {
  395. var startDate = new Date();
  396. startDate.setDate(startDate.getDate() + 1);
  397. var input = $('<input />')
  398. .appendTo('#qunit-fixture')
  399. .val('2012-03-05')
  400. .datepicker({
  401. format: 'yyyy-mm-dd',
  402. startDate: startDate,
  403. todayBtn: 'linked'
  404. }),
  405. dp = input.data('datepicker'),
  406. picker = dp.picker,
  407. target;
  408. input.focus();
  409. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  410. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  411. picker.find('.datepicker-days thead th.datepicker-switch').click();
  412. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  413. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  414. picker.find('.datepicker-months thead th.datepicker-switch').click();
  415. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  416. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  417. });
  418. test('Today Button: today invisible when linked and endDate is before today', function () {
  419. var endDate = new Date();
  420. endDate.setDate(endDate.getDate() - 1);
  421. var input = $('<input />')
  422. .appendTo('#qunit-fixture')
  423. .val('2012-03-05')
  424. .datepicker({
  425. format: 'yyyy-mm-dd',
  426. endDate: endDate,
  427. todayBtn: 'linked'
  428. }),
  429. dp = input.data('datepicker'),
  430. picker = dp.picker,
  431. target;
  432. input.focus();
  433. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  434. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  435. picker.find('.datepicker-days thead th.datepicker-switch').click();
  436. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  437. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  438. picker.find('.datepicker-months thead th.datepicker-switch').click();
  439. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  440. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  441. });
  442. test('Today Button: today visible when linked and today is between startDate and enDate', function () {
  443. var startDate = new Date();
  444. startDate.setDate(startDate.getDate() - 1);
  445. var endDate = new Date();
  446. endDate.setDate(endDate.getDate() + 1);
  447. var input = $('<input />')
  448. .appendTo('#qunit-fixture')
  449. .val('2012-03-05')
  450. .datepicker({
  451. format: 'yyyy-mm-dd',
  452. startDate: startDate,
  453. endDate: endDate,
  454. todayBtn: 'linked'
  455. }),
  456. dp = input.data('datepicker'),
  457. picker = dp.picker,
  458. target;
  459. input.focus();
  460. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  461. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  462. picker.find('.datepicker-days thead th.datepicker-switch').click();
  463. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  464. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  465. picker.find('.datepicker-months thead th.datepicker-switch').click();
  466. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  467. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  468. });
  469. test('Today Button: today visible when linked and daysOfWeekDisabled does not include current day', function () {
  470. var input = $('<input />')
  471. .appendTo('#qunit-fixture')
  472. .val('2012-03-05')
  473. .datepicker({
  474. format: 'yyyy-mm-dd',
  475. daysOfWeekDisabled: [(new Date().getDay + 1) % 7],
  476. todayBtn: 'linked'
  477. }),
  478. dp = input.data('datepicker'),
  479. picker = dp.picker,
  480. target;
  481. input.focus();
  482. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  483. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  484. picker.find('.datepicker-days thead th.datepicker-switch').click();
  485. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  486. ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
  487. picker.find('.datepicker-months thead th.datepicker-switch').click();
  488. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  489. ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
  490. });
  491. test('Today Button: today invisible when linked and daysOfWeekDisabled includes current day', function () {
  492. var input = $('<input />')
  493. .appendTo('#qunit-fixture')
  494. .val('2012-03-05')
  495. .datepicker({
  496. format: 'yyyy-mm-dd',
  497. daysOfWeekDisabled: [new Date().getDay()],
  498. todayBtn: 'linked'
  499. }),
  500. dp = input.data('datepicker'),
  501. picker = dp.picker,
  502. target;
  503. input.focus();
  504. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  505. ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
  506. picker.find('.datepicker-days thead th.datepicker-switch').click();
  507. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  508. ok(picker.find('.datepicker-months tfoot .today').is(':not(:visible)'), 'Today button not visible');
  509. picker.find('.datepicker-months thead th.datepicker-switch').click();
  510. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  511. ok(picker.find('.datepicker-years tfoot .today').is(':not(:visible)'), 'Today button not visible');
  512. });
  513. test('Today Button: data-api', function(){
  514. var input = $('<input data-date-today-btn="true" />')
  515. .appendTo('#qunit-fixture')
  516. .val('2012-03-05')
  517. .datepicker({
  518. format: 'yyyy-mm-dd'
  519. }),
  520. dp = input.data('datepicker'),
  521. picker = dp.picker,
  522. target;
  523. input.focus();
  524. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  525. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  526. });
  527. test('Today Button: moves to today\'s date', function(){
  528. var input = $('<input />')
  529. .appendTo('#qunit-fixture')
  530. .val('2012-03-05')
  531. .datepicker({
  532. format: 'yyyy-mm-dd',
  533. todayBtn: true
  534. }),
  535. dp = input.data('datepicker'),
  536. picker = dp.picker,
  537. target;
  538. input.focus();
  539. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  540. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  541. target = picker.find('.datepicker-days tfoot .today');
  542. target.click();
  543. var d = new Date(),
  544. today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate());
  545. datesEqual(dp.viewDate, today);
  546. datesEqual(dp.dates[0], UTCDate(2012, 2, 5));
  547. });
  548. test('Today Button: moves to days view', function(){
  549. var viewModes = $.fn.datepicker.DPGlobal.viewModes;
  550. var input = $('<input />')
  551. .appendTo('#qunit-fixture')
  552. .val('2012-03-05')
  553. .datepicker({
  554. format: 'yyyy-mm-dd',
  555. startView: viewModes.length - 1,
  556. todayBtn: true
  557. }),
  558. dp = input.data('datepicker'),
  559. picker = dp.picker,
  560. target;
  561. input.focus();
  562. target = picker.find('tfoot .today').filter(':visible');
  563. target.click();
  564. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  565. });
  566. test('Today Button: "linked" selects today\'s date', function(){
  567. var input = $('<input />')
  568. .appendTo('#qunit-fixture')
  569. .val('2012-03-05')
  570. .datepicker({
  571. format: 'yyyy-mm-dd',
  572. todayBtn: "linked"
  573. }),
  574. dp = input.data('datepicker'),
  575. picker = dp.picker,
  576. target;
  577. input.focus();
  578. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  579. ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
  580. target = picker.find('.datepicker-days tfoot .today');
  581. target.click();
  582. var d = new Date(),
  583. today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate());
  584. datesEqual(dp.viewDate, today);
  585. datesEqual(dp.dates[0], today);
  586. });
  587. test('Today Highlight: today\'s date is not highlighted by default', patch_date(function(Date){
  588. Date.now = function(){
  589. return UTCDate(2012, 2, 15).getTime();
  590. };
  591. var input = $('<input />')
  592. .appendTo('#qunit-fixture')
  593. .val('2012-03-05')
  594. .datepicker({
  595. format: 'yyyy-mm-dd'
  596. }),
  597. dp = input.data('datepicker'),
  598. picker = dp.picker,
  599. target;
  600. input.focus();
  601. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  602. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'March 2012', 'Title is "March 2012"');
  603. target = picker.find('.datepicker-days tbody td:contains(15)');
  604. ok(!target.hasClass('today'), 'Today is not marked with "today" class');
  605. target = picker.find('.datepicker-days tbody td:contains(14)');
  606. ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
  607. target = picker.find('.datepicker-days tbody td:contains(16)');
  608. ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
  609. }));
  610. test('Today Highlight: today\'s date is highlighted when not active', patch_date(function(Date){
  611. Date.now = function(){
  612. return UTCDate(2012, 2, 15).getTime();
  613. };
  614. var input = $('<input />')
  615. .appendTo('#qunit-fixture')
  616. .val('2012-03-05')
  617. .datepicker({
  618. format: 'yyyy-mm-dd',
  619. todayHighlight: true
  620. }),
  621. dp = input.data('datepicker'),
  622. picker = dp.picker,
  623. target;
  624. input.focus();
  625. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  626. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'March 2012', 'Title is "March 2012"');
  627. target = picker.find('.datepicker-days tbody td:contains(15)');
  628. ok(target.hasClass('today'), 'Today is marked with "today" class');
  629. target = picker.find('.datepicker-days tbody td:contains(14)');
  630. ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
  631. target = picker.find('.datepicker-days tbody td:contains(16)');
  632. ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
  633. }));
  634. test('Clear Button: clear visibility when enabled', function(){
  635. var input = $('<input />')
  636. .appendTo('#qunit-fixture')
  637. .val('2012-03-05')
  638. .datepicker({
  639. format: 'yyyy-mm-dd',
  640. clearBtn: true
  641. }),
  642. dp = input.data('datepicker'),
  643. picker = dp.picker,
  644. target;
  645. input.focus();
  646. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  647. ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Clear button visible');
  648. picker.find('.datepicker-days thead th.datepicker-switch').click();
  649. ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
  650. ok(picker.find('.datepicker-months tfoot .clear').is(':visible'), 'Clear button visible');
  651. picker.find('.datepicker-months thead th.datepicker-switch').click();
  652. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  653. ok(picker.find('.datepicker-years tfoot .clear').is(':visible'), 'Clear button visible');
  654. });
  655. test('Clear Button: clears input value', function(){
  656. var input = $('<input />')
  657. .appendTo('#qunit-fixture')
  658. .val('2012-03-05')
  659. .datepicker({
  660. format: 'yyyy-mm-dd',
  661. clearBtn: true
  662. }),
  663. dp = input.data('datepicker'),
  664. picker = dp.picker,
  665. target;
  666. input.focus();
  667. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  668. ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Today button visible');
  669. target = picker.find('.datepicker-days tfoot .clear');
  670. target.click();
  671. equal(input.val(),'',"Input value has been cleared.");
  672. ok(picker.is(':visible'), 'Picker is visible');
  673. });
  674. test('Clear Button: hides datepicker if autoclose is on', function(){
  675. var input = $('<input />')
  676. .appendTo('#qunit-fixture')
  677. .val('2012-03-05')
  678. .datepicker({
  679. format: 'yyyy-mm-dd',
  680. clearBtn: true,
  681. autoclose: true
  682. }),
  683. dp = input.data('datepicker'),
  684. picker = dp.picker,
  685. target;
  686. input.focus();
  687. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  688. ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Today button visible');
  689. target = picker.find('.datepicker-days tfoot .clear');
  690. target.click();
  691. equal(input.val(),'',"Input value has been cleared.");
  692. ok(picker.is(':not(:visible)'), 'Picker is hidden');
  693. });
  694. test('Active Toggle Default: when active date is selected it is not unset', function(){
  695. var input = $('<input />')
  696. .appendTo('#qunit-fixture')
  697. .val('2012-03-05')
  698. .datepicker({
  699. format: 'yyyy-mm-dd'
  700. }),
  701. dp = input.data('datepicker'),
  702. picker = dp.picker,
  703. target;
  704. // open our datepicker
  705. input.focus();
  706. // Initial value is selected
  707. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 selected');
  708. // click on our active date
  709. target = picker.find('.datepicker-days .day.active');
  710. target.click();
  711. // make sure it's still set
  712. equal(input.val(), '2012-03-05', "Input value has not been cleared.");
  713. });
  714. test('Active Toggle Enabled (single date): when active date is selected it is unset', function(){
  715. var input = $('<input />')
  716. .appendTo('#qunit-fixture')
  717. .val('2012-03-05')
  718. .datepicker({
  719. format: 'yyyy-mm-dd',
  720. toggleActive: true
  721. }),
  722. dp = input.data('datepicker'),
  723. picker = dp.picker,
  724. target;
  725. // open our datepicker
  726. input.focus();
  727. // Initial value is selected
  728. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 selected');
  729. // click on our active date
  730. target = picker.find('.datepicker-days .day.active');
  731. target.click();
  732. // make sure it's no longer set
  733. equal(input.val(), '', "Input value has been cleared.");
  734. });
  735. test('Active Toggle Multidate Default: when one of the active dates is selected it is unset', function(){
  736. var input = $('<input />')
  737. .appendTo('#qunit-fixture')
  738. .val('2012-03-05')
  739. .datepicker({
  740. format: 'yyyy-mm-dd',
  741. multidate: true
  742. }),
  743. dp = input.data('datepicker'),
  744. picker = dp.picker,
  745. target;
  746. // open our datepicker
  747. input.focus();
  748. // Initial value is selected
  749. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 in dates');
  750. // Select additional date
  751. target = picker.find('.datepicker-days tbody td:nth(7)');
  752. target.click();
  753. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
  754. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  755. equal(input.val(), '2012-03-05,2012-03-04');
  756. // Unselect additional date
  757. target = picker.find('.datepicker-days tbody td:nth(7)');
  758. target.click();
  759. ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
  760. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  761. equal(input.val(), '2012-03-05');
  762. });
  763. test('Active Toggle Disabled: when active date is selected it remains', function(){
  764. var input = $('<input />')
  765. .appendTo('#qunit-fixture')
  766. .val('2012-03-05')
  767. .datepicker({
  768. format: 'yyyy-mm-dd',
  769. toggleActive: false
  770. }),
  771. dp = input.data('datepicker'),
  772. picker = dp.picker,
  773. target;
  774. // open our datepicker
  775. input.focus();
  776. // Initial value is selected
  777. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 selected');
  778. // click on our active date
  779. target = picker.find('.datepicker-days .day.active');
  780. target.click();
  781. // make sure it's still set
  782. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 still selected');
  783. datesEqual(dp.viewDate, UTCDate(2012, 2, 5));
  784. equal(input.val(), '2012-03-05');
  785. });
  786. test('Active Toggle Multidate Disabled: when activeToggle is set to false, but multidate is set, the option is ignored and selecting an active date it is unset', function(){
  787. var input = $('<input />')
  788. .appendTo('#qunit-fixture')
  789. .val('2012-03-05')
  790. .datepicker({
  791. format: 'yyyy-mm-dd',
  792. multidate: true,
  793. toggleActive: false
  794. }),
  795. dp = input.data('datepicker'),
  796. picker = dp.picker,
  797. target;
  798. // open our datepicker
  799. input.focus();
  800. // Initial value is selected
  801. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 in dates');
  802. // Select additional date
  803. target = picker.find('.datepicker-days tbody td:nth(7)');
  804. target.click();
  805. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
  806. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  807. equal(input.val(), '2012-03-05,2012-03-04');
  808. // Unselect additional date
  809. target = picker.find('.datepicker-days tbody td:nth(7)');
  810. target.click();
  811. ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
  812. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  813. equal(input.val(), '2012-03-05');
  814. });
  815. test('DaysOfWeekDisabled', function(){
  816. var input = $('<input />')
  817. .appendTo('#qunit-fixture')
  818. .val('2012-10-26')
  819. .datepicker({
  820. format: 'yyyy-mm-dd',
  821. daysOfWeekDisabled: '1,5'
  822. }),
  823. dp = input.data('datepicker'),
  824. picker = dp.picker,
  825. target;
  826. input.focus();
  827. target = picker.find('.datepicker-days tbody td:nth(22)');
  828. ok(target.hasClass('disabled'), 'Day of week is disabled');
  829. target = picker.find('.datepicker-days tbody td:nth(24)');
  830. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  831. target = picker.find('.datepicker-days tbody td:nth(26)');
  832. ok(target.hasClass('disabled'), 'Day of week is disabled');
  833. });
  834. test('DaysOfWeekHighlighted', function(){
  835. var input = $('<input />')
  836. .appendTo('#qunit-fixture')
  837. .val('2012-10-26')
  838. .datepicker({
  839. format: 'yyyy-mm-dd',
  840. startDate: '2012-10-02',
  841. daysOfWeekHighlighted: '1,5'
  842. }),
  843. dp = input.data('datepicker'),
  844. picker = dp.picker,
  845. target;
  846. input.focus();
  847. target = picker.find('.datepicker-days tbody td:nth(0)');
  848. ok(!target.hasClass('highlighted'), 'Day of week is not highlighted');
  849. target = picker.find('.datepicker-days tbody td:nth(22)');
  850. ok(target.hasClass('highlighted'), 'Day of week is highlighted');
  851. target = picker.find('.datepicker-days tbody td:nth(24)');
  852. ok(!target.hasClass('highlighted'), 'Day of week is not highlighted');
  853. target = picker.find('.datepicker-days tbody td:nth(26)');
  854. ok(target.hasClass('highlighted'), 'Day of week is highlighted');
  855. });
  856. test('DatesDisabled', function(){
  857. var input = $('<input />')
  858. .appendTo('#qunit-fixture')
  859. .val('2012-10-26')
  860. .datepicker({
  861. format: 'yyyy-mm-dd',
  862. datesDisabled: ['2012-10-1', '2012-10-10', '2012-10-20']
  863. }),
  864. dp = input.data('datepicker'),
  865. picker = dp.picker,
  866. target;
  867. input.focus();
  868. target = picker.find('.datepicker-days tbody td:nth(1)');
  869. ok(target.hasClass('disabled'), 'Day of week is disabled');
  870. ok(target.hasClass('disabled-date'), 'Date is disabled');
  871. target = picker.find('.datepicker-days tbody td:nth(2)');
  872. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  873. target = picker.find('.datepicker-days tbody td:nth(10)');
  874. ok(target.hasClass('disabled'), 'Day of week is disabled');
  875. ok(target.hasClass('disabled-date'), 'Date is disabled');
  876. target = picker.find('.datepicker-days tbody td:nth(11)');
  877. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  878. target = picker.find('.datepicker-days tbody td:nth(20)');
  879. ok(target.hasClass('disabled'), 'Day of week is disabled');
  880. ok(target.hasClass('disabled-date'), 'Date is disabled');
  881. target = picker.find('.datepicker-days tbody td:nth(21)');
  882. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  883. });
  884. test('DatesDisabled as attribute', function(){
  885. var input = $('<input data-date-dates-disabled="2012-10-1,2012-10-10,2012-10-20" />')
  886. .appendTo('#qunit-fixture')
  887. .val('2012-10-26')
  888. .datepicker({
  889. format: 'yyyy-mm-dd'
  890. }),
  891. dp = input.data('datepicker'),
  892. picker = dp.picker,
  893. target;
  894. input.focus();
  895. target = picker.find('.datepicker-days tbody td:nth(1)');
  896. ok(target.hasClass('disabled'), 'Day of week is disabled');
  897. ok(target.hasClass('disabled-date'), 'Date is disabled');
  898. target = picker.find('.datepicker-days tbody td:nth(2)');
  899. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  900. target = picker.find('.datepicker-days tbody td:nth(10)');
  901. ok(target.hasClass('disabled'), 'Day of week is disabled');
  902. ok(target.hasClass('disabled-date'), 'Date is disabled');
  903. target = picker.find('.datepicker-days tbody td:nth(11)');
  904. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  905. target = picker.find('.datepicker-days tbody td:nth(20)');
  906. ok(target.hasClass('disabled'), 'Day of week is disabled');
  907. ok(target.hasClass('disabled-date'), 'Date is disabled');
  908. target = picker.find('.datepicker-days tbody td:nth(21)');
  909. ok(!target.hasClass('disabled'), 'Day of week is enabled');
  910. });
  911. test('BeforeShowDay', function(){
  912. var beforeShowDay = function(date) {
  913. switch (date.getDate()){
  914. case 25:
  915. return {
  916. tooltip: 'Example tooltip',
  917. classes: 'active'
  918. };
  919. case 26:
  920. return "test26";
  921. case 27:
  922. return {enabled: false, classes: 'test27'};
  923. case 28:
  924. return false;
  925. case 30:
  926. return { content: "foo" + date.getDate() }
  927. }
  928. };
  929. var input = $('<input />')
  930. .appendTo('#qunit-fixture')
  931. .val('2012-10-26')
  932. .datepicker({
  933. format: 'yyyy-mm-dd',
  934. beforeShowDay: beforeShowDay
  935. }),
  936. dp = input.data('datepicker'),
  937. picker = dp.picker,
  938. target;
  939. input.focus();
  940. target = picker.find('.datepicker-days tbody td:nth(25)');
  941. equal(target.attr('title'), 'Example tooltip', '25th has tooltip');
  942. ok(!target.hasClass('disabled'), '25th is enabled');
  943. target = picker.find('.datepicker-days tbody td:nth(26)');
  944. ok(target.hasClass('test26'), '26th has test26 class');
  945. ok(!target.hasClass('disabled'), '26th is enabled');
  946. target = picker.find('.datepicker-days tbody td:nth(27)');
  947. ok(target.hasClass('test27'), '27th has test27 class');
  948. ok(target.hasClass('disabled'), '27th is disabled');
  949. target = picker.find('.datepicker-days tbody td:nth(28)');
  950. ok(target.hasClass('disabled'), '28th is disabled');
  951. target = picker.find('.datepicker-days tbody td:nth(29)');
  952. ok(!target.hasClass('disabled'), '29th is enabled');
  953. target = picker.find('.datepicker-days tbody td:nth(30)');
  954. ok(target.text() == "foo30", '30th has custom content');
  955. });
  956. test('BeforeShowMonth regress .day content', function() {
  957. var input = $('<input />')
  958. .appendTo('#qunit-fixture')
  959. .val('2012-10-26')
  960. .datepicker({
  961. format: 'yyyy-mm-dd',
  962. beforeShowDay: function(date) {
  963. return {
  964. content: '<strong>foo123</strong>'
  965. };
  966. }
  967. }),
  968. dp = input.data('datepicker'),
  969. picker = dp.picker,
  970. target;
  971. input.focus();
  972. target = picker.find('.datepicker-days tbody td:nth(30)');
  973. target.trigger('click');
  974. datesEqual(dp.viewDate, UTCDate(2012, 9, 30));
  975. });
  976. test('BeforeShowMonth', function () {
  977. var beforeShowMonth = function (date) {
  978. switch (date.getMonth()) {
  979. case 0:
  980. return {
  981. tooltip: 'Example tooltip',
  982. classes: 'active'
  983. };
  984. case 2:
  985. return "testMarch";
  986. case 4:
  987. return {enabled: false, classes: 'testMay'};
  988. case 5:
  989. return false;
  990. }
  991. };
  992. var input = $('<input />')
  993. .appendTo('#qunit-fixture')
  994. .val('2012-10-26')
  995. .datepicker({
  996. format: 'yyyy-mm-dd',
  997. beforeShowMonth: beforeShowMonth
  998. }),
  999. dp = input.data('datepicker'),
  1000. picker = dp.picker,
  1001. target;
  1002. input.focus();
  1003. target = picker.find('.datepicker-months tbody span:nth(0)');
  1004. equal(target.attr('title'), 'Example tooltip', '1st has tooltip');
  1005. ok(!target.hasClass('disabled'), 'January is enabled');
  1006. target = picker.find('.datepicker-months tbody span:nth(2)');
  1007. ok(target.hasClass('testMarch'), 'March has testMarch class');
  1008. ok(!target.hasClass('disabled'), 'March enabled');
  1009. target = picker.find('.datepicker-months tbody span:nth(4)');
  1010. ok(target.hasClass('testMay'), 'May has testMay class');
  1011. ok(target.hasClass('disabled'), 'May is disabled');
  1012. target = picker.find('.datepicker-months tbody span:nth(5)');
  1013. ok(target.hasClass('disabled'), 'June is disabled');
  1014. target = picker.find('.datepicker-months tbody span:nth(6)');
  1015. ok(!target.hasClass('disabled'), 'July is enabled');
  1016. });
  1017. test('BeforeShowYear', function () {
  1018. var beforeShowYear = function (date) {
  1019. switch (date.getFullYear()) {
  1020. case 2013:
  1021. return {
  1022. tooltip: 'Example tooltip',
  1023. classes: 'active'
  1024. };
  1025. case 2014:
  1026. return "test2014";
  1027. case 2015:
  1028. return {enabled: false, classes: 'test2015'};
  1029. case 2016:
  1030. return false;
  1031. }
  1032. };
  1033. var input = $('<input />')
  1034. .appendTo('#qunit-fixture')
  1035. .val('2012-10-26')
  1036. .datepicker({
  1037. format: 'yyyy-mm-dd',
  1038. beforeShowYear: beforeShowYear
  1039. }),
  1040. dp = input.data('datepicker'),
  1041. picker = dp.picker,
  1042. target;
  1043. input.focus();
  1044. target = picker.find('.datepicker-years tbody span:nth(4)');
  1045. equal(target.attr('title'), 'Example tooltip', '5th has tooltip');
  1046. ok(!target.hasClass('disabled'), '2013, 5th is enabled');
  1047. target = picker.find('.datepicker-years tbody span:nth(5)');
  1048. ok(target.hasClass('test2014'), '6th has test2014 class');
  1049. ok(!target.hasClass('disabled'), '2014, 6th is enabled');
  1050. target = picker.find('.datepicker-years tbody span:nth(6)');
  1051. ok(target.hasClass('test2015'), '2015, 7th has test2015 class');
  1052. ok(target.hasClass('disabled'), '2015, 7th is disabled');
  1053. target = picker.find('.datepicker-years tbody span:nth(7)');
  1054. ok(target.hasClass('disabled'), '2016, 8th is disabled');
  1055. target = picker.find('.datepicker-years tbody span:nth(8)');
  1056. ok(!target.hasClass('disabled'), '2017, 9th is enabled');
  1057. });
  1058. test('beforeShowDecade', function () {
  1059. var beforeShowDecade = function (date) {
  1060. switch (date.getFullYear()) {
  1061. case 2030:
  1062. return {
  1063. tooltip: 'Example tooltip',
  1064. classes: 'active'
  1065. };
  1066. case 2040:
  1067. return "test2040";
  1068. case 2050:
  1069. return {enabled: false, classes: 'test2050'};
  1070. case 2060:
  1071. return false;
  1072. }
  1073. };
  1074. var input = $('<input />')
  1075. .appendTo('#qunit-fixture')
  1076. .val('03/05/2012')
  1077. .datepicker({ beforeShowDecade: beforeShowDecade }),
  1078. dp = input.data('datepicker'),
  1079. picker = dp.picker,
  1080. target;
  1081. input.focus();
  1082. target = picker.find('.datepicker-decades tbody span:nth(4)');
  1083. equal(target.attr('title'), 'Example tooltip', '5th has tooltip');
  1084. ok(!target.hasClass('disabled'), '2030, 5th is enabled');
  1085. target = picker.find('.datepicker-decades tbody span:nth(5)');
  1086. ok(target.hasClass('test2040'), '6th has test2040 class');
  1087. ok(!target.hasClass('disabled'), '2040, 6th is enabled');
  1088. target = picker.find('.datepicker-decades tbody span:nth(6)');
  1089. ok(target.hasClass('test2050'), '2050, 7th has test2050 class');
  1090. ok(target.hasClass('disabled'), '2050, 7th is disabled');
  1091. target = picker.find('.datepicker-decades tbody span:nth(7)');
  1092. ok(target.hasClass('disabled'), '2060, 8th is disabled');
  1093. target = picker.find('.datepicker-decades tbody span:nth(8)');
  1094. ok(!target.hasClass('disabled'), '2070, 9th is enabled');
  1095. });
  1096. test('beforeShowCentury', function () {
  1097. var beforeShowCentury = function (date) {
  1098. switch (date.getFullYear()) {
  1099. case 2300:
  1100. return {
  1101. tooltip: 'Example tooltip',
  1102. classes: 'active'
  1103. };
  1104. case 2400:
  1105. return "test2400";
  1106. case 2500:
  1107. return {enabled: false, classes: 'test2500'};
  1108. case 2600:
  1109. return false;
  1110. }
  1111. };
  1112. var input = $('<input />')
  1113. .appendTo('#qunit-fixture')
  1114. .val('03/05/2012')
  1115. .datepicker({ beforeShowCentury: beforeShowCentury }),
  1116. dp = input.data('datepicker'),
  1117. picker = dp.picker,
  1118. target;
  1119. input.focus();
  1120. target = picker.find('.datepicker-centuries tbody span:nth(4)');
  1121. equal(target.attr('title'), 'Example tooltip', '5th has tooltip');
  1122. ok(!target.hasClass('disabled'), '2300, 5th is enabled');
  1123. target = picker.find('.datepicker-centuries tbody span:nth(5)');
  1124. ok(target.hasClass('test2400'), '6th has test2400 class');
  1125. ok(!target.hasClass('disabled'), '2400, 6th is enabled');
  1126. target = picker.find('.datepicker-centuries tbody span:nth(6)');
  1127. ok(target.hasClass('test2500'), '2500, 7th has test2500 class');
  1128. ok(target.hasClass('disabled'), '2500, 7th is disabled');
  1129. target = picker.find('.datepicker-centuries tbody span:nth(7)');
  1130. ok(target.hasClass('disabled'), '2600, 8th is disabled');
  1131. target = picker.find('.datepicker-centuries tbody span:nth(8)');
  1132. ok(!target.hasClass('disabled'), '2700, 9th is enabled');
  1133. });
  1134. test('Orientation: values are parsed correctly', function(){
  1135. var input = $('<input />')
  1136. .appendTo('#qunit-fixture')
  1137. .val('2012-10-26')
  1138. .datepicker({
  1139. format: 'yyyy-mm-dd'
  1140. }),
  1141. dp = input.data('datepicker');
  1142. equal(dp.o.orientation.x, 'auto');
  1143. equal(dp.o.orientation.y, 'auto');
  1144. dp._process_options({orientation: ''});
  1145. equal(dp.o.orientation.x, 'auto', 'Empty value');
  1146. equal(dp.o.orientation.y, 'auto', 'Empty value');
  1147. dp._process_options({orientation: 'left'});
  1148. equal(dp.o.orientation.x, 'left', '"left"');
  1149. equal(dp.o.orientation.y, 'auto', '"left"');
  1150. dp._process_options({orientation: 'right'});
  1151. equal(dp.o.orientation.x, 'right', '"right"');
  1152. equal(dp.o.orientation.y, 'auto', '"right"');
  1153. dp._process_options({orientation: 'top'});
  1154. equal(dp.o.orientation.x, 'auto', '"top"');
  1155. equal(dp.o.orientation.y, 'top', '"top"');
  1156. dp._process_options({orientation: 'bottom'});
  1157. equal(dp.o.orientation.x, 'auto', '"bottom"');
  1158. equal(dp.o.orientation.y, 'bottom', '"bottom"');
  1159. dp._process_options({orientation: 'left top'});
  1160. equal(dp.o.orientation.x, 'left', '"left top"');
  1161. equal(dp.o.orientation.y, 'top', '"left top"');
  1162. dp._process_options({orientation: 'left bottom'});
  1163. equal(dp.o.orientation.x, 'left', '"left bottom"');
  1164. equal(dp.o.orientation.y, 'bottom', '"left bottom"');
  1165. dp._process_options({orientation: 'right top'});
  1166. equal(dp.o.orientation.x, 'right', '"right top"');
  1167. equal(dp.o.orientation.y, 'top', '"right top"');
  1168. dp._process_options({orientation: 'right bottom'});
  1169. equal(dp.o.orientation.x, 'right', '"right bottom"');
  1170. equal(dp.o.orientation.y, 'bottom', '"right bottom"');
  1171. dp._process_options({orientation: 'left right'});
  1172. equal(dp.o.orientation.x, 'left', '"left right"');
  1173. equal(dp.o.orientation.y, 'auto', '"left right"');
  1174. dp._process_options({orientation: 'right left'});
  1175. equal(dp.o.orientation.x, 'right', '"right left"');
  1176. equal(dp.o.orientation.y, 'auto', '"right left"');
  1177. dp._process_options({orientation: 'top bottom'});
  1178. equal(dp.o.orientation.x, 'auto', '"top bottom"');
  1179. equal(dp.o.orientation.y, 'top', '"top bottom"');
  1180. dp._process_options({orientation: 'bottom top'});
  1181. equal(dp.o.orientation.x, 'auto', '"bottom top"');
  1182. equal(dp.o.orientation.y, 'bottom', '"bottom top"');
  1183. dp._process_options({orientation: 'foo bar'});
  1184. equal(dp.o.orientation.x, 'auto', '"foo bar"');
  1185. equal(dp.o.orientation.y, 'auto', '"foo bar"');
  1186. dp._process_options({orientation: 'foo left'});
  1187. equal(dp.o.orientation.x, 'left', '"foo left"');
  1188. equal(dp.o.orientation.y, 'auto', '"foo left"');
  1189. dp._process_options({orientation: 'top bar'});
  1190. equal(dp.o.orientation.x, 'auto', '"top bar"');
  1191. equal(dp.o.orientation.y, 'top', '"top bar"');
  1192. });
  1193. test('startDate', function(){
  1194. var input = $('<input />')
  1195. .appendTo('#qunit-fixture')
  1196. .val('2012-10-26')
  1197. .datepicker({
  1198. format: 'yyyy-mm-dd',
  1199. startDate: new Date(2012, 9, 26)
  1200. }),
  1201. dp = input.data('datepicker'),
  1202. picker = dp.picker,
  1203. target;
  1204. input.focus();
  1205. target = picker.find('.datepicker-days tbody td:nth(25)');
  1206. ok(target.hasClass('disabled'), 'Previous day is disabled');
  1207. target = picker.find('.datepicker-days tbody td:nth(26)');
  1208. ok(!target.hasClass('disabled'), 'Specified date is enabled');
  1209. target = picker.find('.datepicker-days tbody td:nth(27)');
  1210. ok(!target.hasClass('disabled'), 'Next day is enabled');
  1211. });
  1212. test('endDate', function(){
  1213. var input = $('<input />')
  1214. .appendTo('#qunit-fixture')
  1215. .val('2012-10-26')
  1216. .datepicker({
  1217. format: 'yyyy-mm-dd',
  1218. endDate: new Date(2012, 9, 26)
  1219. }),
  1220. dp = input.data('datepicker'),
  1221. picker = dp.picker,
  1222. target;
  1223. input.focus();
  1224. target = picker.find('.datepicker-days tbody td:nth(25)');
  1225. ok(!target.hasClass('disabled'), 'Previous day is enabled');
  1226. target = picker.find('.datepicker-days tbody td:nth(26)');
  1227. ok(!target.hasClass('disabled'), 'Specified date is enabled');
  1228. target = picker.find('.datepicker-days tbody td:nth(27)');
  1229. ok(target.hasClass('disabled'), 'Next day is disabled');
  1230. });
  1231. test('Multidate', function(){
  1232. var input = $('<input />')
  1233. .appendTo('#qunit-fixture')
  1234. .val('2012-03-05')
  1235. .datepicker({
  1236. format: 'yyyy-mm-dd',
  1237. multidate: true
  1238. }),
  1239. dp = input.data('datepicker'),
  1240. picker = dp.picker,
  1241. target;
  1242. input.focus();
  1243. // Initial value is selected
  1244. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 (initial date) in dates');
  1245. // Select first
  1246. target = picker.find('.datepicker-days tbody td:nth(7)');
  1247. equal(target.text(), '4'); // Mar 4
  1248. target.click();
  1249. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
  1250. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  1251. equal(input.val(), '2012-03-05,2012-03-04');
  1252. // Select second
  1253. target = picker.find('.datepicker-days tbody td:nth(15)');
  1254. equal(target.text(), '12'); // Mar 12
  1255. target.click();
  1256. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 12), '2012-03-12 in dates');
  1257. datesEqual(dp.viewDate, UTCDate(2012, 2, 12));
  1258. equal(input.val(), '2012-03-05,2012-03-04,2012-03-12');
  1259. // Deselect first
  1260. target = picker.find('.datepicker-days tbody td:nth(7)');
  1261. equal(target.text(), '4'); // Mar 4
  1262. target.click();
  1263. ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
  1264. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  1265. equal(input.val(), '2012-03-05,2012-03-12');
  1266. });
  1267. test('Multidate with limit', function(){
  1268. var input = $('<input />')
  1269. .appendTo('#qunit-fixture')
  1270. .val('2012-03-05')
  1271. .datepicker({
  1272. format: 'yyyy-mm-dd',
  1273. multidate: 2
  1274. }),
  1275. dp = input.data('datepicker'),
  1276. picker = dp.picker,
  1277. target;
  1278. input.focus();
  1279. // Initial value is selected
  1280. ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 (initial date) in dates');
  1281. // Select first
  1282. target = picker.find('.datepicker-days tbody td:nth(7)');
  1283. equal(target.text(), '4'); // Mar 4
  1284. target.click();
  1285. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
  1286. datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
  1287. equal(input.val(), '2012-03-05,2012-03-04');
  1288. // Select second
  1289. target = picker.find('.datepicker-days tbody td:nth(15)');
  1290. equal(target.text(), '12'); // Mar 12
  1291. target.click();
  1292. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 12), '2012-03-12 in dates');
  1293. datesEqual(dp.viewDate, UTCDate(2012, 2, 12));
  1294. equal(input.val(), '2012-03-04,2012-03-12');
  1295. // Select third
  1296. target = picker.find('.datepicker-days tbody td:nth(20)');
  1297. equal(target.text(), '17'); // Mar 17
  1298. target.click();
  1299. datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 17), '2012-03-17 in dates');
  1300. ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
  1301. datesEqual(dp.viewDate, UTCDate(2012, 2, 17));
  1302. equal(input.val(), '2012-03-12,2012-03-17');
  1303. });
  1304. test('Multidate Separator', function(){
  1305. var input = $('<input />')
  1306. .appendTo('#qunit-fixture')
  1307. .val('2012-03-05')
  1308. .datepicker({
  1309. format: 'yyyy-mm-dd',
  1310. multidate: true,
  1311. multidateSeparator: ' '
  1312. }),
  1313. dp = input.data('datepicker'),
  1314. picker = dp.picker,
  1315. target;
  1316. input.focus();
  1317. // Select first
  1318. target = picker.find('.datepicker-days tbody td:nth(7)');
  1319. equal(target.text(), '4'); // Mar 4
  1320. target.click();
  1321. equal(input.val(), '2012-03-05 2012-03-04');
  1322. // Select second
  1323. target = picker.find('.datepicker-days tbody td:nth(15)');
  1324. equal(target.text(), '12'); // Mar 12
  1325. target.click();
  1326. equal(input.val(), '2012-03-05 2012-03-04 2012-03-12');
  1327. });
  1328. test("Picker is shown on input focus when showOnFocus is not defined", function () {
  1329. var input = $('<input />')
  1330. .appendTo('#qunit-fixture')
  1331. .val('2014-01-01')
  1332. .datepicker({
  1333. }),
  1334. dp = input.data('datepicker'),
  1335. picker = dp.picker;
  1336. input.focus();
  1337. ok(picker.is(":visible"), "Datepicker is visible");
  1338. });
  1339. test("Picker is shown on input focus when showOnFocus is true", function () {
  1340. var input = $('<input />')
  1341. .appendTo('#qunit-fixture')
  1342. .val('2014-01-01')
  1343. .datepicker({
  1344. showOnFocus: true
  1345. }),
  1346. dp = input.data('datepicker'),
  1347. picker = dp.picker;
  1348. input.focus();
  1349. ok(picker.is(":visible"), "Datepicker is visible");
  1350. });
  1351. test("Picker is hidden on input focus when showOnFocus is false", function () {
  1352. var input = $('<input />')
  1353. .appendTo('#qunit-fixture')
  1354. .val('2014-01-01')
  1355. .datepicker({
  1356. showOnFocus: false
  1357. }),
  1358. dp = input.data('datepicker'),
  1359. picker = dp.picker;
  1360. input.focus();
  1361. ok(picker.is(":hidden"), "Datepicker is hidden");
  1362. });
  1363. test('Container', function(){
  1364. var testContainer = $('<div class="date-picker-container"/>')
  1365. .appendTo('#qunit-fixture'),
  1366. input = $('<input />')
  1367. .appendTo('#qunit-fixture')
  1368. .val('2012-10-26')
  1369. .datepicker({
  1370. format: 'yyyy-mm-dd',
  1371. container: '.date-picker-container',
  1372. startDate: new Date(2012, 9, 26)
  1373. }),
  1374. dp = input.data('datepicker'),
  1375. target = dp.picker;
  1376. input.focus();
  1377. equal(target.parent()[0], testContainer[0], 'Container is not the testContainer that was specificed');
  1378. });
  1379. test('Default View Date (Object)', function(){
  1380. var input = $('<input />')
  1381. .appendTo('#qunit-fixture')
  1382. .datepicker({
  1383. format: 'yyyy-mm-dd',
  1384. defaultViewDate: { year: 1977, month: 04, day: 25 }
  1385. }),
  1386. dp = input.data('datepicker'),
  1387. picker = dp.picker,
  1388. target;
  1389. input.focus();
  1390. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'May 1977');
  1391. });
  1392. test('Default View Date (Date)', function(){
  1393. var input = $('<input />')
  1394. .appendTo('#qunit-fixture')
  1395. .datepicker({
  1396. format: 'yyyy-mm-dd',
  1397. defaultViewDate: new Date(1977, 4, 25)
  1398. }),
  1399. dp = input.data('datepicker'),
  1400. picker = dp.picker,
  1401. target;
  1402. input.focus();
  1403. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'May 1977');
  1404. });
  1405. test('Default View Date (String)', function(){
  1406. var input = $('<input />')
  1407. .appendTo('#qunit-fixture')
  1408. .datepicker({
  1409. format: 'yyyy-mm-dd',
  1410. defaultViewDate: "1977-05-24"
  1411. }),
  1412. dp = input.data('datepicker'),
  1413. picker = dp.picker,
  1414. target;
  1415. input.focus();
  1416. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'May 1977');
  1417. });
  1418. test('Immediate Updates', function(){
  1419. var input = $('<input />')
  1420. .appendTo('#qunit-fixture')
  1421. .val('2014-01-01')
  1422. .datepicker({
  1423. format: 'yyyy-mm-dd',
  1424. immediateUpdates: true
  1425. }),
  1426. dp = input.data('datepicker'),
  1427. picker = dp.picker;
  1428. // Change month
  1429. input.focus();
  1430. picker.find('.datepicker-days .next').click();
  1431. equal(input.val(), '2014-02-01');
  1432. // Change year
  1433. picker.find('.datepicker-days .datepicker-switch').click();
  1434. picker.find('.datepicker-months .next').click();
  1435. equal(input.val(), '2015-02-01');
  1436. // Change decade set (doesn't update input)
  1437. picker.find('.datepicker-months .datepicker-switch').click();
  1438. picker.find('.datepicker-years .next').click();
  1439. equal(input.val(), '2015-02-01');
  1440. // Change century set (doesn't update input)
  1441. picker.find('.datepicker-years .datepicker-switch').click();
  1442. picker.find('.datepicker-decades .next').click();
  1443. equal(input.val(), '2015-02-01');
  1444. // Change millennium set (doesn't update input)
  1445. picker.find('.datepicker-decades .datepicker-switch').click();
  1446. picker.find('.datepicker-centuries .next').click();
  1447. equal(input.val(), '2015-02-01');
  1448. });
  1449. test('forceParse: false on enter on invalid date', function () {
  1450. var input = $('<input />')
  1451. .appendTo('#qunit-fixture')
  1452. .val('123456789')
  1453. .datepicker({forceParse: false})
  1454. .focus();
  1455. input.trigger({
  1456. type: 'keydown',
  1457. keyCode: 13,
  1458. shiftKey: false
  1459. });
  1460. equal(input.val(), '123456789', 'date not parsed');
  1461. });
  1462. test('forceParse: false on mousedown on invalid date', function () {
  1463. var input = $('<input />')
  1464. .appendTo('#qunit-fixture')
  1465. .val('123456789')
  1466. .datepicker({forceParse: false})
  1467. .focus();
  1468. $(document).trigger({
  1469. type: 'mousedown'
  1470. });
  1471. equal(input.val(), '123456789', 'date not parsed');
  1472. });
  1473. //datepicker-dropdown
  1474. test('Enable on readonly options (default)', function(){
  1475. var input = $('<input readonly="readonly" />')
  1476. .appendTo('#qunit-fixture')
  1477. .datepicker({format: "dd-mm-yyyy"}),
  1478. dp = input.data('datepicker'),
  1479. picker = dp.picker;
  1480. ok(!picker.is(':visible'));
  1481. input.focus();
  1482. ok(picker.is(':visible'));
  1483. });
  1484. test('Enable on readonly options (false)', function(){
  1485. var input = $('<input readonly="readonly" />')
  1486. .appendTo('#qunit-fixture')
  1487. .datepicker({
  1488. format: "dd-mm-yyyy",
  1489. enableOnReadonly: false
  1490. }),
  1491. dp = input.data('datepicker'),
  1492. picker = dp.picker;
  1493. ok(!picker.is(':visible'));
  1494. input.focus();
  1495. ok(!picker.is(':visible'));
  1496. });
  1497. test('Startview: year view visible after date pick', function(){
  1498. var input = $('<input />')
  1499. .appendTo('#qunit-fixture')
  1500. .datepicker({
  1501. startView: 2,
  1502. minViewMode: 1,
  1503. autoclose: true
  1504. }),
  1505. dp = input.data('datepicker'),
  1506. picker = dp.picker,
  1507. target;
  1508. input.focus();
  1509. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  1510. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  1511. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  1512. target = picker.find('.datepicker-years tbody td:nth(7)');
  1513. target.click();
  1514. target = picker.find('.datepicker-years tbody td:nth(4)');
  1515. target.click();
  1516. target = picker.find('.datepicker-years tbody td:nth(20)');
  1517. target.click();
  1518. input.focus();
  1519. ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
  1520. ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
  1521. ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
  1522. });
  1523. test('Title: none', function(){
  1524. var input = $('<input />')
  1525. .appendTo('#qunit-fixture')
  1526. .datepicker({
  1527. format: 'yyyy-mm-dd'
  1528. }),
  1529. dp = input.data('datepicker'),
  1530. picker = dp.picker,
  1531. target;
  1532. input.focus();
  1533. ok(picker.is(':visible'), 'Picker is visible');
  1534. target = picker.find('.datepicker-days thead .datepicker-title');
  1535. ok(target.is(':not(:visible)'), 'Title is hidden');
  1536. });
  1537. test('Title: with value', function(){
  1538. var input = $('<input />')
  1539. .appendTo('#qunit-fixture')
  1540. .datepicker({
  1541. format: 'yyyy-mm-dd',
  1542. title: 'Some Title'
  1543. }),
  1544. dp = input.data('datepicker'),
  1545. picker = dp.picker,
  1546. target;
  1547. input.focus();
  1548. ok(picker.is(':visible'), 'Picker is visible');
  1549. target = picker.find('.datepicker-days thead .datepicker-title');
  1550. ok(target.is(':visible'), 'Title is visible');
  1551. equal(target.text(), 'Some Title');
  1552. });
  1553. test('i18n: Leverage i18n titleFormat when available.', patch_date(function(Date){
  1554. var input = $('<input />')
  1555. .appendTo('#qunit-fixture')
  1556. .val('2015年04月21日')
  1557. .datepicker({
  1558. language: 'zh-CN'
  1559. }),
  1560. dp = input.data('datepicker'),
  1561. picker = dp.picker;
  1562. input.focus();
  1563. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), '2015年04月', 'Title is in Chinese: 2015年04月');
  1564. }));
  1565. test('i18n: Leverage English (default) i18n titleFormat when translation key for specified language is not available.', patch_date(function(Date){
  1566. var input = $('<input />')
  1567. .appendTo('#qunit-fixture')
  1568. .val('04/21/2015')
  1569. .datepicker({
  1570. language: 'aa-BB'
  1571. }),
  1572. dp = input.data('datepicker'),
  1573. picker = dp.picker;
  1574. input.focus();
  1575. equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'April 2015', 'Title is in default format: April 2015');
  1576. }));
  1577. test('Z-index Offset: none', function(){
  1578. var input = $('<input />')
  1579. .appendTo('#qunit-fixture')
  1580. .datepicker(),
  1581. dp = input.data('datepicker'),
  1582. picker = dp.picker;
  1583. input.parent().css('z-index', 234);
  1584. input.focus();
  1585. equal(dp.o.zIndexOffset, 10, 'Z-index offset option defaults to 10.');
  1586. equal(picker.css('z-index'), 244, 'Picker Z-index offset is respected.');
  1587. });
  1588. test('Z-index Offset: with value', function(){
  1589. var input = $('<input />')
  1590. .appendTo('#qunit-fixture')
  1591. .datepicker({
  1592. zIndexOffset: 1000
  1593. }),
  1594. dp = input.data('datepicker'),
  1595. picker = dp.picker;
  1596. input.parent().css('z-index', 234);
  1597. input.focus();
  1598. equal(dp.o.zIndexOffset, 1000, 'Z-index offset option is accepted.');
  1599. equal(picker.css('z-index'), 1234, 'Picker Z-index offset is respected.');
  1600. });
  1601. test('templates', function(){
  1602. var input = $('<input />')
  1603. .appendTo('#qunit-fixture')
  1604. .datepicker({
  1605. templates: {
  1606. leftArrow: '<span class="glyphicon glyphicon-arrow-left"></span>',
  1607. rightArrow: '</table>'
  1608. }
  1609. }),
  1610. dp = input.data('datepicker'),
  1611. picker = dp.picker;
  1612. input.focus();
  1613. equal(picker.find('.datepicker-days .prev').prop('innerHTML'), '<span class="glyphicon glyphicon-arrow-left"></span>');
  1614. equal(picker.find('.datepicker-days .next').prop('innerHTML'), $('<div>').html('&raquo;').text());
  1615. });
  1616. test('Nav arrow html templates with span tag', function () {
  1617. var input = $('<input />')
  1618. .appendTo('#qunit-fixture')
  1619. .val('2012-10-26')
  1620. .datepicker({
  1621. format: 'yyyy-mm-dd',
  1622. templates: {
  1623. leftArrow: '<span></span>',
  1624. rightArrow: '<span></span>'
  1625. }
  1626. }),
  1627. dp = input.data('datepicker'),
  1628. picker = dp.picker,
  1629. target;
  1630. input.focus();
  1631. target = picker.find('.datepicker-months tbody span:nth(9)');
  1632. ok(target.hasClass('active'), 'Month is selected');
  1633. });
  1634. test('Nav arrow html templates .prev click', function () {
  1635. var input = $('<input />')
  1636. .appendTo('#qunit-fixture')
  1637. .val('2012-10-26')
  1638. .datepicker({
  1639. format: 'yyyy-mm-dd',
  1640. startView: 1,
  1641. templates: {
  1642. leftArrow: '<i></i>'
  1643. }
  1644. }),
  1645. dp = input.data('datepicker'),
  1646. picker = dp.picker,
  1647. target;
  1648. input.focus();
  1649. picker.find('.datepicker-months thead .prev i').trigger('click');
  1650. target = picker.find('.datepicker-months thead .datepicker-switch');
  1651. equal(target.text(), '2011');
  1652. });
  1653. test('Visibility of the prev and next arrows for year/decade/century/millennium views with startDate and endDate', function(){
  1654. var input = $('<input />')
  1655. .appendTo('#qunit-fixture')
  1656. .val('01/01/2015')
  1657. .datepicker({
  1658. format: 'dd/mm/yyyy',
  1659. startView: 1,
  1660. startDate: '01/12/2014',
  1661. endDate: '01/12/2016'
  1662. }),
  1663. dp = input.data('datepicker'),
  1664. picker = dp.picker,
  1665. target;
  1666. input.focus();
  1667. target = picker.find('.datepicker-months thead th.prev');
  1668. ok(!target.hasClass('disabled'), 'Prev switcher is not hidden');
  1669. target = picker.find('.datepicker-months thead th.next');
  1670. ok(!target.hasClass('disabled'), 'Next switcher is not hidden');
  1671. picker.find('.datepicker-months thead th.datepicker-switch').trigger('click');
  1672. target = picker.find('.datepicker-years thead th.prev');
  1673. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1674. target = picker.find('.datepicker-years thead th.next');
  1675. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1676. picker.find('.datepicker-years thead th.datepicker-switch').trigger('click');
  1677. target = picker.find('.datepicker-decades thead th.prev');
  1678. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1679. target = picker.find('.datepicker-decades thead th.next');
  1680. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1681. picker.find('.datepicker-decades thead th.datepicker-switch').trigger('click');
  1682. target = picker.find('.datepicker-centuries thead th.prev');
  1683. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1684. target = picker.find('.datepicker-centuries thead th.next');
  1685. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1686. });
  1687. test('Visibility of the prev arrow for month/year/decade/century/millennium views with startDate eq value', function(){
  1688. var input = $('<input />')
  1689. .appendTo('#qunit-fixture')
  1690. .val('01/01/2014')
  1691. .datepicker({
  1692. format: 'dd/mm/yyyy',
  1693. startView: 0,
  1694. startDate: '01/01/2014'
  1695. }),
  1696. dp = input.data('datepicker'),
  1697. picker = dp.picker,
  1698. target;
  1699. input.focus();
  1700. target = picker.find('.datepicker-days thead th.prev');
  1701. ok(target.hasClass('disabled'), 'Prev switcher is not hidden');
  1702. picker.find('.datepicker-days thead th.datepicker-switch').trigger('click');
  1703. target = picker.find('.datepicker-months thead th.prev');
  1704. ok(target.hasClass('disabled'), 'Prev switcher is not hidden');
  1705. picker.find('.datepicker-months thead th.datepicker-switch').trigger('click');
  1706. target = picker.find('.datepicker-years thead th.prev');
  1707. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1708. picker.find('.datepicker-years thead th.datepicker-switch').trigger('click');
  1709. target = picker.find('.datepicker-decades thead th.prev');
  1710. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1711. picker.find('.datepicker-decades thead th.datepicker-switch').trigger('click');
  1712. target = picker.find('.datepicker-centuries thead th.prev');
  1713. ok(target.hasClass('disabled'), 'Prev switcher is hidden');
  1714. });
  1715. test('Visibility of the next arrow for month/year/decade/century/millennium views with endDate eq value', function(){
  1716. var input = $('<input />')
  1717. .appendTo('#qunit-fixture')
  1718. .val('31/12/1999')
  1719. .datepicker({
  1720. format: 'dd/mm/yyyy',
  1721. startView: 0,
  1722. endDate: '31/12/1999'
  1723. }),
  1724. dp = input.data('datepicker'),
  1725. picker = dp.picker,
  1726. target;
  1727. input.focus();
  1728. target = picker.find('.datepicker-days thead th.next');
  1729. ok(target.hasClass('disabled'), 'Next switcher is not hidden');
  1730. picker.find('.datepicker-days thead th.datepicker-switch').trigger('click');
  1731. target = picker.find('.datepicker-months thead th.next');
  1732. ok(target.hasClass('disabled'), 'Next switcher is not hidden');
  1733. picker.find('.datepicker-months thead th.datepicker-switch').trigger('click');
  1734. target = picker.find('.datepicker-years thead th.next');
  1735. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1736. picker.find('.datepicker-years thead th.datepicker-switch').trigger('click');
  1737. target = picker.find('.datepicker-decades thead th.next');
  1738. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1739. picker.find('.datepicker-decades thead th.datepicker-switch').trigger('click');
  1740. target = picker.find('.datepicker-centuries thead th.next');
  1741. ok(target.hasClass('disabled'), 'Next switcher is hidden');
  1742. });
  1743. test('date cells (outdated)', function(){
  1744. var input = $('<input />')
  1745. .appendTo('#qunit-fixture')
  1746. .datepicker(),
  1747. dp = input.data('datepicker'),
  1748. picker = dp.picker;
  1749. input.focus();
  1750. picker.find('.datepicker-days .day').each(function(){
  1751. ok(this.hasAttribute('data-date'));
  1752. });
  1753. });
  1754. test('keepEmptyValues: none (default is false)', function() {
  1755. var proxy_element = $('<div />').appendTo('#qunit-fixture'),
  1756. input_from = $('<input />').val('2016-04-01').appendTo('#qunit-fixture'),
  1757. input_to = $('<input />').appendTo('#qunit-fixture'),
  1758. dp = proxy_element.datepicker({
  1759. format: 'yyyy-mm-dd',
  1760. inputs: [input_from, input_to]
  1761. }),
  1762. input_from_dp = input_from.data('datepicker');
  1763. input_from.focus();
  1764. input_from_dp.picker.find('.old.day').eq(0).click();
  1765. equal(input_from.val(), '2016-03-27');
  1766. equal(input_to.val(), '2016-03-27', 'Input_from value should be distributed.');
  1767. });
  1768. test('keepEmptyValues: true', function() {
  1769. var proxy_element = $('<div />').appendTo('#qunit-fixture'),
  1770. input_from = $('<input />').val('2016-04-01').appendTo('#qunit-fixture'),
  1771. input_to = $('<input />').appendTo('#qunit-fixture'),
  1772. dp = proxy_element.datepicker({
  1773. format: 'yyyy-mm-dd',
  1774. inputs: [input_from, input_to],
  1775. keepEmptyValues: true
  1776. }),
  1777. input_from_dp = input_from.data('datepicker');
  1778. input_from.focus();
  1779. input_from_dp.picker.find('.old.day').eq(0).click();
  1780. equal(input_from.val(), '2016-03-27');
  1781. equal(input_to.val(), '', 'Input_from value should not be distributed.');
  1782. });
  1783. test('maxViewMode and navigation switch', function(){
  1784. var input = $('<input />')
  1785. .appendTo('#qunit-fixture')
  1786. .datepicker({
  1787. maxViewMode: 0
  1788. }),
  1789. dp = input.data('datepicker'),
  1790. picker = dp.picker;
  1791. input.focus();
  1792. picker.find('.datepicker-days thead th.datepicker-switch').click();
  1793. ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
  1794. });
  1795. test('updateViewDate', function() {
  1796. expect(8);
  1797. var input = $('<input value="08/03/1990"/>')
  1798. .appendTo('#qunit-fixture')
  1799. .datepicker({
  1800. defaultViewDate: {
  1801. year: 1945,
  1802. month: 4,
  1803. day: 8
  1804. },
  1805. updateViewDate: false
  1806. })
  1807. .on('changeMonth', function() {
  1808. var msg = shouldTriggerChangeMonth ? 'changeMonth must be triggered' : 'changeMonth must not be triggered';
  1809. ok(shouldTriggerChangeMonth, msg);
  1810. })
  1811. .on('changeYear', function() {
  1812. var msg = shouldTriggerChangeYear ? 'changeYear must be triggered' : 'changeYear must not be triggered';
  1813. ok(shouldTriggerChangeYear, msg);
  1814. }),
  1815. dp = input.data('datepicker'),
  1816. picker = dp.picker,
  1817. shouldTriggerChangeMonth = false,
  1818. shouldTriggerChangeYear = false,
  1819. monthShown = picker.find('.datepicker-days thead th.datepicker-switch');
  1820. equal(monthShown.text(), "May 1945", 'uses defaultViewDate on initialization');
  1821. input.datepicker('setDate', new Date(1945, 8, 2));
  1822. equal(monthShown.text(), "May 1945", 'does not change viewDate on `setDate` method');
  1823. input.focus();
  1824. picker.find('.datepicker-days tbody tr td.day.new:first').click();
  1825. equal(monthShown.text(), "May 1945", 'does not change viewDate if a day in next month is selected');
  1826. shouldTriggerChangeMonth = true;
  1827. picker.find('.datepicker-days thead th.next').click();
  1828. equal(monthShown.text(), 'June 1945', 'changing month must still be possible'); // and must trigger `changeMonth` event
  1829. shouldTriggerChangeYear = true;
  1830. picker.find('.datepicker-days thead th.datepicker-switch').click();
  1831. picker.find('.datepicker-months thead th.next').click();
  1832. picker.find('.datepicker-months tbody .month:first').click();
  1833. equal(monthShown.text(), 'January 1946', 'changing year must still be possible'); // and must trigger `changeYear` and `changeMonth` events
  1834. });
  1835. test('Week Days: Week days default visibility (or enabled)', function(){
  1836. var input = $('<input />')
  1837. .appendTo('#qunit-fixture')
  1838. .val('2012-03-05')
  1839. .datepicker({
  1840. format: 'yyyy-mm-dd'
  1841. }),
  1842. dp = input.data('datepicker'),
  1843. picker = dp.picker,
  1844. target;
  1845. input.focus();
  1846. ok(picker.find('.dow').length > 0, 'Week days added to view');
  1847. });
  1848. test('Week Days: Week days visibility when disabled', function(){
  1849. var input = $('<input />')
  1850. .appendTo('#qunit-fixture')
  1851. .val('2012-03-05')
  1852. .datepicker({
  1853. format: 'yyyy-mm-dd',
  1854. showWeekDays: false
  1855. }),
  1856. dp = input.data('datepicker'),
  1857. picker = dp.picker,
  1858. target;
  1859. input.focus();
  1860. ok(picker.find('.dow').length === 0, 'Week days not added to view');
  1861. });