From 2d0e0bafea4703632994454ab763aa98d18df682 Mon Sep 17 00:00:00 2001 From: Manu MA Date: Wed, 28 Nov 2018 18:17:44 +0100 Subject: [PATCH] test(angular): add navigation tests (#16494) --- angular/src/providers/nav-controller.ts | 3 +- angular/test/test-app/README.md | 4 - .../test/test-app/e2e/src/inputs.e2e-spec.ts | 18 +-- .../test/test-app/e2e/src/modal.e2e-spec.ts | 28 ++++ .../test-app/e2e/src/router-link.e2e-spec.ts | 123 ++++++++++++++++++ angular/test/test-app/e2e/src/utils.ts | 50 +++++++ angular/test/test-app/package.json | 5 +- angular/test/test-app/scripts/build-ionic.sh | 14 ++ angular/test/test-app/scripts/sync.sh | 7 + .../test-app/src/app/app-routing.module.ts | 15 ++- angular/test/test-app/src/app/app.module.ts | 17 ++- .../app/home-page/home-page.component.html | 27 ++++ .../src/app/home-page/home-page.component.ts | 9 ++ .../app/inputs-test/inputs-test.component.css | 0 .../inputs.component.html} | 0 .../inputs.component.ts} | 9 +- .../modal-example.component.html | 20 +++ .../modal-example/modal-example.component.ts | 41 ++++++ .../src/app/modal/modal.component.html | 16 +++ .../test-app/src/app/modal/modal.component.ts | 38 ++++++ .../router-link-page.component.html | 15 +++ .../router-link-page.component.ts | 30 +++++ .../router-link/router-link.component.html | 34 +++++ .../app/router-link/router-link.component.ts | 53 ++++++++ core/api.txt | 1 - core/src/components/select/readme.md | 1 - core/src/components/select/select.ios.scss | 1 - core/src/components/select/select.md.scss | 1 - core/src/components/select/select.scss | 7 - .../components/select/test/basic/index.html | 8 +- 30 files changed, 547 insertions(+), 48 deletions(-) create mode 100644 angular/test/test-app/e2e/src/modal.e2e-spec.ts create mode 100644 angular/test/test-app/e2e/src/router-link.e2e-spec.ts create mode 100644 angular/test/test-app/e2e/src/utils.ts create mode 100644 angular/test/test-app/scripts/build-ionic.sh create mode 100644 angular/test/test-app/scripts/sync.sh create mode 100644 angular/test/test-app/src/app/home-page/home-page.component.html create mode 100644 angular/test/test-app/src/app/home-page/home-page.component.ts delete mode 100644 angular/test/test-app/src/app/inputs-test/inputs-test.component.css rename angular/test/test-app/src/app/{inputs-test/inputs-test.component.html => inputs/inputs.component.html} (100%) rename angular/test/test-app/src/app/{inputs-test/inputs-test.component.ts => inputs/inputs.component.ts} (73%) create mode 100644 angular/test/test-app/src/app/modal-example/modal-example.component.html create mode 100644 angular/test/test-app/src/app/modal-example/modal-example.component.ts create mode 100644 angular/test/test-app/src/app/modal/modal.component.html create mode 100644 angular/test/test-app/src/app/modal/modal.component.ts create mode 100644 angular/test/test-app/src/app/router-link-page/router-link-page.component.html create mode 100644 angular/test/test-app/src/app/router-link-page/router-link-page.component.ts create mode 100644 angular/test/test-app/src/app/router-link/router-link.component.html create mode 100644 angular/test/test-app/src/app/router-link/router-link.component.ts diff --git a/angular/src/providers/nav-controller.ts b/angular/src/providers/nav-controller.ts index 007e016b4c..6332f1c1ee 100644 --- a/angular/src/providers/nav-controller.ts +++ b/angular/src/providers/nav-controller.ts @@ -23,7 +23,7 @@ export class NavController { if (ev instanceof NavigationStart) { const id = (ev.restoredState) ? ev.restoredState.navigationId : ev.id; this.guessDirection = id < this.lastNavId ? 'back' : 'forward'; - this.lastNavId = id; + this.lastNavId = this.guessDirection === 'forward' ? ev.id : id; } }); @@ -77,6 +77,7 @@ export class NavController { if (this.direction === 'auto') { direction = this.guessDirection; + console.log('guessed', direction); animated = direction !== 'root'; } else { animated = this.animated; diff --git a/angular/test/test-app/README.md b/angular/test/test-app/README.md index b269b76d04..5cf3f0ad5d 100644 --- a/angular/test/test-app/README.md +++ b/angular/test/test-app/README.md @@ -14,10 +14,6 @@ Run `ng generate component component-name` to generate a new component. You can Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. -## Running unit tests - -Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). - ## Running end-to-end tests Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). diff --git a/angular/test/test-app/e2e/src/inputs.e2e-spec.ts b/angular/test/test-app/e2e/src/inputs.e2e-spec.ts index eecd29d4f1..7049dcaf9e 100644 --- a/angular/test/test-app/e2e/src/inputs.e2e-spec.ts +++ b/angular/test/test-app/e2e/src/inputs.e2e-spec.ts @@ -1,9 +1,10 @@ import { browser, element, by } from 'protractor'; +import { getProperty, setProperty } from './utils'; -describe('input', () => { +describe('inputs', () => { beforeEach(async () => { - await browser.get('/inputs-test'); + await browser.get('/inputs'); }); it('should have default values', async () => { @@ -42,16 +43,3 @@ describe('input', () => { expect(await element(by.css('#range-note')).getText()).toEqual('20'); }); }); - -function getProperty(selector: string, property: string) { - return browser.executeScript(` - return document.querySelector('${selector}')['${property}']; - `); -} - -function setProperty(selector: string, property: string, value: any) { - const text = JSON.stringify(value); - return browser.executeScript(` - document.querySelector('${selector}')['${property}'] = ${text}; - `); -} diff --git a/angular/test/test-app/e2e/src/modal.e2e-spec.ts b/angular/test/test-app/e2e/src/modal.e2e-spec.ts new file mode 100644 index 0000000000..55599837fb --- /dev/null +++ b/angular/test/test-app/e2e/src/modal.e2e-spec.ts @@ -0,0 +1,28 @@ +import { browser, element, by } from 'protractor'; +import { waitTime, getText } from './utils'; + +describe('modals', () => { + + beforeEach(async () => { + await browser.get('/modals'); + }); + + it('should open and close', async () => { + await element(by.css('#action-button')).click(); + + await waitTime(1000); + + const modal = element(by.css('app-modal-example')); + expect(await modal.$('h2').getText()).toEqual('123'); + + expect(await getText('#onWillDismiss')).toEqual('false'); + expect(await getText('#onDidDismiss')).toEqual('false'); + + await modal.$('#close-modal').click(); + await waitTime(1000); + + expect(await getText('#onWillDismiss')).toEqual('true'); + expect(await getText('#onDidDismiss')).toEqual('true'); + }); + +}); diff --git a/angular/test/test-app/e2e/src/router-link.e2e-spec.ts b/angular/test/test-app/e2e/src/router-link.e2e-spec.ts new file mode 100644 index 0000000000..5378658fa8 --- /dev/null +++ b/angular/test/test-app/e2e/src/router-link.e2e-spec.ts @@ -0,0 +1,123 @@ +import { browser, element, by } from 'protractor'; +import { waitTime, testStack, testLifeCycle } from './utils'; + +describe('router-link', () => { + + beforeEach(async () => { + await browser.get('/router-link'); + }); + + it('should have correct lifecycle counts', async () => { + await testLifeCycle('app-router-link', { + ionViewWillEnter: 1, + ionViewDidEnter: 1, + ionViewWillLeave: 0, + ionViewDidLeave: 0, + }); + }); + + describe('forward', () => { + it('should go forward with ion-button[href]', async () => { + await element(by.css('#href')).click(); + await testForward(); + }); + + it('should go forward with ion-button[routerLink]', async () => { + await element(by.css('#routerLink')).click(); + await testForward(); + }); + + it('should go forward with a[routerLink]', async () => { + await element(by.css('#a')).click(); + await testForward(); + }); + + it('should go forward with button + navigateForward', async () => { + await element(by.css('#button-forward')).click(); + await testForward(); + }); + }); + + describe('root', () => { + it('should go root with ion-button[href][routerDirection=root]', async () => { + await element(by.css('#href-root')).click(); + await testRoot(); + }); + + it('should go root with ion-button[routerLink][routerDirection=root]', async () => { + await element(by.css('#routerLink-root')).click(); + await testRoot(); + }); + + it('should go root with a[routerLink][routerDirection=root]', async () => { + await element(by.css('#a-root')).click(); + await testRoot(); + }); + + it('should go root with button + navigateRoot', async () => { + await element(by.css('#button-root')).click(); + await testRoot(); + }); + }); + + describe('back', () => { + it('should go back with ion-button[href][routerDirection=back]', async () => { + await element(by.css('#href-back')).click(); + await testBack(); + }); + + it('should go back with ion-button[routerLink][routerDirection=back]', async () => { + await element(by.css('#routerLink-back')).click(); + await testBack(); + }); + + it('should go back with a[routerLink][routerDirection=back]', async () => { + await element(by.css('#a-back')).click(); + await testBack(); + }); + + it('should go back with button + navigateBack', async () => { + await element(by.css('#button-back')).click(); + await testBack(); + }); + }); +}); + +async function testForward() { + await waitTime(500); + await testStack('ion-router-outlet', ['app-router-link', 'app-router-link-page']); + await testLifeCycle('app-router-link', { + ionViewWillEnter: 1, + ionViewDidEnter: 1, + ionViewWillLeave: 1, + ionViewDidLeave: 1, + }); + await testLifeCycle('app-router-link-page', { + ionViewWillEnter: 1, + ionViewDidEnter: 1, + ionViewWillLeave: 0, + ionViewDidLeave: 0, + }); +} + +async function testRoot() { + await waitTime(50); + await testStack('ion-router-outlet', ['app-router-link-page']); + await testLifeCycle('app-router-link-page', { + ionViewWillEnter: 1, + ionViewDidEnter: 1, + ionViewWillLeave: 0, + ionViewDidLeave: 0, + }); +} + +async function testBack() { + await waitTime(500); + await testStack('ion-router-outlet', ['app-router-link-page']); + await testLifeCycle('app-router-link-page', { + ionViewWillEnter: 1, + ionViewDidEnter: 1, + ionViewWillLeave: 0, + ionViewDidLeave: 0, + }); +} diff --git a/angular/test/test-app/e2e/src/utils.ts b/angular/test/test-app/e2e/src/utils.ts new file mode 100644 index 0000000000..b3ed3f6ce0 --- /dev/null +++ b/angular/test/test-app/e2e/src/utils.ts @@ -0,0 +1,50 @@ +import { browser, by, element, ElementFinder } from 'protractor'; + +export function getProperty(selector: string, property: string) { + return browser.executeScript(` + return document.querySelector('${selector}')['${property}']; + `); +} + +export function getText(selector: string) { + return browser.executeScript(` + return document.querySelector('${selector}').textContent; + `); +} + +export function setProperty(selector: string, property: string, value: any) { + const text = JSON.stringify(value); + return browser.executeScript(` + document.querySelector('${selector}')['${property}'] = ${text}; + `); +} + +export function waitTime(time: number) { + return new Promise(resolve => { + setTimeout(resolve, time); + }); +} + +export interface LifeCycleCount { + ionViewWillEnter: number; + ionViewDidEnter: number; + ionViewWillLeave: number; + ionViewDidLeave: number; +} + +export async function testLifeCycle(selector: string, expected: LifeCycleCount) { + const page = element(by.css(selector)); + expect(await getText(`${selector} #ionViewWillEnter`)).toEqual(expected.ionViewWillEnter.toString()); + expect(await getText(`${selector} #ionViewDidEnter`)).toEqual(expected.ionViewDidEnter.toString()); + expect(await getText(`${selector} #ionViewWillLeave`)).toEqual(expected.ionViewWillLeave.toString()); + expect(await getText(`${selector} #ionViewDidLeave`)).toEqual(expected.ionViewDidLeave.toString()); +} + +export async function testStack(selector: string, expected: string[]) { + const children = browser.executeScript(` + return Array.from( + document.querySelector('${selector}').children + ).map(el => el.tagName.toLowerCase()); + `); + expect(children).toEqual(expected); +} diff --git a/angular/test/test-app/package.json b/angular/test/test-app/package.json index 276656e5bf..e272ab8608 100644 --- a/angular/test/test-app/package.json +++ b/angular/test/test-app/package.json @@ -4,10 +4,13 @@ "scripts": { "ng": "ng", "start": "ng serve", + "sync:build": "sh scripts/build-ionic.sh", + "sync": "sh scripts/sync.sh", "build": "ng build", "test": "ng test", "lint": "ng lint", - "e2e": "ng e2e" + "e2e": "ng e2e", + "postinstall": "npm run sync:build" }, "private": true, "dependencies": { diff --git a/angular/test/test-app/scripts/build-ionic.sh b/angular/test/test-app/scripts/build-ionic.sh new file mode 100644 index 0000000000..ee8f87f735 --- /dev/null +++ b/angular/test/test-app/scripts/build-ionic.sh @@ -0,0 +1,14 @@ +# Build core +pushd ../../.. + +pushd core +npm run build +npm run link +popd + +pushd angular +npm link @ionic/core +npm run build +popd + +popd diff --git a/angular/test/test-app/scripts/sync.sh b/angular/test/test-app/scripts/sync.sh new file mode 100644 index 0000000000..c35e8bbb8e --- /dev/null +++ b/angular/test/test-app/scripts/sync.sh @@ -0,0 +1,7 @@ +# Copy angular dist +rm -rf node_modules/@ionic/angular/dist +cp -a ../../dist node_modules/@ionic/angular/dist + +# Copy core dist +rm -rf node_modules/@ionic/core/dist +cp -a ../../../core/dist node_modules/@ionic/core/dist diff --git a/angular/test/test-app/src/app/app-routing.module.ts b/angular/test/test-app/src/app/app-routing.module.ts index 75a9a0c422..4443f10543 100644 --- a/angular/test/test-app/src/app/app-routing.module.ts +++ b/angular/test/test-app/src/app/app-routing.module.ts @@ -1,12 +1,17 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; -import { InputsTestComponent } from './inputs-test/inputs-test.component'; +import { InputsComponent } from './inputs/inputs.component'; +import { ModalComponent } from './modal/modal.component'; +import { RouterLinkComponent } from './router-link/router-link.component'; +import { RouterLinkPageComponent } from './router-link-page/router-link-page.component'; +import { HomePageComponent } from './home-page/home-page.component'; const routes: Routes = [ - { - path: 'inputs-test', - component: InputsTestComponent - } + { path: '', component: HomePageComponent }, + { path: 'inputs', component: InputsComponent }, + { path: 'modals', component: ModalComponent }, + { path: 'router-link', component: RouterLinkComponent }, + { path: 'router-link-page', component: RouterLinkPageComponent } ]; @NgModule({ diff --git a/angular/test/test-app/src/app/app.module.ts b/angular/test/test-app/src/app/app.module.ts index 739b3d8acd..a388acc4ce 100644 --- a/angular/test/test-app/src/app/app.module.ts +++ b/angular/test/test-app/src/app/app.module.ts @@ -5,12 +5,22 @@ import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { IonicModule } from '@ionic/angular'; import { FormsModule } from '@angular/forms'; -import { InputsTestComponent } from './inputs-test/inputs-test.component'; +import { InputsComponent } from './inputs/inputs.component'; +import { ModalComponent } from './modal/modal.component'; +import { ModalExampleComponent } from './modal-example/modal-example.component'; +import { RouterLinkComponent } from './router-link/router-link.component'; +import { RouterLinkPageComponent } from './router-link-page/router-link-page.component'; +import { HomePageComponent } from './home-page/home-page.component'; @NgModule({ declarations: [ AppComponent, - InputsTestComponent + InputsComponent, + ModalComponent, + ModalExampleComponent, + RouterLinkComponent, + RouterLinkPageComponent, + HomePageComponent ], imports: [ BrowserModule, @@ -18,6 +28,9 @@ import { InputsTestComponent } from './inputs-test/inputs-test.component'; FormsModule, IonicModule.forRoot(), ], + entryComponents: [ + ModalExampleComponent + ], providers: [], bootstrap: [AppComponent] }) diff --git a/angular/test/test-app/src/app/home-page/home-page.component.html b/angular/test/test-app/src/app/home-page/home-page.component.html new file mode 100644 index 0000000000..5167216b56 --- /dev/null +++ b/angular/test/test-app/src/app/home-page/home-page.component.html @@ -0,0 +1,27 @@ + + + + Test App + + + + + + + + Inputs test + + + + + Modals test + + + + + Router link test + + + + + \ No newline at end of file diff --git a/angular/test/test-app/src/app/home-page/home-page.component.ts b/angular/test/test-app/src/app/home-page/home-page.component.ts new file mode 100644 index 0000000000..493cdb1389 --- /dev/null +++ b/angular/test/test-app/src/app/home-page/home-page.component.ts @@ -0,0 +1,9 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-home-page', + templateUrl: './home-page.component.html', +}) +export class HomePageComponent { + +} diff --git a/angular/test/test-app/src/app/inputs-test/inputs-test.component.css b/angular/test/test-app/src/app/inputs-test/inputs-test.component.css deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/angular/test/test-app/src/app/inputs-test/inputs-test.component.html b/angular/test/test-app/src/app/inputs/inputs.component.html similarity index 100% rename from angular/test/test-app/src/app/inputs-test/inputs-test.component.html rename to angular/test/test-app/src/app/inputs/inputs.component.html diff --git a/angular/test/test-app/src/app/inputs-test/inputs-test.component.ts b/angular/test/test-app/src/app/inputs/inputs.component.ts similarity index 73% rename from angular/test/test-app/src/app/inputs-test/inputs-test.component.ts rename to angular/test/test-app/src/app/inputs/inputs.component.ts index 8b9916d95e..f0aec7976f 100644 --- a/angular/test/test-app/src/app/inputs-test/inputs-test.component.ts +++ b/angular/test/test-app/src/app/inputs/inputs.component.ts @@ -1,11 +1,10 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ - selector: 'app-inputs-test', - templateUrl: './inputs-test.component.html', - styleUrls: ['./inputs-test.component.css'] + selector: 'app-inputs', + templateUrl: './inputs.component.html', }) -export class InputsTestComponent { +export class InputsComponent { datetime: string; input: string; diff --git a/angular/test/test-app/src/app/modal-example/modal-example.component.html b/angular/test/test-app/src/app/modal-example/modal-example.component.html new file mode 100644 index 0000000000..bdac0eb30d --- /dev/null +++ b/angular/test/test-app/src/app/modal-example/modal-example.component.html @@ -0,0 +1,20 @@ + + + + + Close + + + + + + +

Value

+

{{value}}

+ +

ionViewWillEnter: {{willEnter}}

+

ionViewDidEnter: {{didEnter}}

+

ionViewWillLeave: {{willLeave}}

+

ionViewDidLeave: {{didLeave}}

+ +
diff --git a/angular/test/test-app/src/app/modal-example/modal-example.component.ts b/angular/test/test-app/src/app/modal-example/modal-example.component.ts new file mode 100644 index 0000000000..2505935a08 --- /dev/null +++ b/angular/test/test-app/src/app/modal-example/modal-example.component.ts @@ -0,0 +1,41 @@ +import { Component, Input, NgZone } from '@angular/core'; +import { ModalController } from '@ionic/angular'; + +@Component({ + selector: 'app-modal-example', + templateUrl: './modal-example.component.html', +}) +export class ModalExampleComponent { + + @Input() value: string; + + willEnter = 0; + didEnter = 0; + willLeave = 0; + didLeave = 0; + + constructor( + private modalCtrl: ModalController + ) {} + + ionViewWillEnter() { + NgZone.assertInAngularZone(); + this.willEnter++; + } + ionViewDidEnter() { + NgZone.assertInAngularZone(); + this.didEnter++; + } + ionViewWillLeave() { + NgZone.assertInAngularZone(); + this.willLeave++; + } + ionViewDidLeave() { + NgZone.assertInAngularZone(); + this.didLeave++; + } + + closeModal() { + this.modalCtrl.dismiss(); + } +} diff --git a/angular/test/test-app/src/app/modal/modal.component.html b/angular/test/test-app/src/app/modal/modal.component.html new file mode 100644 index 0000000000..bcb3112ea1 --- /dev/null +++ b/angular/test/test-app/src/app/modal/modal.component.html @@ -0,0 +1,16 @@ + + + + Modal test + + + + + Open Modal +

+ onWillDismiss: {{onWillDismiss}} +

+

+ onDidDismiss: {{onDidDismiss}} +

+
diff --git a/angular/test/test-app/src/app/modal/modal.component.ts b/angular/test/test-app/src/app/modal/modal.component.ts new file mode 100644 index 0000000000..7c7a0fb8d4 --- /dev/null +++ b/angular/test/test-app/src/app/modal/modal.component.ts @@ -0,0 +1,38 @@ +import { Component, OnInit, NgZone } from '@angular/core'; +import { ModalController } from '@ionic/angular'; +import { ModalExampleComponent } from '../modal-example/modal-example.component'; + +@Component({ + selector: 'app-modal', + templateUrl: './modal.component.html', +}) +export class ModalComponent { + + onWillDismiss = false; + onDidDismiss = false; + + constructor( + private modalCtrl: ModalController + ) { } + + async openModal() { + const modal = await this.modalCtrl.create({ + component: ModalExampleComponent, + componentProps: { + value: '123' + } + }); + await modal.present(); + modal.onWillDismiss().then(() => { + NgZone.assertInAngularZone(); + this.onWillDismiss = true; + }); + modal.onDidDismiss().then(() => { + NgZone.assertInAngularZone(); + if (!this.onWillDismiss) { + throw new Error('onWillDismiss should be emited first'); + } + this.onDidDismiss = true; + }); + } +} diff --git a/angular/test/test-app/src/app/router-link-page/router-link-page.component.html b/angular/test/test-app/src/app/router-link-page/router-link-page.component.html new file mode 100644 index 0000000000..c9d499e405 --- /dev/null +++ b/angular/test/test-app/src/app/router-link-page/router-link-page.component.html @@ -0,0 +1,15 @@ + + + + + + + + + + router-link page +

ionViewWillEnter: {{willEnter}}

+

ionViewDidEnter: {{didEnter}}

+

ionViewWillLeave: {{willLeave}}

+

ionViewDidLeave: {{didLeave}}

+
diff --git a/angular/test/test-app/src/app/router-link-page/router-link-page.component.ts b/angular/test/test-app/src/app/router-link-page/router-link-page.component.ts new file mode 100644 index 0000000000..599e072718 --- /dev/null +++ b/angular/test/test-app/src/app/router-link-page/router-link-page.component.ts @@ -0,0 +1,30 @@ +import { Component, OnInit, NgZone } from '@angular/core'; + +@Component({ + selector: 'app-router-link-page', + templateUrl: './router-link-page.component.html', +}) +export class RouterLinkPageComponent { + + willEnter = 0; + didEnter = 0; + willLeave = 0; + didLeave = 0; + + ionViewWillEnter() { + NgZone.assertInAngularZone(); + this.willEnter++; + } + ionViewDidEnter() { + NgZone.assertInAngularZone(); + this.didEnter++; + } + ionViewWillLeave() { + NgZone.assertInAngularZone(); + this.willLeave++; + } + ionViewDidLeave() { + NgZone.assertInAngularZone(); + this.didLeave++; + } +} diff --git a/angular/test/test-app/src/app/router-link/router-link.component.html b/angular/test/test-app/src/app/router-link/router-link.component.html new file mode 100644 index 0000000000..33321bf34b --- /dev/null +++ b/angular/test/test-app/src/app/router-link/router-link.component.html @@ -0,0 +1,34 @@ + + + + Router Link Test + + + + +

ionViewWillEnter: {{willEnter}}

+

ionViewDidEnter: {{didEnter}}

+

ionViewWillLeave: {{willLeave}}

+

ionViewDidLeave: {{didLeave}}

+ +

+ ion-button[href] + ion-button[href] (direction:root) + ion-button[href] (direction:back) +

+

+ ion-button[routerLink] + ion-button[routerLink] (direction:root) + ion-button[routerLink] (direction:back) +

+ +

a[routerLink]

+

a[routerLink] (direction:root)

+

a[routerLink] (direction:back)

+ +

+

+

+

+ +
diff --git a/angular/test/test-app/src/app/router-link/router-link.component.ts b/angular/test/test-app/src/app/router-link/router-link.component.ts new file mode 100644 index 0000000000..89320701aa --- /dev/null +++ b/angular/test/test-app/src/app/router-link/router-link.component.ts @@ -0,0 +1,53 @@ +import { Component, NgZone } from '@angular/core'; +import { NavController } from '@ionic/angular'; +import { Router } from '@angular/router'; + +@Component({ + selector: 'app-router-link', + templateUrl: './router-link.component.html', +}) +export class RouterLinkComponent { + + willEnter = 0; + didEnter = 0; + willLeave = 0; + didLeave = 0; + + constructor( + private navCtrl: NavController, + private router: Router + ) {} + + navigate() { + this.router.navigateByUrl('/router-link-page'); + } + + navigateForward() { + this.navCtrl.navigateForward('/router-link-page'); + } + + navigateBack() { + this.navCtrl.navigateBack('/router-link-page'); + } + + navigateRoot() { + this.navCtrl.navigateRoot('/router-link-page'); + } + + ionViewWillEnter() { + NgZone.assertInAngularZone(); + this.willEnter++; + } + ionViewDidEnter() { + NgZone.assertInAngularZone(); + this.didEnter++; + } + ionViewWillLeave() { + NgZone.assertInAngularZone(); + this.willLeave++; + } + ionViewDidLeave() { + NgZone.assertInAngularZone(); + this.didLeave++; + } +} diff --git a/core/api.txt b/core/api.txt index a406b244a3..8067ad9c0d 100644 --- a/core/api.txt +++ b/core/api.txt @@ -939,7 +939,6 @@ ion-select,event,ionBlur,void,true ion-select,event,ionCancel,void,true ion-select,event,ionChange,SelectInputChangeEvent,true ion-select,event,ionFocus,void,true -ion-select,css-prop,--color ion-select,css-prop,--icon-color ion-select,css-prop,--padding-bottom ion-select,css-prop,--padding-end diff --git a/core/src/components/select/readme.md b/core/src/components/select/readme.md index 6c1b9fc576..2fb458e2f8 100644 --- a/core/src/components/select/readme.md +++ b/core/src/components/select/readme.md @@ -90,7 +90,6 @@ Type: `Promise Select - Custom Interface Options - + Alert - Bacon + Bacon Black Olives Extra Cheese Green Peppers @@ -73,7 +73,7 @@ - + Popover Brown @@ -83,7 +83,7 @@ - + Action Sheet Red