mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-18 05:18:39 +08:00
Merge pull request #185 from NativeScript/sg-tests
segmented-bar tests & fixes
This commit is contained in:
@ -123,6 +123,14 @@
|
||||
<TypeScriptCompile Include="apps\tests\ui\dialogs\dialog-tests.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\image-cache\image-cache-tests.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\border\border-tests.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\segmented-bar\segmented-bar-tests-native.android.ts">
|
||||
<DependentUpon>segmented-bar-tests-native.d.ts</DependentUpon>
|
||||
</TypeScriptCompile>
|
||||
<TypeScriptCompile Include="apps\tests\ui\segmented-bar\segmented-bar-tests-native.d.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\segmented-bar\segmented-bar-tests-native.ios.ts">
|
||||
<DependentUpon>segmented-bar-tests-native.d.ts</DependentUpon>
|
||||
</TypeScriptCompile>
|
||||
<TypeScriptCompile Include="apps\tests\ui\segmented-bar\segmented-bar-tests.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\list-picker\list-picker-tests-native.d.ts" />
|
||||
<TypeScriptCompile Include="apps\tests\ui\list-picker\list-picker-tests-native.android.ts">
|
||||
<DependentUpon>list-picker-tests-native.d.ts</DependentUpon>
|
||||
@ -1475,7 +1483,7 @@
|
||||
<SaveServerSettingsInUserFile>False</SaveServerSettingsInUserFile>
|
||||
</WebProjectProperties>
|
||||
</FlavorProperties>
|
||||
<UserProperties ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" />
|
||||
<UserProperties ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" />
|
||||
</VisualStudio>
|
||||
</ProjectExtensions>
|
||||
</Project>
|
@ -0,0 +1,5 @@
|
||||
import segmentedBarModule = require("ui/segmented-bar");
|
||||
|
||||
export function getNativeItemsCount(bar: segmentedBarModule.SegmentedBar): number {
|
||||
return (<android.widget.TabHost>bar.android).getTabWidget().getTabCount();
|
||||
}
|
4
apps/tests/ui/segmented-bar/segmented-bar-tests-native.d.ts
vendored
Normal file
4
apps/tests/ui/segmented-bar/segmented-bar-tests-native.d.ts
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
//@private
|
||||
import segmentedBarModule = require("ui/segmented-bar");
|
||||
|
||||
export declare function getNativeItemsCount(bar: segmentedBarModule.SegmentedBar): number;
|
@ -0,0 +1,5 @@
|
||||
import segmentedBarModule = require("ui/segmented-bar");
|
||||
|
||||
export function getNativeItemsCount(bar: segmentedBarModule.SegmentedBar): number {
|
||||
return (<UISegmentedControl>bar.ios).numberOfSegments;
|
||||
}
|
171
apps/tests/ui/segmented-bar/segmented-bar-tests.ts
Normal file
171
apps/tests/ui/segmented-bar/segmented-bar-tests.ts
Normal file
@ -0,0 +1,171 @@
|
||||
import TKUnit = require("../../TKUnit");
|
||||
import helper = require("../helper");
|
||||
import viewModule = require("ui/core/view");
|
||||
import segmentedBarTestsNative = require("./segmented-bar-tests-native");
|
||||
|
||||
// <snippet module="ui/segmented-bar" title="SegmentedBar">
|
||||
// # SegmentedBar
|
||||
|
||||
// Using a SegmentedBar requires the "ui/segmented-bar" module.
|
||||
// ``` JavaScript
|
||||
import segmentedBarModule = require("ui/segmented-bar");
|
||||
|
||||
function _createSegmentedBar(): segmentedBarModule.SegmentedBar {
|
||||
// <snippet module="ui/segmented-bar" title="SegmentedBar">
|
||||
// ## Creating a SegmentedBar
|
||||
// ``` JavaScript
|
||||
var segmentedBar = new segmentedBarModule.SegmentedBar();
|
||||
// ```
|
||||
// </snippet>
|
||||
segmentedBar.id = "SegmentedBar";
|
||||
return segmentedBar;
|
||||
}
|
||||
|
||||
function _createItems(count: number): Array<segmentedBarModule.SegmentedBarItem> {
|
||||
var items = new Array<segmentedBarModule.SegmentedBarItem>();
|
||||
for (var i = 0; i < count; i++) {
|
||||
items.push({ title: i + "" });
|
||||
}
|
||||
return items;
|
||||
}
|
||||
|
||||
export var testWhenSegmentedBarIsCreatedItemsAreUndefined = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
var expectedValue = undefined;
|
||||
var actualValue = segmentedBar.items;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testWhenSegmentedBarIsCreatedSelectedIndexIsUndefined = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
var expectedValue = undefined;
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testWhenSettingItemsToNonEmptyArrayTheSameAmountOfNativeItemsIsCreated = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
var expectedValue = segmentedBar.items.length;
|
||||
var actualValue = segmentedBarTestsNative.getNativeItemsCount(segmentedBar);
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testWhenSettingItemsToEmptyArrayZeroNativeItemsAreCreated = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = [];
|
||||
var expectedValue = segmentedBar.items.length;
|
||||
var actualValue = segmentedBarTestsNative.getNativeItemsCount(segmentedBar);
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSelectedIndexBecomesZeroWhenItemsBoundToNonEmptyArray = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
// <snippet module="ui/segmented-bar" title="SegmentedBar">
|
||||
// ### Binding segmentedBar.items
|
||||
// ``` JavaScript
|
||||
segmentedBar.items = _createItems(3);
|
||||
// ```
|
||||
// </snippet>
|
||||
var expectedValue = 0;
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSelectedIndexBecomesUndefinedWhenItemsBoundToEmptyArray = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
// <snippet module="ui/segmented-bar" title="SegmentedBar">
|
||||
// ### Selecting an item programmatically
|
||||
// ``` JavaScript
|
||||
segmentedBar.selectedIndex = 9;
|
||||
// ```
|
||||
// </snippet>
|
||||
segmentedBar.items = [];
|
||||
var expectedValue = undefined;
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSelectedIndexBecomesUndefinedWhenItemsBoundToUndefined = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
segmentedBar.selectedIndex = 9;
|
||||
segmentedBar.items = undefined;
|
||||
var expectedValue = undefined;
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSelectedIndexBecomesUndefinedWhenItemsBoundToNull = function () {
|
||||
helper.buildUIAndRunTest(_createSegmentedBar(), function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
segmentedBar.selectedIndex = 9;
|
||||
segmentedBar.items = null;
|
||||
var expectedValue = undefined;
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testItemsIsResolvedCorrectlyIfSetBeforeViewIsLoaded = function () {
|
||||
var segmentedBar = _createSegmentedBar();
|
||||
var expectedValue = 10;
|
||||
segmentedBar.items = _createItems(expectedValue);
|
||||
segmentedBar.selectedIndex = 9;
|
||||
helper.buildUIAndRunTest(segmentedBar, function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
var actualValue = segmentedBar.items.length;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSelectedIndexIsResolvedCorrectlyIfSetBeforeViewIsLoaded = function () {
|
||||
var segmentedBar = _createSegmentedBar();
|
||||
segmentedBar.items = _createItems(10);
|
||||
var expectedValue = 9;
|
||||
segmentedBar.selectedIndex = expectedValue;
|
||||
helper.buildUIAndRunTest(segmentedBar, function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
var actualValue = segmentedBar.selectedIndex;
|
||||
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
export var testSettingNegativeSelectedIndexShouldThrow = function () {
|
||||
var segmentedBar = _createSegmentedBar();
|
||||
helper.buildUIAndRunTest(segmentedBar, function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
|
||||
TKUnit.assertThrows(function () {
|
||||
segmentedBar.selectedIndex = -1;
|
||||
}, "Setting selectedIndex to a negative number should throw.");
|
||||
});
|
||||
}
|
||||
|
||||
export var testSettingSelectedIndexLargerThanCountShouldThrow = function () {
|
||||
var segmentedBar = _createSegmentedBar();
|
||||
helper.buildUIAndRunTest(segmentedBar, function (views: Array<viewModule.View>) {
|
||||
var segmentedBar = <segmentedBarModule.SegmentedBar>views[0];
|
||||
segmentedBar.items = _createItems(10);
|
||||
TKUnit.assertThrows(function () {
|
||||
segmentedBar.selectedIndex = 10;
|
||||
}, "Setting selectedIndex to a larger number should throw.");
|
||||
});
|
||||
}
|
@ -3,6 +3,7 @@ import view = require("ui/core/view");
|
||||
import proxy = require("ui/core/proxy");
|
||||
import dependencyObservable = require("ui/core/dependency-observable");
|
||||
import color = require("color");
|
||||
import types = require("utils/types");
|
||||
|
||||
export module knownCollections {
|
||||
export var items = "items";
|
||||
@ -15,9 +16,17 @@ export class SegmentedBar extends view.View implements definition.SegmentedBar {
|
||||
}
|
||||
}
|
||||
|
||||
public _adjustSelectedIndex() {
|
||||
if (this.selectedIndex > this.items.length - 1) {
|
||||
this._setValue(SegmentedBar.selectedIndexProperty, this.items.length - 1);
|
||||
public _adjustSelectedIndex(items: Array<definition.SegmentedBarItem>) {
|
||||
if (this.items) {
|
||||
if (this.items.length > 0) {
|
||||
if (types.isUndefined(this.selectedIndex) || (this.selectedIndex > this.items.length - 1)) {
|
||||
this._setValue(SegmentedBar.selectedIndexProperty, 0);
|
||||
}
|
||||
} else {
|
||||
this._setValue(SegmentedBar.selectedIndexProperty, undefined);
|
||||
}
|
||||
} else {
|
||||
this._setValue(SegmentedBar.selectedIndexProperty, undefined);
|
||||
}
|
||||
}
|
||||
|
||||
@ -39,11 +48,11 @@ export class SegmentedBar extends view.View implements definition.SegmentedBar {
|
||||
return this._getValue(SegmentedBar.selectedBackgroundColorProperty);
|
||||
}
|
||||
set selectedBackgroundColor(value: color.Color) {
|
||||
this._setValue(SegmentedBar.selectedBackgroundColorProperty,
|
||||
this._setValue(SegmentedBar.selectedBackgroundColorProperty,
|
||||
value instanceof color.Color ? value : new color.Color(<any>value));
|
||||
}
|
||||
|
||||
public static selectedBackgroundColorProperty = new dependencyObservable.Property("selectedBackgroundColor", "SegmentedBar", new proxy.PropertyMetadata(undefined))
|
||||
public static selectedIndexProperty = new dependencyObservable.Property("selectedIndex", "SegmentedBar", new proxy.PropertyMetadata(0))
|
||||
public static selectedIndexProperty = new dependencyObservable.Property("selectedIndex", "SegmentedBar", new proxy.PropertyMetadata(undefined))
|
||||
public static itemsProperty = new dependencyObservable.Property("items", "SegmentedBar", new proxy.PropertyMetadata(undefined))
|
||||
}
|
@ -1,4 +1,5 @@
|
||||
import common = require("ui/segmented-bar/segmented-bar-common");
|
||||
import definition = require("ui/segmented-bar");
|
||||
import common = require("ui/segmented-bar/segmented-bar-common");
|
||||
import dependencyObservable = require("ui/core/dependency-observable");
|
||||
import proxy = require("ui/core/proxy");
|
||||
import types = require("utils/types");
|
||||
@ -15,8 +16,13 @@ function onSelectedIndexPropertyChanged(data: dependencyObservable.PropertyChang
|
||||
|
||||
var index = <number>data.newValue;
|
||||
|
||||
if (types.isNumber(index) && index >= 0 && index <= view.items.length - 1) {
|
||||
view.android.setCurrentTab(index);
|
||||
if (types.isNumber(index)) {
|
||||
if (index >= 0 && index <= view.items.length - 1) {
|
||||
view.android.setCurrentTab(index);
|
||||
} else {
|
||||
view.selectedIndex = undefined;
|
||||
throw new Error("selectedIndex should be between [0, items.length - 1]");
|
||||
}
|
||||
}
|
||||
}
|
||||
(<proxy.PropertyMetadata>common.SegmentedBar.selectedIndexProperty.metadata).onSetNativeValue = onSelectedIndexPropertyChanged;
|
||||
@ -29,7 +35,9 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
|
||||
|
||||
view.android.clearAllTabs();
|
||||
|
||||
var newItems = <Array<any>>data.newValue;
|
||||
var newItems = <Array<definition.SegmentedBarItem>>data.newValue;
|
||||
|
||||
view._adjustSelectedIndex(newItems);
|
||||
|
||||
if (newItems && newItems.length) {
|
||||
for (var i = 0; i < newItems.length; i++) {
|
||||
@ -49,8 +57,6 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
|
||||
view.android.addTab(tab);
|
||||
}
|
||||
|
||||
view._adjustSelectedIndex();
|
||||
|
||||
if (view.android.getCurrentTab() !== view.selectedIndex) {
|
||||
view.android.setCurrentTab(view.selectedIndex);
|
||||
}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import common = require("ui/segmented-bar/segmented-bar-common");
|
||||
import definition = require("ui/segmented-bar");
|
||||
import common = require("ui/segmented-bar/segmented-bar-common");
|
||||
import dependencyObservable = require("ui/core/dependency-observable");
|
||||
import proxy = require("ui/core/proxy");
|
||||
import types = require("utils/types");
|
||||
@ -15,8 +16,13 @@ function onSelectedIndexPropertyChanged(data: dependencyObservable.PropertyChang
|
||||
}
|
||||
|
||||
var index = <number>data.newValue;
|
||||
if (types.isNumber(index) && index >= 0 && index <= view.items.length - 1) {
|
||||
view.ios.selectedSegmentIndex = index;
|
||||
if (types.isNumber(index)) {
|
||||
if (index >= 0 && index <= view.items.length - 1) {
|
||||
view.ios.selectedSegmentIndex = index;
|
||||
} else {
|
||||
view.selectedIndex = undefined;
|
||||
throw new Error("selectedIndex should be between [0, items.length - 1]");
|
||||
}
|
||||
}
|
||||
}
|
||||
(<proxy.PropertyMetadata>common.SegmentedBar.selectedIndexProperty.metadata).onSetNativeValue = onSelectedIndexPropertyChanged;
|
||||
@ -27,16 +33,22 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
|
||||
return;
|
||||
}
|
||||
|
||||
var newItems = <Array<definition.SegmentedBarItem>>data.newValue;
|
||||
|
||||
console.log("SET ITEMS BEFORE: " + view.selectedIndex);
|
||||
view._adjustSelectedIndex(newItems);
|
||||
console.log("SET ITEMS AFTER: " + view.selectedIndex);
|
||||
|
||||
view.ios.removeAllSegments();
|
||||
|
||||
for (var i = 0; i < view.items.length; i++) {
|
||||
view.ios.insertSegmentWithTitleAtIndexAnimated(view.items[i].title, i, false);
|
||||
}
|
||||
if (newItems && newItems.length) {
|
||||
for (var i = 0; i < newItems.length; i++) {
|
||||
view.ios.insertSegmentWithTitleAtIndexAnimated(newItems[i].title, i, false);
|
||||
}
|
||||
|
||||
view._adjustSelectedIndex();
|
||||
|
||||
if (view.ios.selectedSegmentIndex !== view.selectedIndex) {
|
||||
view.ios.selectedSegmentIndex = view.selectedIndex;
|
||||
if (view.ios.selectedSegmentIndex !== view.selectedIndex) {
|
||||
view.ios.selectedSegmentIndex = view.selectedIndex;
|
||||
}
|
||||
}
|
||||
}
|
||||
(<proxy.PropertyMetadata>common.SegmentedBar.itemsProperty.metadata).onSetNativeValue = onItemsPropertyChanged;
|
||||
@ -60,6 +72,7 @@ export class SegmentedBar extends common.SegmentedBar {
|
||||
constructor() {
|
||||
super();
|
||||
this._ios = UISegmentedControl.new();
|
||||
console.log("CREATE: " + this.selectedIndex);
|
||||
|
||||
this._selectionHandler = SelectionHandlerImpl.new().initWithOwner(this);
|
||||
this._ios.addTargetActionForControlEvents(this._selectionHandler, "selected", UIControlEvents.UIControlEventValueChanged);
|
||||
|
Reference in New Issue
Block a user