From 5f32053edbcaa169e2e349aaa59ea49c379b2585 Mon Sep 17 00:00:00 2001 From: Manu MA Date: Wed, 28 Nov 2018 20:05:50 +0100 Subject: [PATCH] test(angular): add CI (#16496) --- .circleci/config.yml | 40 +++++++++++++++++++ .../src/directives/navigation/tab-delegate.ts | 2 +- .../test/test-app/e2e/src/inputs.e2e-spec.ts | 16 +++++++- angular/test/test-app/e2e/tsconfig.e2e.json | 4 ++ angular/test/test-app/package.json | 7 ++-- .../test-app/src/app/app-routing.module.ts | 4 +- angular/test/test-app/src/app/app.module.ts | 4 +- .../app/home-page/home-page.component.html | 6 ++- .../src/app/home-page/home-page.component.ts | 2 +- .../src/app/inputs/inputs.component.ts | 12 +++--- .../test-app/src/app/tabs/tabs.component.html | 21 ++++++++++ .../test-app/src/app/tabs/tabs.component.ts | 14 +++++++ angular/test/test-app/src/tsconfig.app.json | 4 ++ angular/tsconfig.json | 4 ++ core/stencil.config.ts | 1 - 15 files changed, 124 insertions(+), 17 deletions(-) create mode 100644 angular/test/test-app/src/app/tabs/tabs.component.html create mode 100644 angular/test/test-app/src/app/tabs/tabs.component.ts diff --git a/.circleci/config.yml b/.circleci/config.yml index d9937d3b97..e05a392242 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -63,6 +63,29 @@ jobs: command: npm run build # --max-workers 1 --debug working_directory: /tmp/workspace/core - save_cache: *save-cache-core-stencil + - run: + command: sudo npm link + working_directory: /tmp/workspace/core + - persist_to_workspace: + root: /tmp/workspace + paths: + - "*" + + build-angular: + <<: *defaults + steps: + - checkout + - attach_workspace: + at: /tmp/workspace + - run: + command: npm install + working_directory: /tmp/workspace/angular + - run: + command: sudo npm link @ionic/core + working_directory: /tmp/workspace/angular + - run: + command: npm run build + working_directory: /tmp/workspace/angular - persist_to_workspace: root: /tmp/workspace paths: @@ -131,6 +154,19 @@ jobs: command: npx stencil test --e2e --screenshot --screenshot-connector=scripts/screenshot/ci.js --ci --update-screenshot || true working_directory: /tmp/workspace/core + test-angular: + <<: *defaults + steps: + - checkout + - attach_workspace: + at: /tmp/workspace + - run: + command: npm install + working_directory: /tmp/workspace/angular/test/test-app + - run: + command: npm test + working_directory: /tmp/workspace/angular/test/test-app + workflows: version: 2 build: @@ -138,6 +174,10 @@ workflows: - build - build-core: requires: [build] + - build-angular: + requires: [build-core] + - test-angular: + requires: [build-angular] - test-core-clean-build: requires: [build-core] - test-core-lint: diff --git a/angular/src/directives/navigation/tab-delegate.ts b/angular/src/directives/navigation/tab-delegate.ts index f36fe698eb..4bf0ebb5c2 100644 --- a/angular/src/directives/navigation/tab-delegate.ts +++ b/angular/src/directives/navigation/tab-delegate.ts @@ -31,7 +31,7 @@ export class TabDelegate { return this.outlet ? this.outlet.getLastUrl() : undefined; } - @HostListener('ionRouterOutletActivated', ['$event']) + @HostListener('ionRouterOutletActivated') async onNavChanged() { const tab = this.nativeEl; await tab.componentOnReady(); 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 7049dcaf9e..40052c35ac 100644 --- a/angular/test/test-app/e2e/src/inputs.e2e-spec.ts +++ b/angular/test/test-app/e2e/src/inputs.e2e-spec.ts @@ -7,7 +7,18 @@ describe('inputs', () => { await browser.get('/inputs'); }); - it('should have default values', async () => { + it('should have default value', async () => { + expect(await getProperty('ion-checkbox', 'checked')).toEqual(true); + expect(await getProperty('ion-toggle', 'checked')).toEqual(true); + expect(await getProperty('ion-input', 'value')).toEqual('some text'); + expect(await getProperty('ion-datetime', 'value')).toEqual('1994-03-15'); + expect(await getProperty('ion-select', 'value')).toEqual('nes'); + expect(await getProperty('ion-range', 'value')).toEqual(10); + }); + + it('should have reset value', async () => { + await element(by.css('#reset-button')).click(); + expect(await getProperty('ion-checkbox', 'checked')).toEqual(false); expect(await getProperty('ion-toggle', 'checked')).toEqual(false); expect(await getProperty('ion-input', 'value')).toEqual(''); @@ -17,6 +28,7 @@ describe('inputs', () => { }); it('should get some value', async () => { + await element(by.css('#reset-button')).click(); await element(by.css('#set-button')).click(); expect(await getProperty('ion-checkbox', 'checked')).toEqual(true); @@ -28,6 +40,8 @@ describe('inputs', () => { }); it('change values should update angular', async () => { + await element(by.css('#reset-button')).click(); + await setProperty('ion-checkbox', 'checked', true); await setProperty('ion-toggle', 'checked', true); await setProperty('ion-input', 'value', 'hola'); diff --git a/angular/test/test-app/e2e/tsconfig.e2e.json b/angular/test/test-app/e2e/tsconfig.e2e.json index a6dd622028..28ffa11a54 100644 --- a/angular/test/test-app/e2e/tsconfig.e2e.json +++ b/angular/test/test-app/e2e/tsconfig.e2e.json @@ -1,4 +1,8 @@ { + "angularCompilerOptions": { + "fullTemplateTypeCheck": true, + "strictMetadataEmit" : true + }, "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", diff --git a/angular/test/test-app/package.json b/angular/test/test-app/package.json index e272ab8608..dae48a4de7 100644 --- a/angular/test/test-app/package.json +++ b/angular/test/test-app/package.json @@ -6,11 +6,10 @@ "start": "ng serve", "sync:build": "sh scripts/build-ionic.sh", "sync": "sh scripts/sync.sh", - "build": "ng build", - "test": "ng test", + "build": "ng build --prod", + "test": "ng e2e --prod", "lint": "ng lint", - "e2e": "ng e2e", - "postinstall": "npm run sync:build" + "postinstall": "npm run sync" }, "private": true, "dependencies": { 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 4443f10543..ed00374582 100644 --- a/angular/test/test-app/src/app/app-routing.module.ts +++ b/angular/test/test-app/src/app/app-routing.module.ts @@ -5,13 +5,15 @@ 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'; +import { TabsComponent } from './tabs/tabs.component'; const routes: Routes = [ { path: '', component: HomePageComponent }, { path: 'inputs', component: InputsComponent }, { path: 'modals', component: ModalComponent }, { path: 'router-link', component: RouterLinkComponent }, - { path: 'router-link-page', component: RouterLinkPageComponent } + { path: 'router-link-page', component: RouterLinkPageComponent }, + { path: 'tabs', component: TabsComponent } ]; @NgModule({ diff --git a/angular/test/test-app/src/app/app.module.ts b/angular/test/test-app/src/app/app.module.ts index a388acc4ce..1cc2fc47e8 100644 --- a/angular/test/test-app/src/app/app.module.ts +++ b/angular/test/test-app/src/app/app.module.ts @@ -11,6 +11,7 @@ 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'; +import { TabsComponent } from './tabs/tabs.component'; @NgModule({ declarations: [ @@ -20,7 +21,8 @@ import { HomePageComponent } from './home-page/home-page.component'; ModalExampleComponent, RouterLinkComponent, RouterLinkPageComponent, - HomePageComponent + HomePageComponent, + TabsComponent ], imports: [ BrowserModule, 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 index 5167216b56..14804473de 100644 --- 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 @@ -22,6 +22,10 @@ Router link test + + + Tabs 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 index 493cdb1389..a5b32ea17f 100644 --- 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 @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-home-page', diff --git a/angular/test/test-app/src/app/inputs/inputs.component.ts b/angular/test/test-app/src/app/inputs/inputs.component.ts index f0aec7976f..93f6ee32f4 100644 --- a/angular/test/test-app/src/app/inputs/inputs.component.ts +++ b/angular/test/test-app/src/app/inputs/inputs.component.ts @@ -6,12 +6,12 @@ import { Component } from '@angular/core'; }) export class InputsComponent { - datetime: string; - input: string; - checkbox = false; - toggle = false; - select: string; - range: number; + datetime = '1994-03-15'; + input = 'some text'; + checkbox = true; + toggle = true; + select = 'nes'; + range = 10; setValues() { console.log('set values'); diff --git a/angular/test/test-app/src/app/tabs/tabs.component.html b/angular/test/test-app/src/app/tabs/tabs.component.html new file mode 100644 index 0000000000..4f81e985f0 --- /dev/null +++ b/angular/test/test-app/src/app/tabs/tabs.component.html @@ -0,0 +1,21 @@ + + + + + + + + + + + + Tab One + + + + + Tab Two + + + + diff --git a/angular/test/test-app/src/app/tabs/tabs.component.ts b/angular/test/test-app/src/app/tabs/tabs.component.ts new file mode 100644 index 0000000000..b32e527986 --- /dev/null +++ b/angular/test/test-app/src/app/tabs/tabs.component.ts @@ -0,0 +1,14 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-tabs', + templateUrl: './tabs.component.html', +}) +export class TabsComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/angular/test/test-app/src/tsconfig.app.json b/angular/test/test-app/src/tsconfig.app.json index 190fd300b6..79d6b1aec4 100644 --- a/angular/test/test-app/src/tsconfig.app.json +++ b/angular/test/test-app/src/tsconfig.app.json @@ -1,4 +1,8 @@ { + "angularCompilerOptions": { + "fullTemplateTypeCheck": true, + "strictMetadataEmit" : true + }, "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", diff --git a/angular/tsconfig.json b/angular/tsconfig.json index c452fd8117..3a88d6c31d 100644 --- a/angular/tsconfig.json +++ b/angular/tsconfig.json @@ -1,4 +1,8 @@ { + "angularCompilerOptions": { + "fullTemplateTypeCheck": true, + "strictMetadataEmit" : true + }, "compilerOptions": { "alwaysStrict": true, "strict": true, diff --git a/core/stencil.config.ts b/core/stencil.config.ts index 1eaed0cadd..ca8dd4d44c 100644 --- a/core/stencil.config.ts +++ b/core/stencil.config.ts @@ -109,7 +109,6 @@ export const config: Config = { // auxiliar 'ion-picker-column', - 'ion-anchor', 'ion-virtual-scroll' ] }