由gopath形式改为module

This commit is contained in:
kongyuebin
2021-04-27 15:33:49 +08:00
parent aef4dbb33c
commit 77d895e83a
1117 changed files with 332447 additions and 20 deletions

View File

@@ -0,0 +1,179 @@
module('Component', {
setup: function(){
this.component = $('<div class="input-group date" id="datetimepicker">'+
'<input size="16" type="text" value="12-02-2012" readonly>'+
'<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>'+
'</div>')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy", viewSelect: 2});
this.input = this.component.find('input');
this.addon = this.component.find('.input-group-addon');
this.dp = this.component.data('datetimepicker');
this.picker = this.dp.picker;
},
teardown: function(){
this.picker.remove();
}
});
test('Component gets date/viewDate from input value', function(){
datesEqual(this.dp.date, 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, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'February 2012', 'Title is "February 2012"');
datesEqual(this.dp.date, 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.date, UTCDate(2012, 1, 11));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2012, 2, 11));
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2011, 2, 11));
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2011', 'Title is "March 2011"');
});
test('setValue', function(){
this.dp.date = UTCDate(2012, 2, 13)
this.dp.setValue()
datesEqual(this.dp.date, UTCDate(2012, 2, 13));
equal(this.input.val(), '13-03-2012');
});
test('update', function(){
this.input.val('13-03-2012');
this.dp.update()
datesEqual(this.dp.date, 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, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
target = this.picker.find('.datetimepicker-months thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-years').is(':visible'), 'Year picker is visible');
equal(this.dp.viewMode, 4);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Change years to test internal state changes
target = this.picker.find('.datetimepicker-years tbody span:contains(2011)');
target.click();
equal(this.dp.viewMode, 3);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
target = this.picker.find('.datetimepicker-months tbody span:contains(Apr)');
target.click();
equal(this.dp.viewMode, 2);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
datesEqual(this.dp.date, 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, 2);
target = this.picker.find('.datetimepicker-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.date, UTCDate(2012, 1, 26))
// Re-rendered on click
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '29'); // Should be Jan 29
});
test('Highlight in month', function() {
// custom setup for specifically bootstrap 2
var component = $('<div class="input-group date" id="datetimepicker">' +
'<input size="16" type="text" value="12-02-2012" readonly>' +
'<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>' +
'</div>')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy", bootcssVer: 2}),
addon = component.find('.input-group-addon'),
picker = component.data('datetimepicker').picker;
addon.click();
equal(picker.find('.datetimepicker-months .month.active').text(), 'Feb');
picker.remove();
// test bootstrap 3 as well
this.addon.click();
equal(this.picker.find('.datetimepicker-months .month.active').text(), 'Feb');
});

View File

@@ -0,0 +1,80 @@
module('Events', {
setup: function(){
this.input = $('<input type="text" value="31-03-2011">')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy"})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
this.picker = this.dp.picker;
},
teardown: function(){
this.picker.remove();
}
});
test('Selecting a year from decade view triggers pickYear', function(){
var target,
triggered = 0;
this.input.on('changeYear', function(){
triggered++;
});
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
target = this.picker.find('.datetimepicker-months thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-years').is(':visible'), 'Year picker is visible');
equal(this.dp.viewMode, 4);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
// Change years to test internal state changes
target = this.picker.find('.datetimepicker-years tbody span:contains(2010)');
target.click();
equal(this.dp.viewMode, 3);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2010, 2, 1));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
equal(triggered, 1);
});
test('Selecting a month from year view triggers pickMonth', function(){
var target,
triggered = 0;
this.input.on('changeMonth', function(){
triggered++;
});
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
target = this.picker.find('.datetimepicker-months tbody span:contains(Apr)');
target.click();
equal(this.dp.viewMode, 2);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
equal(triggered, 1);
});

View File

