Merge branch 'master' into minor-fixes

Author: elena-p

build-docs.sh

@@ -0,0 +1,9 @@
+set -e
+
+ENV="${ENV:-dev}"
+DIST_DIR="nativescript-angular/bin/dist"
+APIREF_DIR="$DIST_DIR/ng-api-reference"
+rm -rf "$APIREF_DIR"
+cd "nativescript-angular"
+npm install
+npm run typedoc

e2e/modal-navigation-ng/app/navigation/basic.navigation.component.ts

@@ -1,4 +1,4 @@
-import { Component, ViewContainerRef, Input } from "@angular/core";
+import { Component, ViewContainerRef, Input, ViewChild, ElementRef } from "@angular/core";
 import { Router, NavigationEnd } from "@angular/router";
 import { ModalDialogService, ModalDialogOptions } from "nativescript-angular/directives/dialogs";
 import { ModalComponent } from "../modal/modal.component";
@@ -17,19 +17,21 @@ import { ModalViewComponent } from "~/modal-shared/modal-view.component";
     <Button text="Show Modal Page With Frame" (tap)="onModalFrame()" textAlignment="left"></Button>
     <Button text="Show Shared Modal" (tap)="onRootModalTap()" textAlignment="left"></Button>
     <Button text="Show Dialog" (tap)="onShowDialog()" textAlignment="left"></Button>
