Merge pull request #6926 from NativeScript/merge-release-master-5.2.1

Merge release master 5.2.1

CHANGELOG.md

@@ -1,3 +1,16 @@
+<a name="5.2.1"></a>
+## [5.2.1](https://github.com/NativeScript/NativeScript/compare/5.2.0...5.2.1) (2019-02-19)
+
+
+### Bug Fixes
+
+* **css:** widget properties in css didn't work ([#6889](https://github.com/NativeScript/NativeScript/issues/6889)) ([8330ac0](https://github.com/NativeScript/NativeScript/commit/8330ac0))
+* **frame-ios:** tearDownUI  when UINavigationController disappear ([#6892](https://github.com/NativeScript/NativeScript/issues/6892)) ([57f07a3](https://github.com/NativeScript/NativeScript/commit/57f07a3))
+* **ios:** searcbar hint color before hint property ([#6902](https://github.com/NativeScript/NativeScript/issues/6902)) ([5dd01a3](https://github.com/NativeScript/NativeScript/commit/5dd01a3))
+* **ios-textview:** text alignment reset to default on blur ([#6903](https://github.com/NativeScript/NativeScript/issues/6903)) ([0416f7e](https://github.com/NativeScript/NativeScript/commit/0416f7e))
+
+
+
 <a name="5.2.0"></a>
 # [5.2.0](https://github.com/NativeScript/NativeScript/compare/5.1.2...5.2.0) (2019-02-08)
 

tests/app/navigation/navigation-tests.ts

@@ -101,8 +101,11 @@ export function test_backAndForwardParentPage_nestedFrames() {
     helper.waitUntilNavigatedTo(parentPage1, () => frame.goBack());
     currentPageMustBe("ParentPage1");
 
-    helper.waitUntilNavigatedTo(parentPage2, () => topmost.navigate({ create: () => parentPage2 }));
+    const innerPage3 = page("InnerPage3");
-    currentPageMustBe("ParentPage2");
+    const parentPage3 = parentPage("ParentPage3", innerPage3);
+
+    helper.waitUntilNavigatedTo(parentPage3, () => topmost.navigate({ create: () => parentPage3 }));
+    currentPageMustBe("ParentPage3");
 
     back(2);
     TKUnit.waitUntilReady(() => topmostFrame().navigationQueueIsEmpty());

tests/app/ui/search-bar/search-bar-tests-native.android.ts

@@ -23,6 +23,15 @@ export function getNativeHintColor(searchBar: searchBarModule.SearchBar): colorM
     return undefined;
 }
 
+export function getNativeTextFieldBackgroundColor(searchBar: searchBarModule.SearchBar): colorModule.Color {
+    var textView = getTextView(searchBar.android);
+
+    if (textView) {
+        return new colorModule.Color((<android.graphics.drawable.ColorDrawable>textView.getBackground()).getColor());
+    }
+    return undefined;
+}
+
 export function getNativeFontSize(searchBar: searchBarModule.SearchBar): number {
     var textView = getTextView(searchBar.android);
 

tests/app/ui/search-bar/search-bar-tests-native.d.ts

@@ -3,4 +3,5 @@ import * as searchBarModule from "tns-core-modules/ui/search-bar";
 import * as colorModule from "tns-core-modules/color";
 
 export declare function getNativeHintColor(textView: searchBarModule.SearchBar): colorModule.Color;
+export declare function getNativeTextFieldBackgroundColor(textView: searchBarModule.SearchBar): colorModule.Color;
 export declare function getNativeFontSize(searchBar: searchBarModule.SearchBar): number;

tests/app/ui/search-bar/search-bar-tests-native.ios.ts

@@ -3,8 +3,18 @@ import { Color } from "tns-core-modules/color";
 import { getColor } from "../helper";
 
 export function getNativeHintColor(searchBar: SearchBar): Color {
-    return (<any>searchBar)._placeholderLabel ? getColor((<any>searchBar)._placeholderLabel.textColor) : undefined; 
+    if ((<any>searchBar)._textField) {
+        const placeholder = (<any>searchBar)._textField.valueForKey("placeholderLabel");
+        return getColor(placeholder.textColor);
+    }
+
+    return undefined; 
 }
+
+export function getNativeTextFieldBackgroundColor(searchBar: SearchBar): Color {
+    return (<any>searchBar)._textField ? getColor((<any>searchBar)._textField.backgroundColor) : undefined; 
+}
+
 export function getNativeFontSize(searchBar: SearchBar): number {
     return (<any>searchBar)._textField ? (<any>searchBar)._textField.font.pointSize : undefined;
 }

tests/app/ui/search-bar/search-bar-tests.ts

@@ -28,7 +28,7 @@ export function test_recycling() {
     helper.nativeView_recycling_test(() => new searchBarModule.SearchBar());
 }
 
-export var testSearchBarHintColorAndroid = function () {
+export var testSearchBarHintColor = function () {
     helper.buildUIAndRunTest(_createSearchBarFunc(), function (views: Array<viewModule.View>) {
         var searchBar = <searchBarModule.SearchBar>views[0];
 
@@ -50,6 +50,28 @@ export var testSearchBarHintColorAndroid = function () {
     });
 };
 
+export var testSearchBarTextFieldBackgroundColor = function () {
+    helper.buildUIAndRunTest(_createSearchBarFunc(), function (views: Array<viewModule.View>) {
+        var searchBar = <searchBarModule.SearchBar>views[0];
+
+        searchBar.text = "";
+        searchBar.hint = "";
+
+        var expectedNormalizedValue;
+        var actualValue;
+
+        searchBar.textFieldBackgroundColor = new colorModule.Color("blue");
+        expectedNormalizedValue = "#0000FF"; // blue
+        actualValue = searchBarTestsNative.getNativeTextFieldBackgroundColor(searchBar).hex;
+        TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
+
+        searchBar.textFieldBackgroundColor = new colorModule.Color("red");
+        expectedNormalizedValue = "#FF0000"; // red
+        actualValue = searchBarTestsNative.getNativeTextFieldBackgroundColor(searchBar).hex;
+        TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
+    });
+};
+
 export var testSearchBarFontSize = function () {
     helper.buildUIAndRunTest(_createSearchBarFunc(), function (views: Array<viewModule.View>) {
         var searchBar = <searchBarModule.SearchBar>views[0];
@@ -66,6 +88,33 @@ export var testSearchBarFontSize = function () {
     });
 };
 
+export var testSearchBarPropertiesWithCSS = function () {
+    helper.buildUIAndRunTest(_createSearchBarFunc(), function (views: Array<viewModule.View>) {
+        var searchBar = <searchBarModule.SearchBar>views[0];
+
+        searchBar.text = "";
+        searchBar.hint = "hint css test";
+
+        const expectedHintColor = "#0000FF"; // blue
+        const expectedTextFieldBackgroundColor = "#FF0000"; // red
+        const expectedFontSize = 30;
+
+        const hintColorActualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
+        const textFieldBackgroundColorActualValue = searchBarTestsNative.getNativeTextFieldBackgroundColor(searchBar).hex;
+        const fontSizeActualValue = searchBarTestsNative.getNativeFontSize(searchBar);
+
+        TKUnit.assert(hintColorActualValue === expectedHintColor, "HintColor - Actual: " + hintColorActualValue + "; Expected: " + expectedHintColor);
+        TKUnit.assert(expectedTextFieldBackgroundColor === textFieldBackgroundColorActualValue, "Text Background Color - Actual: " + textFieldBackgroundColorActualValue + "; Expected: " + expectedTextFieldBackgroundColor);
+        TKUnit.assertAreClose(expectedFontSize, fontSizeActualValue, 0.2, "Font Size - Actual: " + fontSizeActualValue + "; Expected: " + expectedFontSize);
+    }, { pageCss: `
+        SearchBar {
+            text-field-hint-color: blue;
+            text-field-background-color: red;
+            font-size: 30;
+        }
+    `});
+};
+
 export function test_DummyTestForSnippetOnly() {
     // >> article-searching
     var searchBar = new searchBarModule.SearchBar();

tns-core-modules/ui/frame/frame.ios.ts

@@ -37,6 +37,8 @@ export class Frame extends FrameBase {
 
     public disposeNativeView() {
         this._removeFromFrameStack();
+        this.viewController = null;
+        this._ios.controller = null;
         super.disposeNativeView();
     }
 
@@ -389,9 +391,8 @@ class UINavigationControllerImpl extends UINavigationController {
         const owner = this._owner.get();
         if (owner && owner.isLoaded && !owner.parent && !this.presentedViewController) {
             owner.callUnloaded();
+            owner._tearDownUI(true);
 
-            owner.viewController = null;
-            owner.ios.controller = null;
         }
     }
 

tns-core-modules/ui/search-bar/search-bar.ios.ts

@@ -71,7 +71,6 @@ export class SearchBar extends SearchBarBase {
     nativeViewProtected: UISearchBar;
     private _delegate;
     private __textField: UITextField;
-    private __placeholderLabel: UILabel;
 
     createNativeView() {
         return UISearchBarImpl.new();
@@ -113,16 +112,6 @@ export class SearchBar extends SearchBarBase {
         return this.__textField;
     }
 
-    get _placeholderLabel(): UILabel {
-        if (!this.__placeholderLabel) {
-            if (this._textField) {
-                this.__placeholderLabel = this._textField.valueForKey("placeholderLabel");
-            }
-        }
-
-        return this.__placeholderLabel;
-    }
-
     [isEnabledProperty.setNative](value: boolean) {
         const nativeView = this.nativeViewProtected;
         if (nativeView instanceof UIControl) {
@@ -189,8 +178,7 @@ export class SearchBar extends SearchBarBase {
         return "";
     }
     [hintProperty.setNative](value: string) {
-        const text = (value === null || value === undefined) ? "" : value.toString();
+        this._updateAttributedPlaceholder();
-        this.ios.placeholder = text;
     }
 
     [textFieldBackgroundColorProperty.getDefault](): UIColor {
@@ -210,18 +198,30 @@ export class SearchBar extends SearchBarBase {
     }
 
     [textFieldHintColorProperty.getDefault](): UIColor {
-        const placeholderLabel = this._placeholderLabel;
-        if (placeholderLabel) {
-            return placeholderLabel.textColor;
-        }
-
         return null;
     }
     [textFieldHintColorProperty.setNative](value: Color | UIColor) {
-        const color = value instanceof Color ? value.ios : value
+        this._updateAttributedPlaceholder();
-        const placeholderLabel = this._placeholderLabel;
-        if (placeholderLabel) {
-            placeholderLabel.textColor = color;
     }
+
+    // Very similar to text-field.ios.ts implementation. Maybe unify APIs and base classes?
+    _updateAttributedPlaceholder(): void {
+        let stringValue = this.hint;
+        if (stringValue === null || stringValue === void 0) {
+            stringValue = "";
+        } else {
+            stringValue = stringValue + "";
+        }
+        if (stringValue === "") {
+            // we do not use empty string since initWithStringAttributes does not return proper value and
+            // nativeView.attributedPlaceholder will be null
+            stringValue = " ";
+        }
+        const attributes: any = {};
+        if (this.textFieldHintColor) {
+            attributes[NSForegroundColorAttributeName] = this.textFieldHintColor.ios;
+        }
+        const attributedPlaceholder = NSAttributedString.alloc().initWithStringAttributes(stringValue, attributes);
+        this._textField.attributedPlaceholder = attributedPlaceholder;
     }
 }

tns-core-modules/ui/styling/style-scope.ts

@@ -481,7 +481,8 @@ export class CssState {
                 if (property in this.view.style) {
                     this.view.style[`css:${property}`] = value;
                 } else {
-                    this.view[property] = value;
+                    const camelCasedProperty = property.replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });
+                    this.view[camelCasedProperty] = value;
                 }
             } catch (e) {
                 traceWrite(`Failed to apply property [${property}] with value [${value}] to ${this.view}. ${e}`, traceCategories.Error, traceMessageType.error);

tns-core-modules/ui/text-base/text-base.ios.ts

@@ -138,6 +138,10 @@ export class TextBase extends TextBaseCommon {
                 paragraphStyle.lineBreakMode = this.nativeTextViewProtected.lineBreakMode;
             }
             attrText.addAttributeValueRange(NSParagraphStyleAttributeName, paragraphStyle, { location: 0, length: attrText.length });
+        } else if (this.nativeTextViewProtected instanceof UITextView) {
+            const paragraphStyle = NSMutableParagraphStyle.alloc().init();
+            paragraphStyle.alignment = (<UITextView>this.nativeTextViewProtected).textAlignment;
+            attrText.addAttributeValueRange(NSParagraphStyleAttributeName, paragraphStyle, { location: 0, length: attrText.length });
         }
 
         if (this.nativeTextViewProtected instanceof UIButton) {
@@ -175,6 +179,7 @@ export class TextBase extends TextBaseCommon {
             dict.set(NSKernAttributeName, style.letterSpacing * this.nativeTextViewProtected.font.pointSize);
         }
 
+        const isTextView = this.nativeTextViewProtected instanceof UITextView;
         if (style.lineHeight) {
             const paragraphStyle = NSMutableParagraphStyle.alloc().init();
             paragraphStyle.lineSpacing = style.lineHeight;
@@ -185,9 +190,12 @@ export class TextBase extends TextBaseCommon {
                 paragraphStyle.lineBreakMode = this.nativeTextViewProtected.lineBreakMode;
             }
             dict.set(NSParagraphStyleAttributeName, paragraphStyle);
+        } else if (isTextView) {
+            const paragraphStyle = NSMutableParagraphStyle.alloc().init();
+            paragraphStyle.alignment = (<UITextView>this.nativeTextViewProtected).textAlignment;
+            dict.set(NSParagraphStyleAttributeName, paragraphStyle);
         }
 
-        const isTextView = this.nativeTextViewProtected instanceof UITextView;
         if (style.color && (dict.size > 0 || isTextView)) {
             dict.set(NSForegroundColorAttributeName, style.color.ios);
         }