@@ -0,0 +1,256 @@
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('datetimepicker').picker.remove();
}
});
test('d: Day of month, no leading zero.', function(){
this.input
.val('2012-03-05')
.datetimepicker({format: 'yyyy-mm-d'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[2], '5');
});
test('dd: Day of month, leading zero.', function(){
this.input
.val('2012-03-5')
.datetimepicker({format: 'yyyy-mm-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[2], '05');
});
test('m: Month, no leading zero.', function(){
this.input
.val('2012-03-05')
.datetimepicker({format: 'yyyy-m-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[1], '3');
});
test('mm: Month, leading zero.', function(){
this.input
.val('2012-3-5')
.datetimepicker({format: 'yyyy-mm-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[1], '03');
});
test('M: Month shortname.', function(){
this.input
.val('2012-Mar-05')
.datetimepicker({format: 'yyyy-M-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[1], 'Mar');
});
test('MM: Month full name.', function(){
this.input
.val('2012-March-5')
.datetimepicker({format: 'yyyy-MM-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[1], 'March');
});
test('yy: Year, two-digit.', function(){
this.input
.val('2012-03-05')
.datetimepicker({format: 'yy-mm-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[0], '12');
});
test('yyyy: Year, four-digit.', function(){
this.input
.val('2012-03-5')
.datetimepicker({format: 'yyyy-mm-dd'})
.datetimepicker('setValue');
equal(this.input.val().split('-')[0], '2012');
});
test('H: 12 hour when language has meridiems', function(){
this.input
.val('2012-March-5 16:00:00')
.datetimepicker({format: 'yyyy-mm-dd H:ii p'})
.datetimepicker('setValue');
ok(this.input.val().match(/4:00 pm/));
});
test('H: 24 hour when language has no meridiems', function(){
$.fn.datetimepicker.dates['pt-BR'] = {
days: ["Domingo", "Segunda", "Terça", "Quarta", "Quinta", "Sexta", "Sábado", "Domingo"],
daysShort: ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb", "Dom"],
daysMin: ["Do", "Se", "Te", "Qu", "Qu", "Se", "Sa", "Do"],
months: ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"],
monthsShort: ["Jan", "Fev", "Mar", "Abr", "Mai", "Jun", "Jul", "Ago", "Set", "Out", "Nov", "Dez"],
today: "Hoje",
suffix: [],
meridiem: []
};
this.input
.val('2012-March-5 16:00:00')
.datetimepicker({format: 'yyyy-mm-dd H:ii p', language: 'pt-BR'})
.datetimepicker('setValue');
ok(this.input.val().match(/16:00/));
});
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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('setValue');
equal(this.input.val(), '31-03-2012');
});
test('dd-mm-yyyy: Leap day', function(){
this.input
.val('29-02-2012')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('setValue');
equal(this.input.val(), '29-02-2012');
});
test('yyyy-mm-dd: Alternative format', function(){
this.input
.val('2012-02-12')
.datetimepicker({format: 'yyyy-mm-dd'})
.datetimepicker('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')
.datetimepicker({format: 'yyyy-MM-dd'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'dd-mm-yyyy'})
.datetimepicker('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')
.datetimepicker({format: 'yyyy-MM-dd'})
.focus();
this.input.trigger({
type: 'keydown',
keyCode: 9
});
equal(this.input.val(), '56-September-30');
}));
test('Untrimmed datetime value', patch_date(function(Date){
this.input
.val('2012-03-05 ')
.datetimepicker({format: 'yyyy-mm-dd hh:ii'})
.datetimepicker('setValue');
equal(this.input.val(), '2012-03-05 00:00');
}));
test('With timezone option', patch_date(function(Date){
this.input
.val('2012-03-05')
.datetimepicker({format: 'yyyy-mm-dd hh:ii P Z'})
.datetimepicker('setValue');
equal(this.input.val(), '2012-03-05 00:00 AM UTC');
}));

View File

@@ -0,0 +1,28 @@
module('Inline', {
setup: function(){
this.component = $('<div data-date="12-02-2012"></div>')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy"});
this.dp = this.component.data('datetimepicker')
this.picker = this.dp.picker;
},
teardown: function(){
this.picker.remove();
}
});
test('Picker gets date/viewDate from data-date attr', function(){
datesEqual(this.dp.date, 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.date, UTCDate(2012, 2, 13));
});

View File

@@ -0,0 +1,86 @@
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')
.datetimepicker({format: "dd-mm-yyyy"})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
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').datetimepicker('update');
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2011', 'Title is "March 2011"');
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 6));
datesEqual(this.dp.date, UTCDate(2011, 2, 6));
// Navigation: -1 week, up arrow key
this.input.trigger({
type: 'keydown',
keyCode: 38
});
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 27));
datesEqual(this.dp.date, UTCDate(2011, 1, 27));
target = this.picker.find('.datetimepicker-days thead th.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').datetimepicker('update');
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2011', 'Title is "March 2011"');
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
datesEqual(this.dp.date, UTCDate(2011, 2, 1));
// Navigation: -1 day left arrow key
this.input.trigger({
type: 'keydown',
keyCode: 37
});
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 28));
datesEqual(this.dp.date, UTCDate(2011, 1, 28));
target = this.picker.find('.datetimepicker-days thead th.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').datetimepicker('update');
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2011', 'Title is "March 2011"');
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 15));
datesEqual(this.dp.date, UTCDate(2011, 2, 15));
// 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.date, UTCDate(2011, 1, 15));
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'February 2011', 'Title is "February 2011"');
});

