Fix applying app CSS to template children when using custom pages.

No longer using getAncestor(view, "Page") to look for a pagey parent.
Replaced that with a View.page property. Removed getAncestor as its type
name-based implementation seems unreliable.

apps/action-bar-demo/pages/action-bar-hidden.ts

@@ -3,7 +3,7 @@ import view = require("ui/core/view");
 
 var toggle = false;
 export function toggleTap(args) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
     page.actionBarHidden = toggle;
     toggle = !toggle;
-}
+}

apps/action-bar-demo/pages/data-binding.ts

@@ -24,7 +24,7 @@ export function pageLoaded(args) {
 }
 var i = 0;
 export function buttonTap(args) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
     var vm = page.bindingContext;
     var icon;
     if (i % 3 === 0) {

apps/action-bar-demo/pages/navigation-button.ts

@@ -5,7 +5,7 @@ import view = require("ui/core/view");
 
 var i = 0;
 export function buttonTap(args: observable.EventData) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
 
     var navBtn = new action.NavigationButton();
     navBtn.text = "nav " + i++;
@@ -26,7 +26,7 @@ export function buttonTap(args: observable.EventData) {
 
 var j = 0;
 export function visibilityTap(args: observable.EventData) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
 
     if (page.actionBar.android) {
         if (j % 3 === 0) {

apps/action-bar-demo/pages/page-title-icon.ts

@@ -4,7 +4,7 @@ import view = require("ui/core/view");
 
 var i = 0;
 export function buttonTap(args: observable.EventData) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
     page.actionBar.title = "Title changed " + i++;
 
     if (page.actionBar.android) {
@@ -22,7 +22,7 @@ export function buttonTap(args: observable.EventData) {
 
 var j = 0;
 export function visibilityTap(args: observable.EventData) {
-    var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
+    var page = <pages.Page>(<view.View>args.object).page;
 
     if (page.actionBar.android) {
         if (j % 3 === 0) {

apps/tests/pages/background-test.ts

@@ -2,12 +2,12 @@ import view = require("ui/core/view");
 import pages = require("ui/page");
 
 export function applyTap(args) {
-    var page = <pages.Page>view.getAncestor(args.object, "Page");
+    var page = <pages.Page>(<view.View>args.object).page;
     var css = "#test-element { " + args.object.tag + " }";
     page.css = css;
 }
 
 export function resetTap(args) {
-    var page = <pages.Page>view.getAncestor(args.object, "Page");
+    var page = <pages.Page>(<view.View>args.object).page;
     page.css = "";
-}
+}

apps/tests/xml-declaration/inherited-base-page.ts

@@ -0,0 +1,4 @@
+import {Page} from "ui/page";
+
+export class InheritedPage extends Page {
+}

apps/tests/xml-declaration/inherited-page.ts

@@ -0,0 +1,7 @@
+import {Page} from "ui/page";
+import {Label} from "ui/label";
+
+export function pageLoaded(args) {
+    var page = <Page>args.object;
+    (<Label>page.content).text += " and loaded";
+}

apps/tests/xml-declaration/inherited-page.xml

@@ -0,0 +1,4 @@
+<inherited:InheritedPage xmlns="http://www.nativescript.org/tns.xsd"
+  xmlns:inherited="xml-declaration/inherited-base-page" loaded="pageLoaded">
+  <Label text="Inherited" />
+</inherited:InheritedPage>

apps/tests/xml-declaration/xml-declaration-tests.ts

@@ -12,7 +12,7 @@ import fs = require("file-system");
 import fileSystemAccess = require("file-system/file-system-access");
 import observable = require("data/observable");
 import stackLayoutModule = require("ui/layouts/stack-layout");
-import labelModule = require("ui/label");
+import {Label} from "ui/label";
 import myCustomControlWithoutXml = require("./mymodule/MyControl");
 import listViewModule = require("ui/list-view");
 import helper = require("../ui/helper");
@@ -76,6 +76,16 @@ export function test_loadWithOptionsNoXML_CSSIsApplied() {
     }
 };
 
+export function test_loadInheritedPageAndResolveFromChild() {
+    helper.navigateToModuleAndRunTest("./xml-declaration/inherited-page", null, (page) => {
+        let contentLabel = <Label>page.content;
+        TKUnit.assertEqual("Inherited and loaded", contentLabel.text);
+
+        let discoveredPage = contentLabel.page;
+        TKUnit.assert(page === discoveredPage);
+    });
+}
+
 export function test_loadWithOptionsWithXML() {
     var v = builder.load({
         path: "~/xml-declaration/mymodulewithxml",
@@ -116,7 +126,7 @@ export function test_loadWithOptionsFromTNS() {
         name: "Label"
     });
 
-    TKUnit.assert(v instanceof labelModule.Label, "Expected result: Label; Actual result: " + v + ";");
+    TKUnit.assert(v instanceof Label, "Expected result: Label; Actual result: " + v + ";");
 };
 
 export function test_loadWithOptionsFromTNSPath() {
@@ -125,7 +135,7 @@ export function test_loadWithOptionsFromTNSPath() {
         name: "Label"
     });
 
-    TKUnit.assert(v instanceof labelModule.Label, "Expected result: Label; Actual result: " + v + ";");
+    TKUnit.assert(v instanceof Label, "Expected result: Label; Actual result: " + v + ";");
 };
 
 export function test_parse_ShouldNotCrashWithoutExports() {
@@ -236,7 +246,7 @@ export function test_parse_ShouldParsePlatformSpecificComponents() {
         TKUnit.assert(p.content instanceof textFieldModule.TextField, "Expected result: TextField; Actual result: " + p.content);
     }
     else {
-        TKUnit.assert(p.content instanceof labelModule.Label, "Expected result: Label; Actual result: " + p.content);
+        TKUnit.assert(p.content instanceof Label, "Expected result: Label; Actual result: " + p.content);
     }
 };
 
@@ -294,7 +304,7 @@ export function test_parse_ShouldParseBindingsToGestures() {
     };
 
     p.bindingContext = context;
-    var lbl = <labelModule.Label>p.content;
+    var lbl = <Label>p.content;
 
     var observer = (<view.View>lbl).getGestureObservers(gesturesModule.GestureTypes.tap)[0];
 
@@ -315,11 +325,11 @@ export function test_parse_ShouldParseSubProperties() {
 export function test_parse_ShouldParseBindingsWithCommaInsideSingleQuote() {
     var expected = "Hi,test"
     var bindingString = "{{ 'Hi,' + myProp }}";
-    var p = <page.Page>builder.parse('<Page><Label text="' + bindingString + '" /></Page>');
+    var p = <Page>builder.parse('<Page><Label text="' + bindingString + '" /></Page>');
     var obj = new observable.Observable();
     obj.set("myProp", "test");
     p.bindingContext = obj;
-    var lbl = <labelModule.Label>p.content;
+    var lbl = <Label>p.content;
 
     TKUnit.assert(lbl.text === expected, "Expected " + expected + "; Actual result: " + lbl.text + "; type: " + typeof (lbl.text));
 };
@@ -327,11 +337,11 @@ export function test_parse_ShouldParseBindingsWithCommaInsideSingleQuote() {
 export function test_parse_ShouldParseBindingsWithCommaInsideDoubleQuote() {
     var expected = "Hi,test"
     var bindingString = '{{ "Hi," + myProp }}';
-    var p = <page.Page>builder.parse("<Page><Label text='" + bindingString + "' /></Page>");
+    var p = <Page>builder.parse("<Page><Label text='" + bindingString + "' /></Page>");
     var obj = new observable.Observable();
     obj.set("myProp", "test");
     p.bindingContext = obj;
-    var lbl = <labelModule.Label>p.content;
+    var lbl = <Label>p.content;
 
     TKUnit.assert(lbl.text === expected, "Expected " + expected + "; Actual result: " + lbl.text + "; type: " + typeof (lbl.text));
 };
@@ -352,7 +362,7 @@ export function test_parse_ShouldParseLowerCaseDashedComponentDeclaration() {
     var ctrl = <stackLayoutModule.StackLayout>p.content;
 
     TKUnit.assert(ctrl instanceof stackLayoutModule.StackLayout, "Expected result: StackLayout!; Actual result: " + ctrl);
-    TKUnit.assert(ctrl.getChildAt(0) instanceof labelModule.Label, "Expected result: Label!; Actual result: " + ctrl.getChildAt(0));
+    TKUnit.assert(ctrl.getChildAt(0) instanceof Label, "Expected result: Label!; Actual result: " + ctrl.getChildAt(0));
     TKUnit.assert(ctrl.getChildAt(1) instanceof segmentedBar.SegmentedBar, "Expected result: Label!; Actual result: " + ctrl.getChildAt(0));
 };
 
@@ -367,20 +377,20 @@ export function test_parse_ShouldParseCustomComponentWithoutXmlFromTNSModules()
     var p = <page.Page>builder.parse('<Page xmlns' + ':customControls="tns_modules/ui/label"><customControls:Label /></Page>');
     var ctrl = p.content;
 
-    TKUnit.assert(ctrl instanceof labelModule.Label, "Expected result: custom control is defined!; Actual result: " + ctrl);
+    TKUnit.assert(ctrl instanceof Label, "Expected result: custom control is defined!; Actual result: " + ctrl);
 };
 
 export function test_parse_ShouldParseCustomComponentWithoutXmlFromTNSModulesWhenNotSpecified() {
     var p = <page.Page>builder.parse('<Page xmlns' + ':customControls="ui/label"><customControls:Label /></Page>');
     var ctrl = p.content;
 
-    TKUnit.assert(ctrl instanceof labelModule.Label, "Expected result: custom control is defined!; Actual result: " + ctrl);
+    TKUnit.assert(ctrl instanceof Label, "Expected result: custom control is defined!; Actual result: " + ctrl);
 };
 
 export function test_parse_ShouldParseCustomComponentWithXml() {
     var p = <page.Page>builder.parse('<Page xmlns:customControls="xml-declaration/mymodulewithxml"><customControls:MyControl /></Page>');
     var panel = <stackLayoutModule.StackLayout>p.content;
-    var lbl = <labelModule.Label>panel.getChildAt(0);
+    var lbl = <Label>panel.getChildAt(0);
 
     TKUnit.assert(lbl.text === "mymodulewithxml", "Expected result: 'mymodulewithxml'; Actual result: " + lbl);
 };
@@ -402,7 +412,7 @@ export function test_parse_ShouldParseCustomComponentWithXml_WithCustomAttribute
 export function test_parse_ShouldParseCustomComponentWithXmlNoJS() {
     var p = <page.Page>builder.parse('<Page xmlns:customControls="xml-declaration/mymodulewithxml"><customControls:my-control-no-js /></Page>');
     var panel = <stackLayoutModule.StackLayout>p.content;
-    var lbl = <labelModule.Label>panel.getChildAt(0);
+    var lbl = <Label>panel.getChildAt(0);
 
     TKUnit.assertEqual(lbl.text, "I'm all about taht XML, no JS", "label.text");
 };
@@ -492,15 +502,15 @@ export function test_parse_NestedRepeaters() {
         "    </Repeater.itemTemplate>" +
         "  </Repeater>" +
         "</Page>";
-    var p = <page.Page>builder.parse(pageXML);
+    var p = <Page>builder.parse(pageXML);
 
     function testAction(views: Array<viewModule.View>) {
         p.bindingContext = [["0", "1"], ["2", "3"]];
         TKUnit.wait(0.2);
 
-        var lbls = new Array<labelModule.Label>();
+        var lbls = new Array<Label>();
         view.eachDescendant(p, (v) => {
-            if (v instanceof labelModule.Label) {
+            if (v instanceof Label) {
                 lbls.push(v);
             }
             return true;

apps/ui-tests-app/pages/background.ts

@@ -2,12 +2,12 @@ import view = require("ui/core/view");
 import pages = require("ui/page");
 
 export function applyTap(args) {
-    var page = <pages.Page>view.getAncestor(args.object, "Page");
+    var page = <pages.Page>(<view.View>args.object).page;
     var css = "#test-element { " + args.object.tag + " }";
     page.css = css;
 }
 
 export function resetTap(args) {
-    var page = <pages.Page>view.getAncestor(args.object, "Page");
+    var page = <pages.Page>(<view.View>args.object).page;
     page.css = "";
-}
+}

ui/core/view-common.ts

@@ -55,16 +55,6 @@ export function eachDescendant(view: definition.View, callback: (child: View) =>
     view._eachChildView(localCallback);
 }
 
-export function getAncestor(view: View, typeName: string): definition.View {
-    var parent = view.parent;
-
-    while (parent && parent.typeName !== typeName) {
-        parent = parent.parent;
-    }
-
-    return parent;
-}
-
 var viewIdCounter = 0;
 
 function onCssClassPropertyChanged(data: dependencyObservable.PropertyChangeData) {
@@ -331,6 +321,13 @@ export class View extends proxy.ProxyObject implements definition.View {
         this._setValue(View.isEnabledProperty, value);
     }
 
+    get page(): definition.View {
+        if (this.parent)
+            return this.parent.page;
+
+        return null;
+    }
+
     get isUserInteractionEnabled(): boolean {
         return this._getValue(View.isUserInteractionEnabledProperty);
     }
@@ -710,7 +707,7 @@ export class View extends proxy.ProxyObject implements definition.View {
     }
 
     private _applyStyleFromScope() {
-        var rootPage = getAncestor(this, "Page");
+        var rootPage = this.page;
         if (!rootPage || !rootPage.isLoaded) {
             return;
         }
@@ -933,4 +930,4 @@ export class View extends proxy.ProxyObject implements definition.View {
         animation.target = that;
         return new animationModule.Animation([animation]);
     }
-}
+}

ui/core/view.d.ts

@@ -22,14 +22,6 @@ declare module "ui/core/view" {
      */
     export function eachDescendant(view: View, callback: (child: View) => boolean);
 
-    /**
-     * Gets an ancestor from a given type.
-     * @param view - Starting view (child view).
-     * @param typeName - The type name of the parent container which is looking for.
-     * Returns an instance of a view (if found), otherwise undefined.
-     */
-    export function getAncestor(view: View, typeName: string): View;
-
     /**
      * Defines interface for an optional parameter used to create a view.
      */
@@ -258,7 +250,7 @@ declare module "ui/core/view" {
         parent: View;
 
         /**
-         * Gets is layout is valid. This is read-only property.
+         * Gets is layout is valid. This is a read-only property.
          */
         isLayoutValid: boolean;
 
@@ -266,6 +258,11 @@ declare module "ui/core/view" {
 
         visualState: string;
 
+        /**
+         * Gets owner page. This is a read-only property.
+         */
+        page: View;
+
         /**
          * This is called to find out how big a view should be. The parent supplies constraint information in the width and height parameters.
          * The actual measurement work of a view is performed in onMeasure(int, int), called by this method. Therefore, only onMeasure(int, int) can and must be overridden by subclasses.

ui/page/page-common.ts

@@ -104,6 +104,10 @@ export class Page extends contentView.ContentView implements dts.Page {
         }
     }
 
+    get page(): view.View {
+        return this;
+    }
+
     private _refreshCss(): void {
         if (this._cssApplied) {
             this._resetCssValues();
@@ -263,4 +267,4 @@ export class Page extends contentView.ContentView implements dts.Page {
 
         return super._addViewToNativeVisualTree(view);
     }
-}
+}

ui/styling/visual-state.ts

@@ -19,7 +19,7 @@ export class VisualState {
  * 
  */
 export function goToState(view: viewModule.View, state: string): string {
-    var root = <any>viewModule.getAncestor(view, "Page");
+    var root = <any>view.page;
     if (!root) {
         return undefined;
     }
@@ -90,4 +90,4 @@ function applyProperties(view: viewModule.View, state: VisualState) {
             view.style._setValue(property, state.setters[name], observable.ValueSource.VisualState);
         }
     }
-}
+}

ui/tab-view/tab-view.android.ts

@@ -344,7 +344,7 @@ export class TabView extends common.TabView {
     }
 
     public _addTabs(newItems: Array<definition.TabViewItem>) {
-        var parentPage = <page.Page>view.getAncestor(this, "Page");
+        var parentPage = <page.Page>this.page;
         if (parentPage && parentPage.actionBarHidden) {
             return;
         }
@@ -421,7 +421,7 @@ export class TabView extends common.TabView {
     }
 
     public _removeTabs(oldItems: Array<definition.TabViewItem>) {
-        var parentPage = <page.Page>view.getAncestor(this, "Page");
+        var parentPage = <page.Page>this.page;
         if (parentPage && parentPage.actionBarHidden) {
             return;
         }
@@ -511,4 +511,4 @@ export class TabView extends common.TabView {
         var activity = <android.app.Activity>this._android.getContext();
         return activity.getActionBar();
     }
-} 
+}