Gulp and bower++, could break stuff
This commit is contained in:
nikolark committed
1 parent
3727f1c14a
commit
8d30585cdb
504 files changed
+93722
-9819
No files matched your search
+48
@@ -0,0 +1,48 @@
|
||||
module('Calendar Weeks', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2013-01-14')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
calendarWeeks: true
|
||||
})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('adds cw header column', function(){
|
||||
var target = this.picker.find('.datepicker-days thead th:first-child');
|
||||
ok(target.hasClass('cw'), 'First column heading is from cw column');
|
||||
});
|
||||
|
||||
test('adds calendar week cells to each day row', function(){
|
||||
var target = this.picker.find('.datepicker-days tbody tr');
|
||||
|
||||
expect(target.length);
|
||||
target.each(function(i){
|
||||
var t = $(this).children().first();
|
||||
ok(t.hasClass('cw'), "First column is cw column");
|
||||
});
|
||||
});
|
||||
|
||||
test('displays correct calendar week', function(){
|
||||
var target = this.picker.find('.datepicker-days tbody tr');
|
||||
|
||||
expect(target.length);
|
||||
target.each(function(i){
|
||||
var t = $(this).children().first();
|
||||
equal(t.text(), i+1, "Displays correct calendar weeks");
|
||||
});
|
||||
});
|
||||
|
||||
test('it prepends column to switcher thead row', function(){
|
||||
var target = this.picker.find('.datepicker-days thead tr:first-child');
|
||||
equal(target.children().length, 4, 'first row has 4 columns');
|
||||
ok(target.children().first().hasClass('cw'), 'cw column is prepended');
|
||||
});
|
||||
@@ -0,0 +1,202 @@
|
||||
module('Component', {
|
||||
setup: function(){
|
||||
this.component = $('<div class="input-append date" id="datepicker">'+
|
||||
'<input size="16" type="text" value="12-02-2012" readonly>'+
|
||||
'<span class="add-on"><i class="icon-th"></i></span>'+
|
||||
'</div>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"});
|
||||
this.input = this.component.find('input');
|
||||
this.addon = this.component.find('.add-on');
|
||||
this.dp = this.component.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
test('Component gets date/viewDate from input value', function(){
|
||||
datesEqual(this.dp.getUTCDate(), UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 12));
|
||||
});
|
||||
|
||||
test('Activation by component', function(){
|
||||
ok(!this.picker.is(':visible'));
|
||||
this.addon.click();
|
||||
ok(this.picker.is(':visible'));
|
||||
});
|
||||
|
||||
test('simple keyboard nav test', function(){
|
||||
var target;
|
||||
|
||||
// Keyboard nav only works with non-readonly inputs
|
||||
this.input.removeAttr('readonly');
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
datesEqual(this.dp.getUTCDate(), UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 12));
|
||||
|
||||
// Focus/open
|
||||
this.addon.click();
|
||||
|
||||
// Navigation: -1 day, left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 11));
|
||||
datesEqual(this.dp.getUTCDate(), UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 1, 11));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
|
||||
// Navigation: +1 month, shift + right arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 11));
|
||||
datesEqual(this.dp.getUTCDate(), UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 2, 11));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 year, ctrl + left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
ctrlKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 11));
|
||||
datesEqual(this.dp.getUTCDate(), UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 2, 11));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
});
|
||||
|
||||
test('setValue', function(){
|
||||
this.dp.dates.replace(UTCDate(2012, 2, 13));
|
||||
this.dp.setValue();
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 13));
|
||||
equal(this.input.val(), '13-03-2012');
|
||||
});
|
||||
|
||||
test('update', function(){
|
||||
this.input.val('13-03-2012');
|
||||
this.dp.update();
|
||||
equal(this.dp.dates.length, 1);
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 13));
|
||||
});
|
||||
|
||||
test('Navigating to/from decade view', function(){
|
||||
var target;
|
||||
|
||||
this.addon.click();
|
||||
this.input.val('31-03-2012');
|
||||
this.dp.update();
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-years').is(':visible'), 'Year picker is visible');
|
||||
equal(this.dp.viewMode, 2);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 31));
|
||||
|
||||
// Change years to test internal state changes
|
||||
target = this.picker.find('.datepicker-years tbody span:contains(2011)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months tbody span:contains(Apr)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 0);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
test('Selecting date resets viewDate and date', function(){
|
||||
var target;
|
||||
|
||||
this.addon.click();
|
||||
this.input.val('31-03-2012');
|
||||
this.dp.update();
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '26'); // Should be Feb 26
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 26))
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 1, 26))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '29'); // Should be Jan 29
|
||||
});
|
||||
|
||||
test('"remove" removes associated HTML', function(){
|
||||
var datepickerDivSelector = '.datepicker';
|
||||
|
||||
$('#datepicker').datepicker('show');
|
||||
|
||||
//there should be one datepicker initiated so that means one hidden .datepicker div
|
||||
equal($(datepickerDivSelector).length, 1);
|
||||
this.component.datepicker('remove');
|
||||
equal($(datepickerDivSelector).length, 0);//hidden HTML should be gone
|
||||
});
|
||||
|
||||
test('Does not block events', function(){
|
||||
var clicks = 0;
|
||||
function handler(){
|
||||
clicks++;
|
||||
}
|
||||
$('#qunit-fixture').on('click', '.add-on', handler);
|
||||
this.addon.click();
|
||||
equal(clicks, 1);
|
||||
$('#qunit-fixture').off('click', '.add-on', handler);
|
||||
});
|
||||
|
||||
|
||||
test('date and viewDate must be between startDate and endDate when setStartDate called', function() {
|
||||
this.dp.setDate(new Date(2013, 1, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2013, 1, 1));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 1, 1));
|
||||
this.dp.setStartDate(new Date(2013, 5, 6));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 5, 6));
|
||||
equal(this.dp.dates.length, 0);
|
||||
});
|
||||
|
||||
test('date and viewDate must be between startDate and endDate when setEndDate called', function() {
|
||||
this.dp.setDate(new Date(2013, 11, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2013, 11, 1));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 11, 1));
|
||||
this.dp.setEndDate(new Date(2013, 5, 6));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 5, 6));
|
||||
equal(this.dp.dates.length, 0);
|
||||
});
|
||||
@@ -0,0 +1,114 @@
|
||||
module('DATA-API');
|
||||
|
||||
test('DATA-API: data-provide="datepicker" on input; focus', function(){
|
||||
var input = $('<input data-provide="datepicker" />')
|
||||
.appendTo('#qunit-fixture');
|
||||
input.focus();
|
||||
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
|
||||
});
|
||||
|
||||
test('DATA-API: data-provide="datepicker" on input; click', function(){
|
||||
var input = $('<input data-provide="datepicker" />')
|
||||
.appendTo('#qunit-fixture');
|
||||
input.click();
|
||||
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
|
||||
});
|
||||
|
||||
test('DATA-API: data-provide="datepicker" on component', function(){
|
||||
var html, comp;
|
||||
|
||||
html = '<div class="input-append date" data-provide="datepicker">'+
|
||||
'<input><span class="add-on"><i class="icon-th"></i></span>'+
|
||||
'</div>';
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input').focus();
|
||||
ok(comp.data('datepicker'), 'append component initialized by "focus" event on input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input').click();
|
||||
ok(comp.data('datepicker'), 'append component initialized by "click" event on input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('.add-on').focus();
|
||||
ok(comp.data('datepicker'), 'append component initialized by "focus" event on add-on');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('.add-on').click();
|
||||
ok(comp.data('datepicker'), 'append component initialized by "click" event on add-on');
|
||||
comp.remove();
|
||||
|
||||
|
||||
html = '<div class="input-prepend date" data-provide="datepicker">'+
|
||||
'<span class="add-on"><i class="icon-th"></i></span><input>'+
|
||||
'</div>';
|
||||
|
||||
comp = $(html).prependTo('#qunit-fixture');
|
||||
comp.find('input').focus();
|
||||
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).prependTo('#qunit-fixture');
|
||||
comp.find('input').click();
|
||||
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).prependTo('#qunit-fixture');
|
||||
comp.find('.add-on').focus();
|
||||
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on add-on');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).prependTo('#qunit-fixture');
|
||||
comp.find('.add-on').click();
|
||||
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on add-on');
|
||||
comp.remove();
|
||||
});
|
||||
|
||||
test('DATA-API: data-provide="datepicker" on button', function(){
|
||||
var html, comp;
|
||||
|
||||
html = '<button data-provide="datepicker">';
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.focus();
|
||||
ok(comp.data('datepicker'), 'button initialized by "focus" event on input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.click();
|
||||
ok(comp.data('datepicker'), 'button initialized by "click" event on input');
|
||||
comp.remove();
|
||||
});
|
||||
|
||||
test('DATA-API: data-provide="datepicker" on rangepicker', function(){
|
||||
var html, comp;
|
||||
|
||||
html = '<div class="input-daterange" data-provide="datepicker">'+
|
||||
'<input class="datepicker">'+
|
||||
'<span class="add-on">to</span>'+
|
||||
'<input class="datepicker">'+
|
||||
'</div>';
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input:first').focus();
|
||||
ok(comp.data('datepicker'), 'range initialized by "focus" event on first input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input:first').click();
|
||||
ok(comp.data('datepicker'), 'range initialized by "click" event on first input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input:last').focus();
|
||||
ok(comp.data('datepicker'), 'range initialized by "focus" event on last input');
|
||||
comp.remove();
|
||||
|
||||
comp = $(html).appendTo('#qunit-fixture');
|
||||
comp.find('input:last').click();
|
||||
ok(comp.data('datepicker'), 'range initialized by "click" event on last input');
|
||||
comp.remove();
|
||||
});
|
||||
@@ -0,0 +1,306 @@
|
||||
module('Events', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('Selecting a year from decade view triggers changeYear', function(){
|
||||
var target,
|
||||
triggered = 0;
|
||||
|
||||
this.input.on('changeYear', function(){
|
||||
triggered++;
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-years').is(':visible'), 'Year picker is visible');
|
||||
equal(this.dp.viewMode, 2);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 31));
|
||||
|
||||
// Change years to test internal state changes
|
||||
target = this.picker.find('.datepicker-years tbody span:contains(2010)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2010, 2, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 31));
|
||||
equal(triggered, 1);
|
||||
});
|
||||
|
||||
test('Navigating forward/backward from month view triggers changeYear', function(){
|
||||
var target,
|
||||
triggered = 0;
|
||||
|
||||
this.input.on('changeYear', function(){
|
||||
triggered++;
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.prev');
|
||||
ok(target.is(':visible'), 'Prev switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(triggered, 1);
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.next');
|
||||
ok(target.is(':visible'), 'Next switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(triggered, 2);
|
||||
});
|
||||
|
||||
test('Selecting a month from year view triggers changeMonth', function(){
|
||||
var target,
|
||||
triggered = 0;
|
||||
|
||||
this.input.on('changeMonth', function(){
|
||||
triggered++;
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months tbody span:contains(Apr)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 0);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 31));
|
||||
equal(triggered, 1);
|
||||
});
|
||||
|
||||
test('Navigating forward/backward from month view triggers changeMonth', function(){
|
||||
var target,
|
||||
triggered = 0;
|
||||
|
||||
this.input.on('changeMonth', function(){
|
||||
triggered++;
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.prev');
|
||||
ok(target.is(':visible'), 'Prev switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-days').is(':visible'), 'Day picker is visible');
|
||||
equal(triggered, 1);
|
||||
|
||||
target = this.picker.find('.datepicker-days thead th.next');
|
||||
ok(target.is(':visible'), 'Next switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-days').is(':visible'), 'Day picker is visible');
|
||||
equal(triggered, 2);
|
||||
});
|
||||
|
||||
test('format() returns a formatted date string', function(){
|
||||
var target,
|
||||
error, out;
|
||||
|
||||
this.input.on('changeDate', function(e){
|
||||
try{
|
||||
out = e.format();
|
||||
}
|
||||
catch(e){
|
||||
error = e;
|
||||
}
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(15)');
|
||||
target.click();
|
||||
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 14));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 14));
|
||||
equal(error, undefined)
|
||||
equal(out, '14-03-2011');
|
||||
});
|
||||
|
||||
test('format(altformat) returns a formatted date string', function(){
|
||||
var target,
|
||||
error, out;
|
||||
|
||||
this.input.on('changeDate', function(e){
|
||||
try{
|
||||
out = e.format('m/d/yy');
|
||||
}
|
||||
catch(e){
|
||||
error = e;
|
||||
}
|
||||
});
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(15)');
|
||||
target.click();
|
||||
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 14));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2011, 2, 14));
|
||||
equal(error, undefined)
|
||||
equal(out, '3/14/11');
|
||||
});
|
||||
|
||||
test('format(ix) returns a formatted date string of the ix\'th date selected', function(){
|
||||
var target,
|
||||
error, out;
|
||||
|
||||
this.dp._process_options({multidate: true});
|
||||
|
||||
this.input.on('changeDate', function(e){
|
||||
try{
|
||||
out = e.format(2);
|
||||
}
|
||||
catch(e){
|
||||
error = e;
|
||||
}
|
||||
});
|
||||
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '6'); // Mar 6
|
||||
target.click();
|
||||
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(15)');
|
||||
equal(target.text(), '14'); // Mar 16
|
||||
target.click();
|
||||
|
||||
equal(this.dp.dates.length, 3);
|
||||
|
||||
equal(error, undefined);
|
||||
equal(out, '14-03-2011');
|
||||
});
|
||||
|
||||
test('format(ix, altformat) returns a formatted date string', function(){
|
||||
var target,
|
||||
error, out;
|
||||
|
||||
this.dp._process_options({multidate: true});
|
||||
|
||||
this.input.on('changeDate', function(e){
|
||||
try{
|
||||
out = e.format(2, 'm/d/yy');
|
||||
}
|
||||
catch(e){
|
||||
error = e;
|
||||
}
|
||||
});
|
||||
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '6'); // Mar 6
|
||||
target.click();
|
||||
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(15)');
|
||||
equal(target.text(), '14'); // Mar 16
|
||||
target.click();
|
||||
|
||||
equal(this.dp.dates.length, 3);
|
||||
|
||||
equal(error, undefined);
|
||||
equal(out, '3/14/11');
|
||||
});
|
||||
|
||||
test('Clear button: triggers change and changeDate events', function(){
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({
|
||||
format: "dd-mm-yyyy",
|
||||
clearBtn: true
|
||||
})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker');
|
||||
this.picker = this.dp.picker;
|
||||
|
||||
var target,
|
||||
triggered_change = 0,
|
||||
triggered_changeDate = 0;
|
||||
|
||||
this.input.on({
|
||||
changeDate: function(){
|
||||
triggered_changeDate++;
|
||||
},
|
||||
change: function(){
|
||||
triggered_change++;
|
||||
}
|
||||
});
|
||||
|
||||
this.input.focus();
|
||||
ok(this.picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(this.picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Clear button visible');
|
||||
|
||||
target = this.picker.find('.datepicker-days tfoot .clear');
|
||||
target.click();
|
||||
|
||||
equal(triggered_change, 1);
|
||||
equal(triggered_changeDate, 1);
|
||||
});
|
||||
|
||||
test('setDate: triggers change and changeDate events', function(){
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({
|
||||
format: "dd-mm-yyyy"
|
||||
})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker');
|
||||
this.picker = this.dp.picker;
|
||||
|
||||
var target,
|
||||
triggered_change = 0,
|
||||
triggered_changeDate = 0;
|
||||
|
||||
this.input.on({
|
||||
changeDate: function(){
|
||||
triggered_changeDate++;
|
||||
},
|
||||
change: function(){
|
||||
triggered_change++;
|
||||
}
|
||||
});
|
||||
|
||||
this.input.focus();
|
||||
ok(this.picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
|
||||
this.dp.setDate(new Date(2011, 2, 5));
|
||||
|
||||
equal(triggered_change, 2);
|
||||
equal(triggered_changeDate, 1);
|
||||
});
|
||||
@@ -0,0 +1,235 @@
|
||||
module('Formats', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text">').appendTo('#qunit-fixture');
|
||||
this.date = UTCDate(2012, 2, 15, 0, 0, 0, 0); // March 15, 2012
|
||||
},
|
||||
teardown: function(){
|
||||
this.input.data('datepicker').picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('d: Day of month, no leading zero.', function(){
|
||||
this.input
|
||||
.val('2012-03-05')
|
||||
.datepicker({format: 'yyyy-mm-d'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[2], '5');
|
||||
});
|
||||
|
||||
test('dd: Day of month, leading zero.', function(){
|
||||
this.input
|
||||
.val('2012-03-5')
|
||||
.datepicker({format: 'yyyy-mm-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[2], '05');
|
||||
});
|
||||
|
||||
test('D: Day of week, short.', function(){
|
||||
this.input
|
||||
.val('2012-03-05')
|
||||
.datepicker({format: 'yyyy-mm-dd-D'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[3], 'Mon');
|
||||
});
|
||||
|
||||
test('DD: Day of week, long.', function(){
|
||||
this.input
|
||||
.val('2012-03-05')
|
||||
.datepicker({format: 'yyyy-mm-dd-DD'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[3], 'Monday');
|
||||
});
|
||||
|
||||
test('m: Month, no leading zero.', function(){
|
||||
this.input
|
||||
.val('2012-03-05')
|
||||
.datepicker({format: 'yyyy-m-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[1], '3');
|
||||
});
|
||||
|
||||
test('mm: Month, leading zero.', function(){
|
||||
this.input
|
||||
.val('2012-3-5')
|
||||
.datepicker({format: 'yyyy-mm-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[1], '03');
|
||||
});
|
||||
|
||||
test('M: Month shortname.', function(){
|
||||
this.input
|
||||
.val('2012-Mar-05')
|
||||
.datepicker({format: 'yyyy-M-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[1], 'Mar');
|
||||
});
|
||||
|
||||
test('MM: Month full name.', function(){
|
||||
this.input
|
||||
.val('2012-March-5')
|
||||
.datepicker({format: 'yyyy-MM-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[1], 'March');
|
||||
});
|
||||
|
||||
test('yy: Year, two-digit.', function(){
|
||||
this.input
|
||||
.val('2012-03-05')
|
||||
.datepicker({format: 'yy-mm-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[0], '12');
|
||||
});
|
||||
|
||||
test('yyyy: Year, four-digit.', function(){
|
||||
this.input
|
||||
.val('2012-03-5')
|
||||
.datepicker({format: 'yyyy-mm-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val().split('-')[0], '2012');
|
||||
});
|
||||
|
||||
test('dd-mm-yyyy: Regression: Prevent potential month overflow in small-to-large formats (Mar 31, 2012 -> Mar 01, 2012)', function(){
|
||||
this.input
|
||||
.val('31-03-2012')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '31-03-2012');
|
||||
});
|
||||
|
||||
test('dd-mm-yyyy: Leap day', function(){
|
||||
this.input
|
||||
.val('29-02-2012')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '29-02-2012');
|
||||
});
|
||||
|
||||
test('yyyy-mm-dd: Alternative format', function(){
|
||||
this.input
|
||||
.val('2012-02-12')
|
||||
.datepicker({format: 'yyyy-mm-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '2012-02-12');
|
||||
});
|
||||
|
||||
test('yyyy-MM-dd: Regression: Infinite loop when numbers used for month', function(){
|
||||
this.input
|
||||
.val('2012-02-12')
|
||||
.datepicker({format: 'yyyy-MM-dd'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '2012-February-12');
|
||||
});
|
||||
|
||||
test('+1d: Tomorrow', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('+1d')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '16-03-2012');
|
||||
}));
|
||||
|
||||
test('-1d: Yesterday', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('-1d')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '14-03-2012');
|
||||
}));
|
||||
|
||||
test('+1w: Next week', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('+1w')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '22-03-2012');
|
||||
}));
|
||||
|
||||
test('-1w: Last week', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('-1w')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '08-03-2012');
|
||||
}));
|
||||
|
||||
test('+1m: Next month', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('+1m')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '15-04-2012');
|
||||
}));
|
||||
|
||||
test('-1m: Last month', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('-1m')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '15-02-2012');
|
||||
}));
|
||||
|
||||
test('+1y: Next year', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('+1y')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '15-03-2013');
|
||||
}));
|
||||
|
||||
test('-1y: Last year', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('-1y')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '15-03-2011');
|
||||
}));
|
||||
|
||||
test('-1y +2m: Multiformat', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
this.input
|
||||
.val('-1y +2m')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '15-05-2011');
|
||||
}));
|
||||
|
||||
test('Regression: End-of-month bug', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 4, 31);
|
||||
this.input
|
||||
.val('29-02-2012')
|
||||
.datepicker({format: 'dd-mm-yyyy'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '29-02-2012');
|
||||
}));
|
||||
|
||||
test('Invalid formats are force-parsed into a valid date on tab', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 4, 31);
|
||||
this.input
|
||||
.val('44-44-4444')
|
||||
.datepicker({format: 'yyyy-MM-dd'})
|
||||
.focus();
|
||||
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 9
|
||||
});
|
||||
|
||||
equal(this.input.val(), '56-September-30');
|
||||
}));
|
||||
|
||||
test('Trailing separators', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 4, 31);
|
||||
this.input
|
||||
.val('29.02.2012.')
|
||||
.datepicker({format: 'dd.mm.yyyy.'})
|
||||
.datepicker('setValue');
|
||||
equal(this.input.val(), '29.02.2012.');
|
||||
}));
|
||||
@@ -0,0 +1,28 @@
|
||||
module('Inline', {
|
||||
setup: function(){
|
||||
this.component = $('<div data-date="12-02-2012"></div>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"});
|
||||
this.dp = this.component.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
test('Picker gets date/viewDate from data-date attr', function(){
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 1, 12));
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 12));
|
||||
});
|
||||
|
||||
|
||||
test('Visible after init', function(){
|
||||
ok(this.picker.is(':visible'));
|
||||
});
|
||||
|
||||
test('update', function(){
|
||||
this.dp.update('13-03-2012')
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 13));
|
||||
});
|
||||
+92
@@ -0,0 +1,92 @@
|
||||
module('Keyboard Navigation 2011', {
|
||||
setup: function(){
|
||||
/*
|
||||
Tests start with picker on March 31, 2011. Fun facts:
|
||||
|
||||
* March 1, 2011 was on a Tuesday
|
||||
* March 31, 2011 was on a Thursday
|
||||
*/
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('Regression: by week (up/down arrows); up from Mar 6, 2011 should go to Feb 27, 2011', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('06-03-2011').datepicker('update');
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 6));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 6));
|
||||
equal(this.dp.focusDate, null);
|
||||
|
||||
// Navigation: -1 week, up arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 38
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 27));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 6));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 1, 27));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2011', 'Title is "February 2011"');
|
||||
});
|
||||
|
||||
test('Regression: by day (left/right arrows); left from Mar 1, 2011 should go to Feb 28, 2011', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('01-03-2011').datepicker('update');
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 1));
|
||||
equal(this.dp.focusDate, null);
|
||||
|
||||
// Navigation: -1 day left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 28));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 1));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 1, 28));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2011', 'Title is "February 2011"');
|
||||
});
|
||||
|
||||
test('Regression: by month (shift + left/right arrows); left from Mar 15, 2011 should go to Feb 15, 2011', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('15-03-2011').datepicker('update');
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 15));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 15));
|
||||
equal(this.dp.focusDate, null);
|
||||
|
||||
// Navigation: -1 month, shift + left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 15));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 2, 15));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 1, 15));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2011', 'Title is "February 2011"');
|
||||
});
|
||||
+469
@@ -0,0 +1,469 @@
|
||||
module('Keyboard Navigation 2012', {
|
||||
setup: function(){
|
||||
/*
|
||||
Tests start with picker on March 31, 2012. Fun facts:
|
||||
|
||||
* February 1, 2012 was on a Wednesday
|
||||
* February 29, 2012 was on a Wednesday
|
||||
* March 1, 2012 was on a Thursday
|
||||
* March 31, 2012 was on a Saturday
|
||||
*/
|
||||
this.input = $('<input type="text" value="31-03-2012">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
test('by day (right/left arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 day, left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 2, 30));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: +1 day, right arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 1));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 3, 1));
|
||||
// Month changed: April 1 (this is not a joke!)
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'April 2012', 'Title is "April 2012"');
|
||||
});
|
||||
|
||||
test('by week (up/down arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 week, up arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 38
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 24));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 2, 24));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: +1 week, down arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 40
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 7));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 3, 7));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'April 2012', 'Title is "April 2012"');
|
||||
});
|
||||
|
||||
test('by month, v1 (shift + left/right arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 month, shift + left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
shiftKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation w/ graceful date ends, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 1, 29));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
|
||||
// Navigation: +1 month, shift + right arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 3, 29));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'April 2012', 'Title is "April 2012"');
|
||||
});
|
||||
|
||||
test('by month, v2 (shift + up/down arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 month, shift + up arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 38,
|
||||
shiftKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation w/ graceful date ends, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 1, 29));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
|
||||
// Navigation: +1 month, shift + down arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 40,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 3, 29));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'April 2012', 'Title is "April 2012"');
|
||||
});
|
||||
|
||||
test('by year, v1 (ctrl + left/right arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 year, ctrl + left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
ctrlKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 2, 31));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
|
||||
// Navigation: +1 year, ctrl + right arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
ctrlKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2013, 2, 31));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2013', 'Title is "March 2013"');
|
||||
});
|
||||
|
||||
test('by year, v2 (ctrl + up/down arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 year, ctrl + up arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 38,
|
||||
ctrlKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 2, 31));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
|
||||
// Navigation: +1 year, ctrl + down arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 40,
|
||||
ctrlKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2013, 2, 31));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2013', 'Title is "March 2013"');
|
||||
});
|
||||
|
||||
test('by year, v3 (ctrl + shift + left/right arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 year, ctrl + left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
ctrlKey: true,
|
||||
shiftKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 2, 31));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
|
||||
// Navigation: +1 year, ctrl + right arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
ctrlKey: true,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2013, 2, 31));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2013', 'Title is "March 2013"');
|
||||
});
|
||||
|
||||
test('by year, v4 (ctrl + shift + up/down arrows)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 year, ctrl + up arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 38,
|
||||
ctrlKey: true,
|
||||
shiftKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 2, 31));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2011', 'Title is "March 2011"');
|
||||
|
||||
// Navigation: +1 year, ctrl + down arrow key
|
||||
for (var i=0; i<2; i++)
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 40,
|
||||
ctrlKey: true,
|
||||
shiftKey: true
|
||||
});
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2013, 2, 31));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2013', 'Title is "March 2013"');
|
||||
});
|
||||
|
||||
test('by year, from leap day', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
|
||||
this.input.val('29-02-2012').datepicker('update');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 1, 29));
|
||||
equal(this.dp.focusDate, null);
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
|
||||
// Navigation: -1 year
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37,
|
||||
ctrlKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation w/ graceful month ends, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 28));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2011, 1, 28));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2011', 'Title is "February 2011"');
|
||||
|
||||
// Navigation: +1 year, back to leap year
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
ctrlKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation w/ graceful month ends, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 28));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 1, 28));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2012', 'Title is "February 2012"');
|
||||
|
||||
// Navigation: +1 year
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 39,
|
||||
ctrlKey: true
|
||||
});
|
||||
// view and focus updated on keyboard navigation w/ graceful month ends, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 1, 28));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2013, 1, 28));
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'February 2013', 'Title is "February 2013"');
|
||||
});
|
||||
|
||||
test('Selection (enter)', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 day, left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 2, 30));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Selection: Enter
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 13
|
||||
});
|
||||
// view and selection updated, focus cleared
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 30));
|
||||
equal(this.dp.focusDate, null);
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
ok(this.picker.is(':visible'), 'Picker is not hidden');
|
||||
});
|
||||
|
||||
test('Selection + hide (enter)', function(){
|
||||
var target;
|
||||
|
||||
this.dp._process_options({autoclose: true});
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Navigation: -1 day, left arrow key
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
// view and focus updated on keyboard navigation, not selected
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.focusDate, UTCDate(2012, 2, 30));
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
// Selection: Enter
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 13
|
||||
});
|
||||
// view and selection updatedfocus cleared
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 30));
|
||||
equal(this.dp.focusDate, null);
|
||||
// Month not changed
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
ok(this.picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
});
|
||||
|
||||
test('Toggle hide/show (escape); navigation while hidden is suppressed', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
equal(target.text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
ok(this.picker.is(':visible'), 'Picker is visible');
|
||||
|
||||
// Hide
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 27
|
||||
});
|
||||
|
||||
ok(this.picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// left arrow key, *doesn't* navigate
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 37
|
||||
});
|
||||
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Show
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 27
|
||||
});
|
||||
|
||||
ok(this.picker.is(':visible'), 'Picker is visible');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
module('Keyboard Navigation (All)', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('TAB hides picker', function(){
|
||||
var target;
|
||||
|
||||
ok(this.picker.is(':visible'), 'Picker is visible');
|
||||
|
||||
this.input.trigger({
|
||||
type: 'keydown',
|
||||
keyCode: 9
|
||||
});
|
||||
|
||||
ok(this.picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
});
|
||||
@@ -0,0 +1,78 @@
|
||||
module('Methods', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"});
|
||||
this.dp = this.input.data('datepicker')
|
||||
},
|
||||
teardown: function(){
|
||||
this.dp.remove();
|
||||
}
|
||||
});
|
||||
|
||||
// test('remove', function(){
|
||||
|
||||
// });
|
||||
|
||||
// test('show', function(){
|
||||
|
||||
// });
|
||||
|
||||
// test('hide', function(){
|
||||
|
||||
// });
|
||||
|
||||
test('update - String', function(){
|
||||
this.dp.update('13-03-2012');
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 13));
|
||||
var date = this.dp.picker.find('.datepicker-days td:contains(13)');
|
||||
ok(date.is('.active'), 'Date is selected');
|
||||
});
|
||||
|
||||
test('update - Date', function(){
|
||||
this.dp.update(new Date(2012, 2, 13));
|
||||
datesEqual(this.dp.dates[0], UTCDate(2012, 2, 13));
|
||||
var date = this.dp.picker.find('.datepicker-days td:contains(13)');
|
||||
ok(date.is('.active'), 'Date is selected');
|
||||
});
|
||||
|
||||
test('update - null', function(){
|
||||
this.dp.update(null);
|
||||
equal(this.dp.dates[0], undefined);
|
||||
var selected = this.dp.picker.find('.datepicker-days td.active');
|
||||
equal(selected.length, 0, 'No date is selected');
|
||||
});
|
||||
|
||||
test('setDate', function(){
|
||||
var date_in = new Date(2013, 1, 1),
|
||||
expected_date = new Date(Date.UTC(2013, 1, 1));
|
||||
|
||||
notEqual(this.dp.dates[0], date_in);
|
||||
this.dp.setDate(date_in);
|
||||
datesEqual(this.dp.dates[0], expected_date);
|
||||
});
|
||||
|
||||
test('setUTCDate', function(){
|
||||
var date_in = new Date(Date.UTC(2012, 3, 5)),
|
||||
expected_date = date_in;
|
||||
|
||||
notEqual(this.dp.dates[0], date_in);
|
||||
this.dp.setUTCDate(date_in);
|
||||
datesEqual(this.dp.dates[0], expected_date);
|
||||
});
|
||||
|
||||
// test('setStartDate', function(){
|
||||
|
||||
// });
|
||||
|
||||
// test('setEndDate', function(){
|
||||
|
||||
// });
|
||||
|
||||
// test('setDaysOfWeekDisabled - String', function(){
|
||||
|
||||
// });
|
||||
|
||||
// test('setDaysOfWeekDisabled - Array', function(){
|
||||
|
||||
// });
|
||||
+66
@@ -0,0 +1,66 @@
|
||||
module('Mouse Navigation 2011', {
|
||||
setup: function(){
|
||||
/*
|
||||
Tests start with picker on March 31, 2011.
|
||||
*/
|
||||
this.input = $('<input type="text" value="31-03-2011">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('Selecting date from previous month while in January changes month and year displayed', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('01-01-2011');
|
||||
this.dp.update();
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 0, 1))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 0, 1))
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '26'); // Should be Dec 26
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'January 2011');
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'December 2010');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2010, 11, 26))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2010, 11, 26))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '28'); // Should be Nov 28
|
||||
});
|
||||
|
||||
test('Selecting date from next month while in December changes month and year displayed', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('01-12-2010');
|
||||
this.dp.update();
|
||||
datesEqual(this.dp.viewDate, UTCDate(2010, 11, 1))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2010, 11, 1))
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:last');
|
||||
equal(target.text(), '8'); // Should be Jan 8
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'December 2010');
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'January 2011');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 0, 8))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2011, 0, 8))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '26'); // Should be Dec 26
|
||||
});
|
||||
+251
@@ -0,0 +1,251 @@
|
||||
module('Mouse Navigation 2012', {
|
||||
setup: function(){
|
||||
/*
|
||||
Tests start with picker on March 31, 2012. Fun facts:
|
||||
|
||||
* February 1, 2012 was on a Wednesday
|
||||
* February 29, 2012 was on a Wednesday
|
||||
* March 1, 2012 was on a Thursday
|
||||
* March 31, 2012 was on a Saturday
|
||||
*/
|
||||
this.input = $('<input type="text" value="31-03-2012">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('Selecting date resets viewDate and date', function(){
|
||||
var target;
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Should be Mar 4
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 4))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 4))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '26'); // Should be Feb 29
|
||||
});
|
||||
|
||||
test('Navigating next/prev by month', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.prev');
|
||||
ok(target.is(':visible'), 'Month:prev nav is visible');
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
// Should handle month-length changes gracefully
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '29'); // Should be Jan 29
|
||||
|
||||
target = this.picker.find('.datepicker-days thead th.next');
|
||||
ok(target.is(':visible'), 'Month:next nav is visible');
|
||||
|
||||
// Updated internally on click
|
||||
target.click().click();
|
||||
// Graceful moonth-end handling carries over
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 29));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '25'); // Should be Mar 25
|
||||
// (includes "old" days at start of month, even if that's all the first week-row consists of)
|
||||
});
|
||||
|
||||
test('Navigating to/from year view', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Change months to test internal state
|
||||
target = this.picker.find('.datepicker-months tbody span:contains(Apr)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 0);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 1)); // Apr 30
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
test('Navigating to/from decade view', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-years').is(':visible'), 'Year picker is visible');
|
||||
equal(this.dp.viewMode, 2);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Change years to test internal state changes
|
||||
target = this.picker.find('.datepicker-years tbody span:contains(2011)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months tbody span:contains(Apr)');
|
||||
target.click();
|
||||
equal(this.dp.viewMode, 0);
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
test('Navigating prev/next in year view', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
equal(this.picker.find('.datepicker-months thead th.datepicker-switch').text(), '2012');
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Go to next year (2013)
|
||||
target = this.picker.find('.datepicker-months thead th.next');
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-months thead th.datepicker-switch').text(), '2013');
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Go to prev year (x2 == 2011)
|
||||
target = this.picker.find('.datepicker-months thead th.prev');
|
||||
target.click().click();
|
||||
equal(this.picker.find('.datepicker-months thead th.datepicker-switch').text(), '2011');
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
test('Navigating prev/next in decade view', function(){
|
||||
var target;
|
||||
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-months').is(':visible'), 'Month picker is visible');
|
||||
equal(this.dp.viewMode, 1);
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
target = this.picker.find('.datepicker-months thead th.datepicker-switch');
|
||||
ok(target.is(':visible'), 'View switcher is visible');
|
||||
|
||||
target.click();
|
||||
ok(this.picker.find('.datepicker-years').is(':visible'), 'Year picker is visible');
|
||||
equal(this.dp.viewMode, 2);
|
||||
equal(this.picker.find('.datepicker-years thead th.datepicker-switch').text(), '2010-2019');
|
||||
// Not modified when switching modes
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Go to next decade (2020-29)
|
||||
target = this.picker.find('.datepicker-years thead th.next');
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-years thead th.datepicker-switch').text(), '2020-2029');
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2022, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
|
||||
// Go to prev year (x2 == 2000-09)
|
||||
target = this.picker.find('.datepicker-years thead th.prev');
|
||||
target.click().click();
|
||||
equal(this.picker.find('.datepicker-years thead th.datepicker-switch').text(), '2000-2009');
|
||||
// Only viewDate modified
|
||||
datesEqual(this.dp.viewDate, UTCDate(2002, 2, 31));
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 2, 31));
|
||||
});
|
||||
|
||||
test('Selecting date from previous month resets viewDate and date, changing month displayed', function(){
|
||||
var target;
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '26'); // Should be Feb 26
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'March 2012');
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'February 2012');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 26))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 1, 26))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '29'); // Should be Jan 29
|
||||
});
|
||||
|
||||
test('Selecting date from next month resets viewDate and date, changing month displayed', function(){
|
||||
var target;
|
||||
|
||||
this.input.val('01-04-2012');
|
||||
this.dp.update();
|
||||
|
||||
// Rendered correctly
|
||||
equal(this.dp.viewMode, 0);
|
||||
target = this.picker.find('.datepicker-days tbody td:last');
|
||||
equal(target.text(), '5'); // Should be May 5
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'April 2012');
|
||||
|
||||
// Updated internally on click
|
||||
target.click();
|
||||
equal(this.picker.find('.datepicker-days thead th.datepicker-switch').text(), 'May 2012');
|
||||
datesEqual(this.dp.viewDate, UTCDate(2012, 4, 5))
|
||||
datesEqual(this.dp.dates.get(-1), UTCDate(2012, 4, 5))
|
||||
|
||||
// Re-rendered on click
|
||||
target = this.picker.find('.datepicker-days tbody td:first');
|
||||
equal(target.text(), '29'); // Should be Apr 29
|
||||
});
|
||||
+33
@@ -0,0 +1,33 @@
|
||||
module('Mouse Navigation (All)', {
|
||||
setup: function(){
|
||||
this.input = $('<input type="text">')
|
||||
.appendTo('#qunit-fixture')
|
||||
.datepicker({format: "dd-mm-yyyy"})
|
||||
.focus(); // Activate for visibility checks
|
||||
this.dp = this.input.data('datepicker')
|
||||
this.picker = this.dp.picker;
|
||||
},
|
||||
teardown: function(){
|
||||
this.picker.remove();
|
||||
}
|
||||
});
|
||||
|
||||
test('Clicking datepicker does not hide datepicker', function(){
|
||||
ok(this.picker.is(':visible'), 'Picker is visible');
|
||||
this.picker.trigger('mousedown');
|
||||
ok(this.picker.is(':visible'), 'Picker is still visible');
|
||||
});
|
||||
|
||||
test('Clicking outside datepicker hides datepicker', function(){
|
||||
var $otherelement = $('<div />');
|
||||
$('body').append($otherelement);
|
||||
|
||||
ok(this.picker.is(':visible'), 'Picker is visible');
|
||||
this.input.trigger('click');
|
||||
ok(this.picker.is(':visible'), 'Picker is still visible');
|
||||
|
||||
$otherelement.trigger('mousedown');
|
||||
ok(this.picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
|
||||
$otherelement.remove();
|
||||
});
|
||||
@@ -0,0 +1,20 @@
|
||||
module('NoConflict', {
|
||||
setup: function(){
|
||||
var datepicker = $.fn.datepicker.noConflict();
|
||||
$.fn.bootstrapDP = datepicker;
|
||||
},
|
||||
teardown: function(){
|
||||
$.fn.datepicker = $.fn.bootstrapDP;
|
||||
delete $.fn.bootstrapDP;
|
||||
}
|
||||
});
|
||||
|
||||
test('Datepicker starts after calling noConflict() (no undefined defaults or locale_opts)', function(){
|
||||
$('<div class="input-append date" id="datepicker">'+
|
||||
'<input size="16" type="text" value="12-02-2012" readonly>'+
|
||||
'<span class="add-on"><i class="icon-th"></i></span>'+
|
||||
'</div>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.bootstrapDP();
|
||||
expect(0);
|
||||
});
|
||||
@@ -0,0 +1,648 @@
|
||||
module('Options', {
|
||||
setup: function(){},
|
||||
teardown: function(){
|
||||
$('#qunit-fixture *').each(function(){
|
||||
var t = $(this);
|
||||
if ('datepicker' in t.data())
|
||||
t.datepicker('remove');
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
test('Autoclose', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
autoclose: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
|
||||
input.focus();
|
||||
ok(picker.is(':visible'), 'Picker is visible');
|
||||
target = picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Mar 4
|
||||
|
||||
target.click();
|
||||
ok(picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
datesEqual(dp.dates[0], UTCDate(2012, 2, 4));
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
|
||||
});
|
||||
|
||||
test('Startview: year view (integer)', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
startView: 1
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
|
||||
ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
|
||||
ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
|
||||
});
|
||||
|
||||
test('Startview: year view (string)', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
startView: 'year'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
|
||||
ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
|
||||
ok(picker.find('.datepicker-years').is(':not(:visible)'), 'Years view hidden');
|
||||
});
|
||||
|
||||
test('Startview: decade view (integer)', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
startView: 2
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
|
||||
ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
|
||||
ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
|
||||
});
|
||||
|
||||
test('Startview: decade view (string)', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
startView: 'decade'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':not(:visible)'), 'Days view hidden');
|
||||
ok(picker.find('.datepicker-months').is(':not(:visible)'), 'Months view hidden');
|
||||
ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
|
||||
});
|
||||
|
||||
test('Today Button: today button not default', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .today').is(':not(:visible)'), 'Today button not visible');
|
||||
});
|
||||
|
||||
test('Today Button: today visibility when enabled', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
todayBtn: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
|
||||
|
||||
picker.find('.datepicker-days thead th.datepicker-switch').click();
|
||||
ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
|
||||
ok(picker.find('.datepicker-months tfoot .today').is(':visible'), 'Today button visible');
|
||||
|
||||
picker.find('.datepicker-months thead th.datepicker-switch').click();
|
||||
ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
|
||||
ok(picker.find('.datepicker-years tfoot .today').is(':visible'), 'Today button visible');
|
||||
});
|
||||
|
||||
test('Today Button: data-api', function(){
|
||||
var input = $('<input data-date-today-btn="true" />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
|
||||
});
|
||||
|
||||
test('Today Button: moves to today\'s date', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
todayBtn: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
|
||||
|
||||
target = picker.find('.datepicker-days tfoot .today');
|
||||
target.click();
|
||||
|
||||
var d = new Date(),
|
||||
today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate());
|
||||
datesEqual(dp.viewDate, today);
|
||||
datesEqual(dp.dates[0], UTCDate(2012, 2, 5));
|
||||
});
|
||||
|
||||
test('Today Button: "linked" selects today\'s date', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
todayBtn: "linked"
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .today').is(':visible'), 'Today button visible');
|
||||
|
||||
target = picker.find('.datepicker-days tfoot .today');
|
||||
target.click();
|
||||
|
||||
var d = new Date(),
|
||||
today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate());
|
||||
datesEqual(dp.viewDate, today);
|
||||
datesEqual(dp.dates[0], today);
|
||||
});
|
||||
|
||||
test('Today Highlight: today\'s date is not highlighted by default', patch_date(function(Date){
|
||||
Date.now = UTCDate(2012, 2, 15);
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
target = picker.find('.datepicker-days tbody td:contains(15)');
|
||||
ok(!target.hasClass('today'), 'Today is not marked with "today" class');
|
||||
target = picker.find('.datepicker-days tbody td:contains(14)');
|
||||
ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
|
||||
target = picker.find('.datepicker-days tbody td:contains(16)');
|
||||
ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
|
||||
}));
|
||||
|
||||
test('Today Highlight: today\'s date is highlighted when not active', patch_date(function(Date){
|
||||
Date.now = new Date(2012, 2, 15);
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
todayHighlight: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
equal(picker.find('.datepicker-days thead .datepicker-switch').text(), 'March 2012', 'Title is "March 2012"');
|
||||
|
||||
target = picker.find('.datepicker-days tbody td:contains(15)');
|
||||
ok(target.hasClass('today'), 'Today is marked with "today" class');
|
||||
target = picker.find('.datepicker-days tbody td:contains(14)');
|
||||
ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
|
||||
target = picker.find('.datepicker-days tbody td:contains(16)');
|
||||
ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
|
||||
}));
|
||||
|
||||
test('Clear Button: clear visibility when enabled', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
clearBtn: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Clear button visible');
|
||||
|
||||
picker.find('.datepicker-days thead th.datepicker-switch').click();
|
||||
ok(picker.find('.datepicker-months').is(':visible'), 'Months view visible');
|
||||
ok(picker.find('.datepicker-months tfoot .clear').is(':visible'), 'Clear button visible');
|
||||
|
||||
picker.find('.datepicker-months thead th.datepicker-switch').click();
|
||||
ok(picker.find('.datepicker-years').is(':visible'), 'Years view visible');
|
||||
ok(picker.find('.datepicker-years tfoot .clear').is(':visible'), 'Clear button visible');
|
||||
});
|
||||
|
||||
test('Clear Button: clears input value', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
clearBtn: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Today button visible');
|
||||
|
||||
target = picker.find('.datepicker-days tfoot .clear');
|
||||
target.click();
|
||||
|
||||
equal(input.val(),'',"Input value has been cleared.")
|
||||
ok(picker.is(':visible'), 'Picker is visible');
|
||||
});
|
||||
|
||||
test('Clear Button: hides datepicker if autoclose is on', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
clearBtn: true,
|
||||
autoclose: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
ok(picker.find('.datepicker-days').is(':visible'), 'Days view visible');
|
||||
ok(picker.find('.datepicker-days tfoot .clear').is(':visible'), 'Today button visible');
|
||||
|
||||
target = picker.find('.datepicker-days tfoot .clear');
|
||||
target.click();
|
||||
|
||||
equal(input.val(),'',"Input value has been cleared.");
|
||||
ok(picker.is(':not(:visible)'), 'Picker is hidden');
|
||||
|
||||
});
|
||||
|
||||
test('DaysOfWeekDisabled', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-10-26')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
daysOfWeekDisabled: '1,5'
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
|
||||
input.focus();
|
||||
target = picker.find('.datepicker-days tbody td:nth(22)');
|
||||
ok(target.hasClass('disabled'), 'Day of week is disabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(24)');
|
||||
ok(!target.hasClass('disabled'), 'Day of week is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(26)');
|
||||
ok(target.hasClass('disabled'), 'Day of week is disabled');
|
||||
});
|
||||
|
||||
test('BeforeShowDay', function(){
|
||||
|
||||
var beforeShowDay = function(date) {
|
||||
var dateTime = UTCDate(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()).getTime();
|
||||
var dateTime25th = UTCDate(2012, 9, 25).getTime();
|
||||
var dateTime26th = UTCDate(2012, 9, 26).getTime();
|
||||
var dateTime27th = UTCDate(2012, 9, 27).getTime();
|
||||
var dateTime28th = UTCDate(2012, 9, 28).getTime();
|
||||
|
||||
if (dateTime == dateTime25th) {
|
||||
return {tooltip: 'A tooltip'};
|
||||
}
|
||||
else if (dateTime == dateTime26th) {
|
||||
return 'test26';
|
||||
}
|
||||
else if (dateTime == dateTime27th) {
|
||||
return {enabled: false, classes:'test27'};
|
||||
}
|
||||
else if (dateTime == dateTime28th) {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-10-26')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
beforeShowDay: beforeShowDay
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
target = picker.find('.datepicker-days tbody td:nth(25)');
|
||||
equal(target.attr('title'), 'A tooltip', '25th has tooltip');
|
||||
ok(!target.hasClass('disabled'), '25th is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(26)');
|
||||
ok(target.hasClass('test26'), '26th has test26 class');
|
||||
ok(!target.hasClass('disabled'), '26th is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(27)');
|
||||
ok(target.hasClass('test27'), '27th has test27 class');
|
||||
ok(target.hasClass('disabled'), '27th is disabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(28)');
|
||||
ok(target.hasClass('disabled'), '28th is disabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(29)');
|
||||
ok(!target.hasClass('disabled'), '29th is enabled');
|
||||
});
|
||||
|
||||
test('Orientation: values are parsed correctly', function(){
|
||||
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-10-26')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd'
|
||||
}),
|
||||
dp = input.data('datepicker');
|
||||
|
||||
equal(dp.o.orientation.x, 'auto');
|
||||
equal(dp.o.orientation.y, 'auto');
|
||||
|
||||
dp._process_options({orientation: ''});
|
||||
equal(dp.o.orientation.x, 'auto', 'Empty value');
|
||||
equal(dp.o.orientation.y, 'auto', 'Empty value');
|
||||
|
||||
dp._process_options({orientation: 'left'});
|
||||
equal(dp.o.orientation.x, 'left', '"left"');
|
||||
equal(dp.o.orientation.y, 'auto', '"left"');
|
||||
|
||||
dp._process_options({orientation: 'right'});
|
||||
equal(dp.o.orientation.x, 'right', '"right"');
|
||||
equal(dp.o.orientation.y, 'auto', '"right"');
|
||||
|
||||
dp._process_options({orientation: 'top'});
|
||||
equal(dp.o.orientation.x, 'auto', '"top"');
|
||||
equal(dp.o.orientation.y, 'top', '"top"');
|
||||
|
||||
dp._process_options({orientation: 'bottom'});
|
||||
equal(dp.o.orientation.x, 'auto', '"bottom"');
|
||||
equal(dp.o.orientation.y, 'bottom', '"bottom"');
|
||||
|
||||
dp._process_options({orientation: 'left top'});
|
||||
equal(dp.o.orientation.x, 'left', '"left top"');
|
||||
equal(dp.o.orientation.y, 'top', '"left top"');
|
||||
|
||||
dp._process_options({orientation: 'left bottom'});
|
||||
equal(dp.o.orientation.x, 'left', '"left bottom"');
|
||||
equal(dp.o.orientation.y, 'bottom', '"left bottom"');
|
||||
|
||||
dp._process_options({orientation: 'right top'});
|
||||
equal(dp.o.orientation.x, 'right', '"right top"');
|
||||
equal(dp.o.orientation.y, 'top', '"right top"');
|
||||
|
||||
dp._process_options({orientation: 'right bottom'});
|
||||
equal(dp.o.orientation.x, 'right', '"right bottom"');
|
||||
equal(dp.o.orientation.y, 'bottom', '"right bottom"');
|
||||
|
||||
dp._process_options({orientation: 'left right'});
|
||||
equal(dp.o.orientation.x, 'left', '"left right"');
|
||||
equal(dp.o.orientation.y, 'auto', '"left right"');
|
||||
|
||||
dp._process_options({orientation: 'right left'});
|
||||
equal(dp.o.orientation.x, 'right', '"right left"');
|
||||
equal(dp.o.orientation.y, 'auto', '"right left"');
|
||||
|
||||
dp._process_options({orientation: 'top bottom'});
|
||||
equal(dp.o.orientation.x, 'auto', '"top bottom"');
|
||||
equal(dp.o.orientation.y, 'top', '"top bottom"');
|
||||
|
||||
dp._process_options({orientation: 'bottom top'});
|
||||
equal(dp.o.orientation.x, 'auto', '"bottom top"');
|
||||
equal(dp.o.orientation.y, 'bottom', '"bottom top"');
|
||||
|
||||
dp._process_options({orientation: 'foo bar'});
|
||||
equal(dp.o.orientation.x, 'auto', '"foo bar"');
|
||||
equal(dp.o.orientation.y, 'auto', '"foo bar"');
|
||||
|
||||
dp._process_options({orientation: 'foo left'});
|
||||
equal(dp.o.orientation.x, 'left', '"foo left"');
|
||||
equal(dp.o.orientation.y, 'auto', '"foo left"');
|
||||
|
||||
dp._process_options({orientation: 'top bar'});
|
||||
equal(dp.o.orientation.x, 'auto', '"top bar"');
|
||||
equal(dp.o.orientation.y, 'top', '"top bar"');
|
||||
});
|
||||
|
||||
test('startDate', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-10-26')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
startDate: new Date(2012, 9, 26)
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
target = picker.find('.datepicker-days tbody td:nth(25)');
|
||||
ok(target.hasClass('disabled'), 'Previous day is disabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(26)');
|
||||
ok(!target.hasClass('disabled'), 'Specified date is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(27)');
|
||||
ok(!target.hasClass('disabled'), 'Next day is enabled');
|
||||
});
|
||||
|
||||
test('endDate', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-10-26')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
endDate: new Date(2012, 9, 26)
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
target = picker.find('.datepicker-days tbody td:nth(25)');
|
||||
ok(!target.hasClass('disabled'), 'Previous day is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(26)');
|
||||
ok(!target.hasClass('disabled'), 'Specified date is enabled');
|
||||
target = picker.find('.datepicker-days tbody td:nth(27)');
|
||||
ok(target.hasClass('disabled'), 'Next day is disabled');
|
||||
});
|
||||
|
||||
test('Multidate', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
multidate: true
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
|
||||
// Initial value is selected
|
||||
ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 (initial date) in dates');
|
||||
|
||||
// Select first
|
||||
target = picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Mar 4
|
||||
|
||||
target.click();
|
||||
datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
|
||||
equal(input.val(), '2012-03-05,2012-03-04');
|
||||
|
||||
// Select second
|
||||
target = picker.find('.datepicker-days tbody td:nth(15)');
|
||||
equal(target.text(), '12'); // Mar 12
|
||||
|
||||
target.click();
|
||||
datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 12), '2012-03-12 in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 12));
|
||||
equal(input.val(), '2012-03-05,2012-03-04,2012-03-12');
|
||||
|
||||
// Deselect first
|
||||
target = picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Mar 4
|
||||
|
||||
target.click();
|
||||
ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
|
||||
equal(input.val(), '2012-03-05,2012-03-12');
|
||||
});
|
||||
|
||||
test('Multidate with limit', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
multidate: 2
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
|
||||
// Initial value is selected
|
||||
ok(dp.dates.contains(UTCDate(2012, 2, 5)) !== -1, '2012-03-05 (initial date) in dates');
|
||||
|
||||
// Select first
|
||||
target = picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Mar 4
|
||||
|
||||
target.click();
|
||||
datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 4), '2012-03-04 in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 4));
|
||||
equal(input.val(), '2012-03-05,2012-03-04');
|
||||
|
||||
// Select second
|
||||
target = picker.find('.datepicker-days tbody td:nth(15)');
|
||||
equal(target.text(), '12'); // Mar 12
|
||||
|
||||
target.click();
|
||||
datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 12), '2012-03-12 in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 12));
|
||||
equal(input.val(), '2012-03-04,2012-03-12');
|
||||
|
||||
// Select third
|
||||
target = picker.find('.datepicker-days tbody td:nth(20)');
|
||||
equal(target.text(), '17'); // Mar 17
|
||||
|
||||
target.click();
|
||||
datesEqual(dp.dates.get(-1), UTCDate(2012, 2, 17), '2012-03-17 in dates');
|
||||
ok(dp.dates.contains(UTCDate(2012, 2, 4)) === -1, '2012-03-04 no longer in dates');
|
||||
datesEqual(dp.viewDate, UTCDate(2012, 2, 17));
|
||||
equal(input.val(), '2012-03-12,2012-03-17');
|
||||
});
|
||||
|
||||
test('Multidate Separator', function(){
|
||||
var input = $('<input />')
|
||||
.appendTo('#qunit-fixture')
|
||||
.val('2012-03-05')
|
||||
.datepicker({
|
||||
format: 'yyyy-mm-dd',
|
||||
multidate: true,
|
||||
multidateSeparator: ' '
|
||||
}),
|
||||
dp = input.data('datepicker'),
|
||||
picker = dp.picker,
|
||||
target;
|
||||
|
||||
input.focus();
|
||||
|
||||
// Select first
|
||||
target = picker.find('.datepicker-days tbody td:nth(7)');
|
||||
equal(target.text(), '4'); // Mar 4
|
||||
|
||||
target.click();
|
||||
equal(input.val(), '2012-03-05 2012-03-04');
|
||||
|
||||
// Select second
|
||||
target = picker.find('.datepicker-days tbody td:nth(15)');
|
||||
equal(target.text(), '12'); // Mar 12
|
||||
|
||||
target.click();
|
||||
equal(input.val(), '2012-03-05 2012-03-04 2012-03-12');
|
||||
});
|
||||
Reference in new issue
Block a user