View File

@@ -0,0 +1,410 @@
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')
.datetimepicker({format: "dd-mm-yyyy", minView: 2, autoclose: true})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
this.picker = this.dp.picker;
},
teardown: function(){
this.picker.remove();
}
});
test('by day (right/left arrows)', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2012', 'Title is "March 2012"');
// Navigation: -1 day, left arrow key
this.input.trigger({
type: 'keydown',
keyCode: 37
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
datesEqual(this.dp.date, UTCDate(2012, 2, 30));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2012, 3, 1));
// Month changed: April 1 (this is not a joke!)
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'April 2012', 'Title is "April 2012"');
});
test('by week (up/down arrows)', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2012', 'Title is "March 2012"');
// Navigation: -1 week, up arrow key
this.input.trigger({
type: 'keydown',
keyCode: 38
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 24));
datesEqual(this.dp.date, UTCDate(2012, 2, 24));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2012, 3, 7));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation, w/ graceful date ends
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
datesEqual(this.dp.date, UTCDate(2012, 1, 29));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2012, 3, 29));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation, w/ graceful date ends
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
datesEqual(this.dp.date, UTCDate(2012, 1, 29));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2012, 3, 29));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2013, 2, 31));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2013, 2, 31));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2013, 2, 31));
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2011, 2, 31));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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.date, UTCDate(2013, 2, 31));
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2013', 'Title is "March 2013"');
});
test('by year, from leap day', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
this.input.val('29-02-2012').datetimepicker('update');
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
datesEqual(this.dp.date, UTCDate(2012, 1, 29));
equal(target.text(), 'February 2012', 'Title is "February 2012"');
// Navigation: -1 year
this.input.trigger({
type: 'keydown',
keyCode: 37,
ctrlKey: true
});
// Both updated on keyboard navigation; graceful month-end
datesEqual(this.dp.viewDate, UTCDate(2011, 1, 28));
datesEqual(this.dp.date, UTCDate(2011, 1, 28));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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
});
// Both updated on keyboard navigation; graceful month-end
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 28));
datesEqual(this.dp.date, UTCDate(2012, 1, 28));
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'February 2012', 'Title is "February 2012"');
// Navigation: +1 year
this.input.trigger({
type: 'keydown',
keyCode: 39,
ctrlKey: true
});
// Both updated on keyboard navigation; graceful month-end
datesEqual(this.dp.viewDate, UTCDate(2013, 1, 28));
datesEqual(this.dp.date, UTCDate(2013, 1, 28));
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'February 2013', 'Title is "February 2013"');
});
test('Selection (enter)', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2012', 'Title is "March 2012"');
// Navigation: -1 day, left arrow key
this.input.trigger({
type: 'keydown',
keyCode: 37
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
datesEqual(this.dp.date, UTCDate(2012, 2, 30));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.switch');
equal(target.text(), 'March 2012', 'Title is "March 2012"');
// Selection: Enter
this.input.trigger({
type: 'keydown',
keyCode: 13
});
// Both updated on keyboard navigation
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 30));
datesEqual(this.dp.date, UTCDate(2012, 2, 30));
// Month not changed
target = this.picker.find('.datetimepicker-days thead th.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, 2);
target = this.picker.find('.datetimepicker-days thead th.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.date, 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.date, 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.date, UTCDate(2012, 2, 31));
});

View File

@@ -0,0 +1,26 @@
module('Keyboard Navigation (All)', {
setup: function(){
this.input = $('<input type="text">')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy"})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
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');
});

View File

@@ -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')
.datetimepicker({format: "dd-mm-yyyy", viewSelect: 2})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
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.date, UTCDate(2011, 0, 1))
// Rendered correctly
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '26'); // Should be Dec 26
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'January 2011');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'December 2010');
datesEqual(this.dp.viewDate, UTCDate(2010, 11, 26))
datesEqual(this.dp.date, UTCDate(2010, 11, 26))
// Re-rendered on click
target = this.picker.find('.datetimepicker-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.date, UTCDate(2010, 11, 1))
// Rendered correctly
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days tbody td:last');
equal(target.text(), '8'); // Should be Jan 8
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'December 2010');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'January 2011');
datesEqual(this.dp.viewDate, UTCDate(2011, 0, 8))
datesEqual(this.dp.date, UTCDate(2011, 0, 8))
// Re-rendered on click
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '26'); // Should be Dec 26
});

