Fixed all time-picker issues and covered it with tests.

apps/pickers-demo/main-page.ts

@@ -26,9 +26,12 @@ export function onPageLoaded(args: observableModule.EventData) {
     viewModel.items = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
     viewModel.selectedIndex = 5;
 
-    //viewModel.day = 9;
-    //viewModel.month = 2;
-    //viewModel.year = 1980;
+    viewModel.day = 9;
+    viewModel.month = 2;
+    viewModel.year = 1980;
+
+    viewModel.hour = 17;
+    viewModel.minute = 50;
 }
 
 export function onTap(args: observableModule.EventData) {
@@ -40,4 +43,7 @@ export function onTap(args: observableModule.EventData) {
     viewModel.day = viewModel.day + 1;
     viewModel.month = viewModel.month + 1;
     viewModel.year = viewModel.year + 1;
+
+    viewModel.hour = viewModel.hour + 1;
+    viewModel.minute = viewModel.minute + 1;
 }

apps/pickers-demo/main-page.xml

@@ -4,6 +4,6 @@
     <Label id="label" text="{{ selectedIndex }}" height="50" width="100" />
     <ListPicker id="listPicker" selectedIndex="{{ selectedIndex }}" items="{{ items }}"/>
     <DatePicker id="datePicker" day="{{ day }}" month="{{ month }}" year="{{ year }}"/>
-    <TimePicker id="timePicker"/>
+    <TimePicker id="timePicker" hour="{{ hour }}" minute="{{ minute }}"/>
   </StackLayout>
 </Page>

apps/pickers-demo/model.ts

@@ -54,4 +54,24 @@ export class WebViewModel extends observable.Observable {
         this._year = value;
         this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "year", value: value });
     }
+
+    private _hour: number;
+    get hour(): number {
+        return this._hour;
+    }
+    set hour(value: number) {
+        console.log("hour:" + value);
+        this._hour = value;
+        this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "hour", value: value });
+    }
+
+    private _minute: number;
+    get minute(): number {
+        return this._minute;
+    }
+    set minute(value: number) {
+        console.log("minute:" + value);
+        this._minute = value;
+        this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "minute", value: value });
+    }
 }

apps/tests/testRunner.ts

@@ -49,6 +49,7 @@ allTests["FILE-SYSTEM-ACCESS"] = require("./file-system-access-tests/file-system
 allTests["XML-DECLARATION"] = require("./xml-declaration/xml-declaration-tests");
 allTests["LIST-PICKER"] = require("./ui/list-picker/list-picker-tests");
 allTests["DATE-PICKER"] = require("./ui/date-picker/date-picker-tests");
+allTests["TIME-PICKER"] = require("./ui/time-picker/time-picker-tests");
 
 var testsWithLongDelay = {
     testLocation: 10000,

apps/tests/ui/time-picker/time-picker-tests-native.android.ts

@@ -0,0 +1,17 @@
+import timePickerModule = require("ui/time-picker");
+
+export function getNativeHour(timePicker: timePickerModule.TimePicker): number {
+    return timePicker.android.getCurrentHour().intValue();
+}
+
+export function getNativeMinute(timePicker: timePickerModule.TimePicker): number {
+    return timePicker.android.getCurrentMinute().intValue();
+}
+
+export function setNativeHour(timePicker: timePickerModule.TimePicker, value: number): void {
+    timePicker.android.setCurrentHour(new java.lang.Integer(value));
+}
+
+export function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void {
+    timePicker.android.setCurrentMinute(new java.lang.Integer(value));
+}

apps/tests/ui/time-picker/time-picker-tests-native.d.ts

@@ -0,0 +1,8 @@
+//@private
+import timePickerModule = require("ui/time-picker");
+
+export declare function getNativeHour(timePicker: timePickerModule.TimePicker): number;
+export declare function getNativeMinute(timePicker: timePickerModule.TimePicker): number;
+
+export declare function setNativeHour(timePicker: timePickerModule.TimePicker, value: number): void;
+export declare function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void;

apps/tests/ui/time-picker/time-picker-tests-native.ios.ts

@@ -0,0 +1,24 @@
+import timePickerModule = require("ui/time-picker");
+
+export function getNativeHour(timePicker: timePickerModule.TimePicker): number {
+    return NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitHour | NSCalendarUnit.NSCalendarUnitMinute, timePicker.ios.date).hour;
+}
+
+export function getNativeMinute(timePicker: timePickerModule.TimePicker): number {
+    return NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitHour | NSCalendarUnit.NSCalendarUnitMinute, timePicker.ios.date).minute;
+}
+
+export function setNativeHour(timePicker: timePickerModule.TimePicker, value: number): void {
+    var comps = NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitHour | NSCalendarUnit.NSCalendarUnitMinute, timePicker.ios.date);
+    comps.hour = value;
+    timePicker.ios.setDateAnimated(NSCalendar.currentCalendar().dateFromComponents(comps), false);
+    (<any>timePicker)._changeHandler.valueChanged(timePicker.ios);
+}
+
+export function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void {
+    var comps = NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitHour | NSCalendarUnit.NSCalendarUnitMinute, timePicker.ios.date);
+    comps.minute = value;
+    timePicker.ios.setDateAnimated(NSCalendar.currentCalendar().dateFromComponents(comps), false);
+    (<any>timePicker)._changeHandler.valueChanged(timePicker.ios);
+}
+    

apps/tests/ui/time-picker/time-picker-tests.ts

@@ -0,0 +1,80 @@
+import TKUnit = require("../../TKUnit");
+import helper = require("../helper");
+import viewModule = require("ui/core/view");
+import timePickerTestsNative = require("./time-picker-tests-native");
+
+// <snippet module="ui/time-picker" title="timePicker">
+// # timePicker
+
+// Using a timePicker requires the "ui/time-picker" module.
+// ``` JavaScript
+import timePickerModule = require("ui/time-picker");
+
+function _createtimePicker(): timePickerModule.TimePicker {
+    // <snippet module="ui/time-picker" title="timePicker">
+    // ## Creating a timePicker
+    // ``` JavaScript
+    var timePicker = new timePickerModule.TimePicker();
+    // ```
+    // </snippet>
+    timePicker.id = "timePicker";
+    return timePicker;
+}
+
+export var test_WhenCreated_HourIsUndefined = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var actualValue = timePicker.hour;
+        var expectedValue = undefined;
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}
+
+export var test_WhenCreated_MinuteIsUndefined = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var actualValue = timePicker.minute;
+        var expectedValue = undefined;
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}
+
+export var testHourFromLocalToNative = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var expectedValue = 13;
+        timePicker.hour = expectedValue;
+        var actualValue = timePickerTestsNative.getNativeHour(timePicker);
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}
+
+export var testMinuteFromLocalToNative = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var expectedValue = 59;
+        timePicker.minute = expectedValue;
+        var actualValue = timePickerTestsNative.getNativeMinute(timePicker);
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}
+
+export var testHourFromNativeToLocal = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var expectedValue = 14;
+        timePickerTestsNative.setNativeHour(timePicker, expectedValue);
+        var actualValue = timePicker.hour;
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}
+
+export var testMinuteFromNativeToLocal = function () {
+    helper.buildUIAndRunTest(_createtimePicker(), function (views: Array<viewModule.View>) {
+        var timePicker = <timePickerModule.TimePicker>views[0];
+        var expectedValue = 33;
+        timePickerTestsNative.setNativeMinute(timePicker, expectedValue);
+        var actualValue = timePicker.minute;
+        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+    });
+}