diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj index 31dde677d..7e4fe85c9 100644 --- a/CrossPlatformModules.csproj +++ b/CrossPlatformModules.csproj @@ -189,6 +189,9 @@ Designer + + Designer + Designer @@ -239,6 +242,7 @@ color.xml + html-view.xml diff --git a/apps/tests/ui/style/style-properties-tests.ts b/apps/tests/ui/style/style-properties-tests.ts index a642bbabf..2d36fe321 100644 --- a/apps/tests/ui/style/style-properties-tests.ts +++ b/apps/tests/ui/style/style-properties-tests.ts @@ -1,12 +1,15 @@ import TKUnit = require("../../TKUnit"); import helper = require("../helper"); import buttonModule = require("ui/button"); +import labelModule = require("ui/label"); import stackModule = require("ui/layouts/stack-layout"); import page = require("ui/page"); import color = require("color"); import observable = require("data/observable"); import enums = require("ui/enums"); import fontModule = require("ui/styling/font"); +import platform = require("platform"); +import viewModule = require("ui/core/view"); var testBtn: buttonModule.Button; var testPage: page.Page; @@ -33,6 +36,14 @@ export function tearDown() { testPage.css = ""; } +export function test_setting_textDecoration_property_from_CSS_is_applied_to_Style() { + test_property_from_CSS_is_applied_to_style("textDecoration", "text-decoration", "underline"); +} + +export function test_setting_whiteSpace_property_from_CSS_is_applied_to_Style() { + test_property_from_CSS_is_applied_to_style("whiteSpace", "white-space", "nowrap"); +} + export function test_CSS_properties_are_applied_to_Style() { test_property_from_CSS_is_applied_to_style("color", "color", new color.Color("#FF0000"), "#FF0000"); } @@ -244,6 +255,58 @@ export function test_setting_different_color_triggers_property_change() { TKUnit.assert(changed, "Property changed not triggered."); } +export function test_setting_same_textDecoration_does_not_trigger_property_change() { + var testView = new buttonModule.Button(); + testView.style.textDecoration = "underline"; + + var changed = false; + testView.style.on(observable.Observable.propertyChangeEvent, (data) => { + changed = true; + }); + + testView.style.textDecoration = "underline"; + TKUnit.assert(!changed, "Property changed triggered."); +} + +export function test_setting_different_textDecoration_triggers_property_change() { + var testView = new buttonModule.Button(); + testView.style.textDecoration = "underline"; + + var changed = false; + testView.style.on(observable.Observable.propertyChangeEvent, (data) => { + changed = true; + }); + + testView.style.textDecoration = "none"; + TKUnit.assert(changed, "Property changed not triggered."); +} + +export function test_setting_same_whiteSpace_does_not_trigger_property_change() { + var testView = new buttonModule.Button(); + testView.style.whiteSpace = "normal"; + + var changed = false; + testView.style.on(observable.Observable.propertyChangeEvent, (data) => { + changed = true; + }); + + testView.style.whiteSpace = "normal"; + TKUnit.assert(!changed, "Property changed triggered."); +} + +export function test_setting_different_whiteSpace_triggers_property_change() { + var testView = new buttonModule.Button(); + testView.style.whiteSpace = "normal"; + + var changed = false; + testView.style.on(observable.Observable.propertyChangeEvent, (data) => { + changed = true; + }); + + testView.style.whiteSpace = "nowrap"; + TKUnit.assert(changed, "Property changed not triggered."); +} + export function test_setting_same_backgroundColor_does_not_trigger_property_change() { var testView = new buttonModule.Button(); testView.style.backgroundColor = new color.Color("#FF0000"); @@ -366,3 +429,63 @@ function test_native_font(style: string, weight: string) { } //TODO: If needed add tests for other platforms } + +export var test_setting_button_whiteSpace_normal_sets_native = function () { + var testView = new buttonModule.Button(); + testView.style.whiteSpace = "nowrap"; + + helper.buildUIAndRunTest(testView, function (views: Array) { + + if (platform.device.os === platform.platformNames.android) { + TKUnit.assertEqual((testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END); + } else if (platform.device.os === platform.platformNames.ios) { + TKUnit.assertEqual((testView.ios).titleLabel.lineBreakMode, NSLineBreakMode.NSLineBreakByTruncatingMiddle); + TKUnit.assertEqual((testView.ios).titleLabel.numberOfLines, 1); + } + }); +} + +export var test_setting_label_whiteSpace_normal_sets_native = function () { + var testView = new labelModule.Label(); + testView.style.whiteSpace = "nowrap"; + + helper.buildUIAndRunTest(testView, function (views: Array) { + + if (platform.device.os === platform.platformNames.android) { + TKUnit.assertEqual((testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END); + } else if (platform.device.os === platform.platformNames.ios) { + TKUnit.assertEqual((testView.ios).lineBreakMode, NSLineBreakMode.NSLineBreakByTruncatingTail); + TKUnit.assertEqual((testView.ios).numberOfLines, 1); + } + }); +} + +export var test_setting_button_whiteSpace_nowrap_sets_native = function () { + var testView = new buttonModule.Button(); + testView.style.whiteSpace = "normal"; + + helper.buildUIAndRunTest(testView, function (views: Array) { + + if (platform.device.os === platform.platformNames.android) { + TKUnit.assertNull((testView.android).getEllipsize(), null); + } else if (platform.device.os === platform.platformNames.ios) { + TKUnit.assertEqual((testView.ios).titleLabel.lineBreakMode, NSLineBreakMode.NSLineBreakByWordWrapping); + TKUnit.assertEqual((testView.ios).titleLabel.numberOfLines, 0); + } + }); +} + +export var test_setting_label_whiteSpace_nowrap_sets_native = function () { + var testView = new labelModule.Label(); + testView.style.whiteSpace = "normal"; + + helper.buildUIAndRunTest(testView, function (views: Array) { + + if (platform.device.os === platform.platformNames.android) { + TKUnit.assertNull((testView.android).getEllipsize(), null); + } else if (platform.device.os === platform.platformNames.ios) { + TKUnit.assertEqual((testView.ios).lineBreakMode, NSLineBreakMode.NSLineBreakByWordWrapping); + TKUnit.assertEqual((testView.ios).numberOfLines, 0); + } + }); +} diff --git a/apps/ui-tests-app/css/text-decoration.ts b/apps/ui-tests-app/css/text-decoration.ts index eceb2f30e..1697df70c 100644 --- a/apps/ui-tests-app/css/text-decoration.ts +++ b/apps/ui-tests-app/css/text-decoration.ts @@ -1,17 +1,18 @@ -var obj; - -export function loaded(args) { - obj = args.object; -} +import view = require("ui/core/view"); +import observable = require("data/observable"); +import label = require("ui/label"); export function butonTap(args) { - if (obj.style.textDecoration === "underline") { - obj.style.textDecoration = "line-through"; - } else if (obj.style.textDecoration === "line-through") { - obj.style.textDecoration = "line-through underline"; - } else if (obj.style.textDecoration === "line-through underline") { - obj.style.textDecoration = "none"; - } else if (obj.style.textDecoration === "none") { - obj.style.textDecoration = "underline"; + var btn = args.object; + var lbl = btn.parent.getViewById("Label1"); + + if (lbl.style.textDecoration === "underline") { + lbl.style.textDecoration = "line-through"; + } else if (lbl.style.textDecoration === "line-through") { + lbl.style.textDecoration = "line-through underline"; + } else if (lbl.style.textDecoration === "line-through underline") { + lbl.style.textDecoration = "none"; + } else if (lbl.style.textDecoration === "none") { + lbl.style.textDecoration = "underline"; } } \ No newline at end of file diff --git a/apps/ui-tests-app/css/text-decoration.xml b/apps/ui-tests-app/css/text-decoration.xml index f1a99cadb..4e71c619b 100644 --- a/apps/ui-tests-app/css/text-decoration.xml +++ b/apps/ui-tests-app/css/text-decoration.xml @@ -2,7 +2,7 @@