View File

@@ -0,0 +1,295 @@
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')
.datetimepicker({format: "dd-mm-yyyy", viewSelect: 2})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
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, 2);
target = this.picker.find('.datetimepicker-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.date, UTCDate(2012, 2, 4))
// Re-rendered on click
target = this.picker.find('.datetimepicker-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, 2);
target = this.picker.find('.datetimepicker-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.date, UTCDate(2012, 2, 31));
// Re-rendered on click
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '29'); // Should be Jan 29
target = this.picker.find('.datetimepicker-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.date, UTCDate(2012, 2, 31));
// Re-rendered on click
target = this.picker.find('.datetimepicker-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, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Change months to test internal state
target = this.picker.find('.datetimepicker-months tbody span:contains(Apr)');
target.click();
equal(this.dp.viewMode, 2);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2012, 3, 1)); // Apr 30
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
});
test('Navigating to/from decade view', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
target = this.picker.find('.datetimepicker-months thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-years').is(':visible'), 'Year picker is visible');
equal(this.dp.viewMode, 4);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Change years to test internal state changes
target = this.picker.find('.datetimepicker-years tbody span:contains(2011)');
target.click();
equal(this.dp.viewMode, 3);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 1));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
target = this.picker.find('.datetimepicker-months tbody span:contains(Apr)');
target.click();
equal(this.dp.viewMode, 2);
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 3, 1));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
});
test('Navigating prev/next in year view', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
equal(this.picker.find('.datetimepicker-months thead th.switch').text(), '2012');
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Go to next year (2013)
target = this.picker.find('.datetimepicker-months thead th.next');
target.click();
equal(this.picker.find('.datetimepicker-months thead th.switch').text(), '2013');
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2013, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Go to prev year (x2 == 2011)
target = this.picker.find('.datetimepicker-months thead th.prev');
target.click().click();
equal(this.picker.find('.datetimepicker-months thead th.switch').text(), '2011');
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2011, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
});
test('Navigating prev/next in decade view', function(){
var target;
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-months').is(':visible'), 'Month picker is visible');
equal(this.dp.viewMode, 3);
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
target = this.picker.find('.datetimepicker-months thead th.switch');
ok(target.is(':visible'), 'View switcher is visible');
target.click();
ok(this.picker.find('.datetimepicker-years').is(':visible'), 'Year picker is visible');
equal(this.dp.viewMode, 4);
equal(this.picker.find('.datetimepicker-years thead th.switch').text(), '2010-2019');
// Not modified when switching modes
datesEqual(this.dp.viewDate, UTCDate(2012, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Go to next decade (2020-29)
target = this.picker.find('.datetimepicker-years thead th.next');
target.click();
equal(this.picker.find('.datetimepicker-years thead th.switch').text(), '2020-2029');
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2022, 2, 31));
datesEqual(this.dp.date, UTCDate(2012, 2, 31));
// Go to prev year (x2 == 2000-09)
target = this.picker.find('.datetimepicker-years thead th.prev');
target.click().click();
equal(this.picker.find('.datetimepicker-years thead th.switch').text(), '2000-2009');
// Only viewDate modified
datesEqual(this.dp.viewDate, UTCDate(2002, 2, 31));
datesEqual(this.dp.date, 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, 2);
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '26'); // Should be Feb 26
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'March 2012');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'February 2012');
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 26))
datesEqual(this.dp.date, UTCDate(2012, 1, 26))
// Re-rendered on click
target = this.picker.find('.datetimepicker-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, 2);
target = this.picker.find('.datetimepicker-days tbody td:last');
equal(target.text(), '5'); // Should be May 5
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'April 2012');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'May 2012');
datesEqual(this.dp.viewDate, UTCDate(2012, 4, 5))
datesEqual(this.dp.date, UTCDate(2012, 4, 5))
// Re-rendered on click
target = this.picker.find('.datetimepicker-days tbody td:first');
equal(target.text(), '29'); // Should be Apr 29
});
test('Selecting date from next month when the current month has 31 days resets viewDate and date, changing month displayed to the following month', function(){
var target;
// use Date AND Time mode
this.dp.viewSelect = 0;
this.input.val('2012-01-31');
this.dp.update();
equal(this.picker.find('.datetimepicker-days tbody td.day.active').text(), '31');
// Rendered correctly
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days tbody td:last');
equal(target.text(), '4');
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'January 2012');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'February 2012');
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 4));
});
test('Selecting date from previous month when the current month has 31 days resets viewDate and date, changing month displayed to the preceding month', function(){
var target;
// use Date AND Time mode
this.dp.viewSelect = 0;
this.input.val('2012-03-31');
this.dp.update();
equal(this.picker.find('.datetimepicker-days tbody td.day.active').text(), '31');
// Rendered correctly
equal(this.dp.viewMode, 2);
target = this.picker.find('.datetimepicker-days tbody td.old:last');
equal(target.text(), '29');
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'March 2012');
// Updated internally on click
target.click();
equal(this.picker.find('.datetimepicker-days thead th.switch').text(), 'February 2012');
datesEqual(this.dp.viewDate, UTCDate(2012, 1, 29));
});

