dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
225 lines (211 loc) • 8.92 kB
HTML
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<meta name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<title>ValuePickerDatePicker</title>
<script type="text/javascript"
src="../../../deviceTheme.js" data-dojo-config="mblThemeFiles: ['base','ValuePicker']"></script>
<script type="text/javascript"
src="../../../../../dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: true"></script>
<script type="text/javascript">
var onYearSet, onMonthSet, onDaySet;
require([
"dojo/ready", "dijit/registry", "doh/runner",
"dojox/mobile", "dojox/mobile/compat", "dojox/mobile/parser",
"dojox/mobile/ValuePickerDatePicker"],
function(ready, registry, runner){
var onYearSetCounter = 0, onMonthSetCounter = 0, onDaySetCounter = 0,
yearWatchCounter = 0, monthWatchCounter = 0, dayWatchCounter = 0;
var initCounters, checkCounters;
onYearSet = function(){
onYearSetCounter++;
};
onMonthSet = function(){
onMonthSetCounter++;
};
onDaySet = function(){
onDaySetCounter++;
};
var initCounters = function(){
onYearSetCounter = onMonthSetCounter = onDaySetCounter = 0;
yearWatchCounter = monthWatchCounter = dayWatchCounter = 0;
};
ready(function(){
var picker = registry.byId("picker1"),
yearSlot = picker.slots[0],
monthSlot = picker.slots[1],
daySlot = picker.slots[2];
yearSlot.watch("value", function(name, oldVal, newVal){
yearWatchCounter++;
});
monthSlot.watch("value", function(name, oldVal, newVal){
monthWatchCounter++;
});
daySlot.watch("value", function(name, oldVal, newVal){
dayWatchCounter++;
});
var showCounters = function(txt){
// Just for debugging.
console.log("==============================");
if(txt) console.log(txt + ":");
console.log("yearSetCounter: " + onYearSetCounter);
console.log("monthSetCounter: " + onMonthSetCounter);
console.log("daySetCounter: " + onDaySetCounter);
console.log("yearWatchCounter: " + yearWatchCounter);
console.log("monthWatchCounter: " + monthWatchCounter);
console.log("dayWatchCounter: " + dayWatchCounter);
console.log("==============================");
};
var checkCounters = function(
expectedOnYearSetCounter, expectedOnMonthSetCounter, expectedOnDaySetCounter,
expectedYearWatchCounter, expectedMonthWatchCounter, expectedDayWatchCounter){
// showCounters();
runner.assertEqual(expectedOnYearSetCounter, onYearSetCounter, "Unexpected onYearSetCounter");
runner.assertEqual(expectedOnMonthSetCounter, onMonthSetCounter, "Unexpected onMonthSetCounter");
runner.assertEqual(expectedOnDaySetCounter, onDaySetCounter, "Unexpected onDaySetCounter");
runner.assertEqual(expectedYearWatchCounter, yearWatchCounter, "Unexpected yearWatchCounter");
runner.assertEqual(expectedMonthWatchCounter, monthWatchCounter, "Unexpected monthWatchCounter");
runner.assertEqual(expectedDayWatchCounter, dayWatchCounter, "Unexpected dayWatchCounter");
};
var checkSlotValues = function(expectedYear, expectedMonth, expectedDay){
runner.assertEqual(expectedYear, picker.slots[0].get("value"), "Unexpected value of year slot");
runner.assertEqual(expectedDay, picker.slots[2].get("value"), "Unexpected value of day slot");
// For the month, note that the label (and value) of the month slot is
// localized, and is also browser-dependant (for instance, on IE8 in English
// locale, the value for the fifth month is "may", while on other browsers
// it is "May". Hence, in this test, instead of comparing directly the
// value of the slot with a given string ("May"), we start from the month
// number and we compare the current value of the slot with the label
// at the corresponding index. Thus the test is independent on locale
// and browser localization of month names.
var monthSlot = picker.slots[1];
var expectedMonthLabel = monthSlot.labels[expectedMonth - 1];
runner.assertEqual(expectedMonthLabel, monthSlot.get("value"), "Unexpected value of month slot");
};
var checkEndDaysOfMonth = function(nDaysInMonth, title){
var daySlot = picker.slots[2];
runner.assertEqual(nDaysInMonth, daySlot.items.length, title);
};
// Test case for #16502
runner.register("dojox.mobile.test.doh.SpinWheelTests", [
{
name: "SpinWheelTest1",
timeout: 4000,
runTest: function(){
picker.set('value', '2020-06-06');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
var d = new runner.Deferred();
setTimeout(function(){
initCounters();
// ensure year, month, and day change:
picker.set('value', '2019-05-05');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
setTimeout(d.getTestCallback(function(){
// notifications for year, month and day
checkCounters(1, 1, 1, 1, 1, 1);
checkSlotValues("2019", 5/*"May"*/, "5");
}), 1000);
}, 1000);
return d;
}
},
{
name: "SpinWheelTest2",
timeout: 4000,
runTest: function(){
picker.set('value', '2020-06-06');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
var d = new runner.Deferred();
setTimeout(function(){
initCounters();
// now only the year changes
picker.set('value', '2021-06-06');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
setTimeout(d.getTestCallback(function(){
// notifications for year, not for month and day
checkCounters(1, 0, 0, 1, 0, 0);
checkSlotValues("2021", 6/*"Jun"*/, "6");
}), 1000);
}, 1000);
return d;
}
},
{
name: "SpinWheelTest3",
timeout: 4000,
runTest: function(){
picker.set('value', '2013-01-31');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
var d = new runner.Deferred();
setTimeout(function(){
initCounters();
// now change the month from Jan to Feb
// The labels/values being localized, let's set
var februaryLabel = picker.slots[1].labels[1]; // the second label is for February
picker.slots[1].set("value", februaryLabel);
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
setTimeout(d.getTestCallback(function(){
// notifications for month and day, not for year
checkCounters(0, 1, 1, 0, 1, 1);
// Check that changing the month also changes the day value
// to the last day of Feb. 2012 (leap year, hence last day is 29).
checkSlotValues("2013", 2/*"Feb"*/, "28");
checkEndDaysOfMonth(28, "SpinWheelTest3"); // grayed out starting with day 29
}), 1000);
}, 1000);
return d;
}
},
{
name: "SpinWheelTest4",
timeout: 4000,
runTest: function(){
picker.set('value', '2012-02-29');
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
var d = new runner.Deferred();
setTimeout(function(){
initCounters();
// now change the year to 2013
picker.slots[0].set("value", "2013");
// setTimeout used because the handlers onYearSet, onMonthSet
// and onDaySet are called asynchronously
setTimeout(d.getTestCallback(function(){
// notifications for year and day, not for month
checkCounters(1, 0, 1, 1, 0, 1);
// Check that changing the year also changes the day value
// to the last day of Feb. 2013 (non leap year, hence last day is 28).
checkSlotValues("2013", 2/*"Feb"*/, "28");
checkEndDaysOfMonth(28, "SpinWheelTest4"); // grayed out starting with day 29
}), 1000);
}, 1000);
return d;
}
}
]);
runner.run();
});
});
</script>
</head>
<body style="visibility:hidden;">
<div data-dojo-type="dojox/mobile/View">
<form>
<div data-dojo-type="dojox/mobile/Heading">
SpinWheel
</div>
<div id="picker1" data-dojo-type="dojox/mobile/ValuePickerDatePicker"
data-dojo-props="onYearSet: onYearSet, onMonthSet: onMonthSet, onDaySet: onDaySet"></div>
</form>
</div>
</body>
</html>