+    <Button #popoverButtonComp text="Show 'popover' modal" (tap)="onPopoverModal()" textAlignment="left"></Button>
 </StackLayout>`
 })
 
 export class BasicsNavigationComponent {
 
+    @ViewChild("popoverButtonComp") popoverButtonComp: ElementRef;
     @Input() col: number;
     constructor(
         private modal: ModalDialogService,
         private router: Router,
         private vcf: ViewContainerRef,
         private viewContainerRefService: ViewContainerRefService) {
     }
- 
+
     onModalNoFrame() {
         const options: ModalDialogOptions = {
             context: {
@@ -74,14 +76,28 @@ export class BasicsNavigationComponent {
 
     onRootModalTap(): void {
         const options: ModalDialogOptions = {
-          viewContainerRef: this.viewContainerRefService.root,
-          context: {},
-          fullscreen: true
+            viewContainerRef: this.viewContainerRefService.root,
+            context: {},
+            fullscreen: true
         };
-     
+
         this.modal.showModal(ModalViewComponent, options)
-        .then((result: string) => {
-          console.log(result);
-        });
-      }
+            .then((result: string) => {
+                console.log(result);
+            });
+    }
+
+    onPopoverModal() {
+        const options: ModalDialogOptions = {
+            viewContainerRef: this.viewContainerRefService.root,
+            context: {},
+            ios: {
+                presentationStyle: UIModalPresentationStyle.Popover
+            },
+            target: this.popoverButtonComp.nativeElement
+        };
+
+        this.modal.showModal(ModalViewComponent, options)
+            .then((result: string) => { console.log(result);});
+    }
 }

e2e/modal-navigation-ng/package.json

@@ -46,6 +46,7 @@
     "nativescript-dev-appium": "next",
     "nativescript-dev-typescript": "next",
     "nativescript-dev-webpack": "next",
+    "tns-platform-declarations": "next",
     "typescript": "~3.1.1"
   },
   "scripts": {

e2e/modal-navigation-ng/references.d.ts

@@ -0,0 +1 @@
+/// <reference path="./node_modules/tns-platform-declarations/ios.d.ts" />

e2e/single-page/app/app.css

@@ -1,5 +1,5 @@
 .title {
-    font-size: 30;
+    font-size: 15;
     margin: 16;
 }
 

e2e/single-page/app/app.module.ts

@@ -11,14 +11,19 @@ import { AppComponent } from "./app.component";
 
 import { rendererTraceCategory, viewUtilCategory, routeReuseStrategyTraceCategory, routerTraceCategory } from "nativescript-angular/trace";
 import { setCategories, enable } from "tns-core-modules/trace";
+import { ModalComponent } from "./second/modal/modal.component";
 setCategories(routerTraceCategory + "," + routeReuseStrategyTraceCategory);
 enable();
 
 @NgModule({
     declarations: [
         AppComponent,
+        ModalComponent,
         ...navigatableComponents,
     ],
+    entryComponents:[
+        ModalComponent
+    ],
     bootstrap: [AppComponent],
     providers: [
         { provide: NgModuleFactoryLoader, useClass: NSModuleFactoryLoader }

e2e/single-page/app/second/modal/modal.component.html

@@ -0,0 +1,4 @@
+<StackLayout>
+    <Label text="Welcome to modal"></Label>
+    <Button text="Close Modal" (tap)="close()"></Button>
+</StackLayout>

e2e/single-page/app/second/modal/modal.component.ts

@@ -0,0 +1,19 @@
+import { Component } from '@angular/core';
+import { ModalDialogParams } from "nativescript-angular/modal-dialog";
+
+@Component({
+    moduleId: module.id,
+    selector: 'modal',
+    templateUrl: './modal.component.html'
+})
+
+export class ModalComponent {
+
+    constructor(private params: ModalDialogParams) {
+    }
+
+    public close() {
+        this.params.closeCallback();
+    }
+
+}

e2e/single-page/app/second/second.component.ts

@@ -1,10 +1,12 @@
-import { Component, OnInit, OnDestroy } from "@angular/core";
+import { Component, OnInit, OnDestroy, ViewContainerRef } from "@angular/core";
 import { ActivatedRoute, Router, Route } from "@angular/router";
 
+import { ModalDialogService, ModalDialogOptions } from "nativescript-angular";
 import { Page } from "tns-core-modules/ui/page";
 import { Observable } from "rxjs";
 import { map } from "rxjs/operators";
 import { RouterExtensions } from "nativescript-angular/router";
+import { ModalComponent } from "./modal/modal.component";
 
 @Component({
     selector: "second",
@@ -19,12 +21,16 @@ import { RouterExtensions } from "nativescript-angular/router";
 
     <StackLayout>
         <Label [text]="'Second Component: ' + (id$ | async)" class="title"></Label>
+        <Button text="Show Modal" (tap)="onShowModal()"></Button>
         <Button text="Back" (tap)="back()"></Button>
     </StackLayout>`
 })
 export class SecondComponent implements OnInit, OnDestroy {
     public id$: Observable<number>;
-    constructor(route: ActivatedRoute, private routerExtensions: RouterExtensions) {
+    constructor(route: ActivatedRoute,
+        private routerExtensions: RouterExtensions,
+        private viewContainerRef: ViewContainerRef,
+        private modalService: ModalDialogService) {
         this.id$ = route.params.pipe(map(r => +r["id"]));
     }
 
@@ -39,4 +45,16 @@ export class SecondComponent implements OnInit, OnDestroy {
     back() {
         this.routerExtensions.back();
     }
+
+    onShowModal() {
+        let options: ModalDialogOptions = {
+            viewContainerRef: this.viewContainerRef,
+            context: {
+            },
+            fullscreen: true
+        };
+
+        this.modalService.showModal(ModalComponent, options).then((dialogResult: string) => {
+        });
+    }
 }

e2e/single-page/e2e/tests.e2e-spec.ts

@@ -19,29 +19,45 @@ describe("Single page app", () => {
     });
 
     it("should load second(1) page", async () => {
-        await findAndClick(driver, "SECOND(1)")
+        await findAndClick(driver, "SECOND(1)");
 
         await driver.findElementByAutomationText("Second Component: 1");
-        
+
         // ActionBar Title and item
         await driver.findElementByAutomationText("Second Title");
         await driver.findElementByAutomationText("ACTION2");
     });
 
     it("should load second(2) page", async () => {
-        await findAndClick(driver, "SECOND(2)")
+        await findAndClick(driver, "SECOND(2)");
+
+        await driver.findElementByAutomationText("Second Component: 2");
 
-        await driver.findElementByAutomationText("Second Component: 1");
-        
         // ActionBar Title and items
         await driver.findElementByAutomationText("Second Title");
         await driver.findElementByAutomationText("ACTION2");
         await driver.findElementByAutomationText("ADD");
     });
+
+    it("should open and close modal view", async () => {
+        await findAndClick(driver, "Show Modal");
+
+        await driver.findElementByAutomationText("Welcome to modal");
+        await findAndClick(driver, "Close Modal");
+
+        await driver.findElementByAutomationText("Second Component: 2");
+    });
+
+    it("should go back to second(1) and first", async () => {
+        await findAndClick(driver, "Back");
+        await driver.findElementByAutomationText("Second Component: 1");
+        await findAndClick(driver, "Back");
+        await driver.findElementByAutomationText("First Title");
+        await driver.findElementByAutomationText("ACTION1");
+    });
 });
 
 async function findAndClick(driver: AppiumDriver, text: string) {
-    const navigationButton =
-        await driver.findElementByAutomationText(text);
-    navigationButton.click();
+    const navigationButton = await driver.findElementByAutomationText(text);
+    await navigationButton.click();
 }