View File

@@ -0,0 +1,33 @@
module('Mouse Navigation (All)', {
setup: function(){
this.input = $('<input type="text">')
.appendTo('#qunit-fixture')
.datetimepicker({format: "dd-mm-yyyy"})
.focus(); // Activate for visibility checks
this.dp = this.input.data('datetimepicker')
this.picker = this.dp.picker;
},
teardown: function(){
this.picker.remove();
}
});
test('Clicking datetimepicker does not hide datetimepicker', 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 datetimepicker hides datetimepicker', 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();
});

View File

@@ -0,0 +1,396 @@
module('Options', {
setup: function(){},
teardown: function(){
return
$('#qunit-fixture *').each(function(){
var t = $(this);
if ('datetimepicker' in t.data())
t.data('datetimepicker').picker.remove();
});
}
});
test('Autoclose', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd',
autoclose: true,
minView: 2,
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.is(':visible'), 'Picker is visible');
target = picker.find('.datetimepicker-days tbody td:nth(7)');
equal(target.text(), '4'); // Mar 4
target.click();
ok(picker.is(':not(:visible)'), 'Picker is hidden');
datesEqual(dp.date, 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')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 3,
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':not(:visible)'), 'Days view hidden');
ok(picker.find('.datetimepicker-months').is(':visible'), 'Months view visible');
ok(picker.find('.datetimepicker-years').is(':not(:visible)'), 'Years view hidden');
});
test('Startview: year view (string)', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 'year',
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':not(:visible)'), 'Days view hidden');
ok(picker.find('.datetimepicker-months').is(':visible'), 'Months view visible');
ok(picker.find('.datetimepicker-years').is(':not(:visible)'), 'Years view hidden');
});
test('Startview: decade view (integer)', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 4
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':not(:visible)'), 'Days view hidden');
ok(picker.find('.datetimepicker-months').is(':not(:visible)'), 'Months view hidden');
ok(picker.find('.datetimepicker-years').is(':visible'), 'Years view visible');
});
test('Startview: decade view (string)', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 'decade'
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':not(:visible)'), 'Days view hidden');
ok(picker.find('.datetimepicker-months').is(':not(:visible)'), 'Months view hidden');
ok(picker.find('.datetimepicker-years').is(':visible'), 'Years view visible');
});
test('Today Button: today button not default', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd'
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
ok(picker.find('.datetimepicker-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')
.datetimepicker({
format: 'yyyy-mm-dd',
todayBtn: true
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
ok(picker.find('.datetimepicker-days tfoot .today').is(':visible'), 'Today button visible');
picker.find('.datetimepicker-days thead th.switch').click();
ok(picker.find('.datetimepicker-months').is(':visible'), 'Months view visible');
ok(picker.find('.datetimepicker-months tfoot .today').is(':visible'), 'Today button visible');
picker.find('.datetimepicker-months thead th.switch').click();
ok(picker.find('.datetimepicker-years').is(':visible'), 'Years view visible');
ok(picker.find('.datetimepicker-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')
.datetimepicker({
format: 'yyyy-mm-dd'
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
ok(picker.find('.datetimepicker-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')
.datetimepicker({
format: 'yyyy-mm-dd',
todayBtn: true
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
ok(picker.find('.datetimepicker-days tfoot .today').is(':visible'), 'Today button visible');
target = picker.find('.datetimepicker-days tfoot .today');
target.click();
var d = new Date(),
today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds());
datesEqual(dp.viewDate, today);
//datesEqual(dp.date, UTCDate(2012, 2, 5));
});
test('Today Button: "linked" selects today\'s date', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-03-05')
.datetimepicker({
format: 'yyyy-mm-dd',
todayBtn: "linked"
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
ok(picker.find('.datetimepicker-days tfoot .today').is(':visible'), 'Today button visible');
target = picker.find('.datetimepicker-days tfoot .today');
target.click();
var d = new Date(),
today = UTCDate(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds());
datesEqual(dp.viewDate, today);
datesEqual(dp.date, 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')
.datetimepicker({
format: 'yyyy-mm-dd'
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
equal(picker.find('.datetimepicker-days thead .switch').text(), 'March 2012', 'Title is "March 2012"');
target = picker.find('.datetimepicker-days tbody td:contains(15)');
ok(!target.hasClass('today'), 'Today is not marked with "today" class');
target = picker.find('.datetimepicker-days tbody td:contains(14)');
ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
target = picker.find('.datetimepicker-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')
.datetimepicker({
format: 'yyyy-mm-dd',
todayHighlight: true
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days').is(':visible'), 'Days view visible');
equal(picker.find('.datetimepicker-days thead .switch').text(), 'March 2012', 'Title is "March 2012"');
target = picker.find('.datetimepicker-days tbody td:contains(15)');
ok(target.hasClass('today'), 'Today is marked with "today" class');
target = picker.find('.datetimepicker-days tbody td:contains(14)');
ok(!target.hasClass('today'), 'Yesterday is not marked with "today" class');
target = picker.find('.datetimepicker-days tbody td:contains(16)');
ok(!target.hasClass('today'), 'Tomorrow is not marked with "today" class');
}));
test('DaysOfWeekDisabled', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2012-10-26')
.datetimepicker({
format: 'yyyy-mm-dd',
daysOfWeekDisabled: '1,5'
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
target = picker.find('.datetimepicker-days tbody td:nth(22)');
ok(target.hasClass('disabled'), 'Day of week is disabled');
target = picker.find('.datetimepicker-days tbody td:nth(24)');
ok(!target.hasClass('disabled'), 'Day of week is enabled');
target = picker.find('.datetimepicker-days tbody td:nth(26)');
ok(target.hasClass('disabled'), 'Day of week is disabled');
});
test('startDate: Custom value', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2013-01-25')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 2,
startDate: "2013-01-24 15:30",
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(2)').hasClass('disabled'), 'The previous day is disabled');
target = picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(4)')
ok(!target.hasClass('disabled'), 'The starting day is enabled');
target.click()
ok(picker.find('.datetimepicker-hours tbody span:nth(14)').hasClass('disabled'), 'The previous hour is disabled');
target = picker.find('.datetimepicker-hours tbody span:nth(15)')
ok(!target.hasClass('disabled'), 'The starting hour is enabled');
target.click()
ok(picker.find('.datetimepicker-minutes tbody span:nth(5)').hasClass('disabled'), 'The previous minute is disabled');
ok(!picker.find('.datetimepicker-minutes tbody span:nth(6)').hasClass('disabled'), 'The starting minute is enabled');
});
test('startDate: Custom value', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2013-01-25')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 2,
startDate: "2013-01-24 15:30",
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(3)').hasClass('disabled'), 'The previous day is disabled');
target = picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(4)')
ok(!target.hasClass('disabled'), 'The starting day is enabled');
target.click()
ok(picker.find('.datetimepicker-hours tbody span:nth(14)').hasClass('disabled'), 'The previous hour is disabled');
target = picker.find('.datetimepicker-hours tbody span:nth(15)')
ok(!target.hasClass('disabled'), 'The starting hour is enabled');
target.click()
ok(picker.find('.datetimepicker-minutes tbody span:nth(5)').hasClass('disabled'), 'The previous minute is disabled');
ok(!picker.find('.datetimepicker-minutes tbody span:nth(6)').hasClass('disabled'), 'The starting minute is enabled');
});
test('endDate: Custom value', function(){
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2013-01-25')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 2,
endDate: "2013-01-24 15:30",
viewSelect: 2
}),
dp = input.data('datetimepicker'),
picker = dp.picker,
target;
input.focus();
ok(picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(5)').hasClass('disabled'), 'The next day is disabled');
target = picker.find('.datetimepicker-days tbody tr:nth(3) td:nth(4)')
ok(!target.hasClass('disabled'), 'The last day is enabled');
target.click()
ok(picker.find('.datetimepicker-hours tbody span:nth(16)').hasClass('disabled'), 'The next hour is disabled');
target = picker.find('.datetimepicker-hours tbody span:nth(15)')
ok(!target.hasClass('disabled'), 'The last hour is enabled');
target.click()
ok(picker.find('.datetimepicker-minutes tbody span:nth(7)').hasClass('disabled'), 'The next minute is disabled');
ok(!picker.find('.datetimepicker-minutes tbody span:nth(6)').hasClass('disabled'), 'The last minute is enabled');
});
test('zIndex: set in options', function(){
var zIndex = 77;
var input = $('<input />')
.appendTo('#qunit-fixture')
.val('2013-01-25')
.datetimepicker({
format: 'yyyy-mm-dd',
startView: 2,
endDate: "2013-01-24 15:30",
viewSelect: 2,
zIndex: zIndex
}),
dp = input.data('datetimepicker'),
picker = dp.picker;
ok(parseInt(picker.css('z-index'), 10) == zIndex, 'has a value defined in the options');
});