Merge pull request NativeScript#2324 from NativeScript/nnikolov/CssCascadeSelectorsIssue

Nedyalko Nikolov · web-flow · commit 58be9796b621 · 2016-06-17T13:27:32.000+03:00
Fixed issue NativeScript#1655 cascading css selectors.
diff --git a/tests/app/ui/styling/style-tests.ts b/tests/app/ui/styling/style-tests.ts
@@ -1426,6 +1426,23 @@ export function test_UsingSameSelectorsWithSpecific_ShouldApplyLatest() {
     }
     helper.buildUIAndRunTest(testButton, testFunc, testCss);
 }
+
+export function test_CascadingClassNamesAppliesAfterPageLoad() {
+    const stack = new stackModule.StackLayout();
+    const label = new labelModule.Label();
+    label.text = "Some text";
+    label.cssClass = 'lab1';
+    stack.addChild(label);
+
+    application.addCss(".added { background-color: red; } .added .lab1 { background-color: blue; } .lab1 { color: red}");
+
+    helper.buildUIAndRunTest(stack, function (views: Array<viewModule.View>) {
+        helper.assertViewColor(label, "#FF0000");
+        stack.className = "added";
+        helper.assertViewBackgroundColor(label, "#0000FF");
+        helper.assertViewBackgroundColor(stack, "#FF0000");
+    });
+}
 // <snippet module="ui/styling" title="styling">
 // For information and example how to use style properties please refer to special [**Styling**](../../../styling.md) topic. 
 // </snippet>
diff --git a/tns-core-modules/ui/core/view-common.ts b/tns-core-modules/ui/core/view-common.ts
@@ -614,6 +614,10 @@ export class View extends ProxyObject implements definition.View {
         if (metadata.affectsStyle) {
             this.style._resetCssValues();
             this._applyStyleFromScope();
+            this._eachChildView((v) => {
+                v._checkMetadataOnPropertyChanged(metadata);
+                return true;
+            });
         }
     }
 

Original file line number	Diff line number	Diff line change
`@@ -614,6 +614,10 @@ export class View extends ProxyObject implements definition.View {`
`614`	`614`	`if (metadata.affectsStyle) {`
`615`	`615`	`this.style._resetCssValues();`
`616`	`616`	`this._applyStyleFromScope();`
	`617`	`+ this._eachChildView((v) => {`
	`618`	`+ v._checkMetadataOnPropertyChanged(metadata);`
	`619`	`+ return true;`
	`620`	`+ });`
`617`	`621`	`}`
`618`	`622`	`}`
`619`	`623`