From 7c713e1a620baa79418a2ce30abaa5c2c6f44a40 Mon Sep 17 00:00:00 2001 From: Daniel Imhoff Date: Mon, 6 Mar 2017 15:06:35 -0600 Subject: [PATCH] test(e2e): tabs/basic --- src/components/tabs/test/basic/app.module.ts | 310 ------------------ .../tabs/test/basic/app/app.component.ts | 8 + .../tabs/test/basic/app/app.module.ts | 36 ++ .../tabs/test/basic/{ => app}/main.ts | 0 .../basic/components/modal/modal.module.ts | 17 + .../tabs/test/basic/components/modal/modal.ts | 61 ++++ .../tabs/test/basic/components/tab1.ts | 44 +++ .../tabs/test/basic/components/tab2.ts | 53 +++ .../tabs/test/basic/components/tab3.ts | 65 ++++ .../test/basic/pages/tabs-page/tabs.module.ts | 17 + .../tabs/test/basic/pages/tabs-page/tabs.ts | 51 +++ 11 files changed, 352 insertions(+), 310 deletions(-) delete mode 100644 src/components/tabs/test/basic/app.module.ts create mode 100644 src/components/tabs/test/basic/app/app.component.ts create mode 100644 src/components/tabs/test/basic/app/app.module.ts rename src/components/tabs/test/basic/{ => app}/main.ts (100%) create mode 100644 src/components/tabs/test/basic/components/modal/modal.module.ts create mode 100644 src/components/tabs/test/basic/components/modal/modal.ts create mode 100644 src/components/tabs/test/basic/components/tab1.ts create mode 100644 src/components/tabs/test/basic/components/tab2.ts create mode 100644 src/components/tabs/test/basic/components/tab3.ts create mode 100644 src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts create mode 100644 src/components/tabs/test/basic/pages/tabs-page/tabs.ts diff --git a/src/components/tabs/test/basic/app.module.ts b/src/components/tabs/test/basic/app.module.ts deleted file mode 100644 index 9ec336383d..0000000000 --- a/src/components/tabs/test/basic/app.module.ts +++ /dev/null @@ -1,310 +0,0 @@ -import { Component, NgModule } from '@angular/core'; -import { BrowserModule } from '@angular/platform-browser'; -import { Config, IonicApp, IonicModule, App, AlertController, ModalController, ViewController, Tab, Tabs } from '../../../..'; - -// -// Modal -// -@Component({ - template: ` - - - - - - - - Filter Sessions - - - - - - - - - - - Tracks - - - Toggle {{i}} - - - - - - - - - - ` -}) -export class MyModal { - items: any[] = []; - - constructor(private viewCtrl: ViewController, private app: App) { - for (var i = 1; i <= 10; i++) { - this.items.push(i); - } - } - - dismiss() { - // using the injected ViewController this page - // can "dismiss" itself and pass back data - this.viewCtrl.dismiss(); - } - - appNavPop() { - this.app.navPop(); - } -} - -// -// Tab 1 -// -@Component({ - template: ` - - - Settings - - - - - - - Tab 1 - - Item {{i}} {{i}} {{i}} {{i}} - -

- -

-

- -

-
- ` -}) -export class Tab1 { - items: any[] = []; - - constructor(private tabs: Tabs, private app: App) { - for (var i = 1; i <= 250; i++) { - this.items.push(i); - } - } - - selectPrevious() { - this.tabs.select(this.tabs.previousTab()); - } - - appNavPop() { - this.app.navPop(); - } -} - -// -// Tab 2 -// -@Component({ - template: ` - - - Schedule - - - - - - - -

{{session.name}} {{session.name}} {{session.name}}

-

{{session.location}} {{session.location}} {{session.location}}

-
- - - - -
-
-

- -

-

- -

-
- ` -}) -export class Tab2 { - sessions: any[] = []; - - constructor(private tabs: Tabs, private app: App) { - for (var i = 1; i <= 250; i++) { - this.sessions.push({ - name: 'Name ' + i, - location: 'Location: ' + i - }); - } - } - - selectPrevious() { - this.tabs.select(this.tabs.previousTab()); - } - - appNavPop() { - this.app.navPop(); - } -} - -// -// Tab 3 -// -@Component({ - template: ` - - - - Stopwatch - - - - -

Tab 3

-

- - -

-

- - -

- - - - - Item: {{item}} - - - - -
- ` -}) -export class Tab3 { - items: number[] = []; - - constructor(private alertCtrl: AlertController, private modalCtrl: ModalController, private tabs: Tabs, private app: App) { - for (var i = 0; i < 100; i++) { - this.items.push(i); - } - } - - presentAlert() { - let alert = this.alertCtrl.create({ - title: 'Alert Title!', - buttons: ['Dismiss'] - }); - alert.present(); - } - - presentModal() { - this.modalCtrl.create(MyModal).present(); - } - - selectPrevious() { - this.tabs.select(this.tabs.previousTab()); - } - - appNavPop() { - this.app.navPop(); - } -} - - -@Component({ - template: ` - - - - Menu - - - - - - - - - - - - - - - - - ` -}) -export class TabsPage { - root1 = Tab1; - root2 = Tab2; - root3 = Tab3; - myColor: string; - - constructor(config: Config) { - this.myColor = (config.get('mode') !== 'ios') ? 'primary' : null; - } - - onChange(ev: Tab) { - console.log('Changed tab', ev); - } - - onSelect(ev: Tab) { - console.log('Selected tab', ev); - } -} - -@Component({ - template: `` -}) -export class E2EApp { - root = TabsPage; -} - -@NgModule({ - declarations: [ - E2EApp, - MyModal, - Tab1, - Tab2, - Tab3, - TabsPage - ], - imports: [ - BrowserModule, - IonicModule.forRoot(E2EApp, { - tabsHighlight: true, - }) - ], - bootstrap: [IonicApp], - entryComponents: [ - E2EApp, - MyModal, - Tab1, - Tab2, - Tab3, - TabsPage - ] -}) -export class AppModule {} diff --git a/src/components/tabs/test/basic/app/app.component.ts b/src/components/tabs/test/basic/app/app.component.ts new file mode 100644 index 0000000000..46db227ce4 --- /dev/null +++ b/src/components/tabs/test/basic/app/app.component.ts @@ -0,0 +1,8 @@ +import { Component } from '@angular/core'; + +@Component({ + template: `` +}) +export class E2EApp { + root = 'TabsPage'; +} diff --git a/src/components/tabs/test/basic/app/app.module.ts b/src/components/tabs/test/basic/app/app.module.ts new file mode 100644 index 0000000000..465bcfba47 --- /dev/null +++ b/src/components/tabs/test/basic/app/app.module.ts @@ -0,0 +1,36 @@ +import { NgModule } from '@angular/core'; +import { BrowserModule } from '@angular/platform-browser'; +import { IonicApp, IonicModule } from '../../../../..'; + +import { E2EApp } from './app.component'; +import { Tab1 } from '../components/tab1'; +import { Tab2 } from '../components/tab2'; +import { Tab3 } from '../components/tab3'; + +@NgModule({ + declarations: [ + E2EApp, + Tab1, + Tab2, + Tab3, + ], + imports: [ + BrowserModule, + IonicModule.forRoot(E2EApp, { + tabsHighlight: true, + }, { + links: [ + { loadChildren: '../pages/tabs-page/tabs.module#TabsPageModule', name: 'TabsPage' }, + { loadChildren: '../components/modal/modal.module#MyModalModule', name: 'MyModal' }, + ] + }) + ], + bootstrap: [IonicApp], + entryComponents: [ + E2EApp, + Tab1, + Tab2, + Tab3, + ] +}) +export class AppModule {} diff --git a/src/components/tabs/test/basic/main.ts b/src/components/tabs/test/basic/app/main.ts similarity index 100% rename from src/components/tabs/test/basic/main.ts rename to src/components/tabs/test/basic/app/main.ts diff --git a/src/components/tabs/test/basic/components/modal/modal.module.ts b/src/components/tabs/test/basic/components/modal/modal.module.ts new file mode 100644 index 0000000000..7d130f277f --- /dev/null +++ b/src/components/tabs/test/basic/components/modal/modal.module.ts @@ -0,0 +1,17 @@ +import { NgModule } from '@angular/core'; +import { DeepLinkModule } from '../../../../../..'; + +import { MyModal } from './modal'; + +@NgModule({ + declarations: [ + MyModal, + ], + imports: [ + DeepLinkModule.forChild(MyModal) + ], + entryComponents: [ + MyModal, + ] +}) +export class MyModalModule {} diff --git a/src/components/tabs/test/basic/components/modal/modal.ts b/src/components/tabs/test/basic/components/modal/modal.ts new file mode 100644 index 0000000000..f68a0fe5ef --- /dev/null +++ b/src/components/tabs/test/basic/components/modal/modal.ts @@ -0,0 +1,61 @@ +import { Component } from '@angular/core'; +import { App, AlertController, ViewController } from '../../../../../..'; + +@Component({ + template: ` + + + + + + + + Filter Sessions + + + + + + + + + + + Tracks + + + Toggle {{i}} + + + + + + + + + + ` +}) +export class MyModal { + items: any[] = []; + + constructor(private viewCtrl: ViewController, private app: App) { + for (var i = 1; i <= 10; i++) { + this.items.push(i); + } + } + + dismiss() { + // using the injected ViewController this page + // can "dismiss" itself and pass back data + this.viewCtrl.dismiss(); + } + + appNavPop() { + this.app.navPop(); + } +} diff --git a/src/components/tabs/test/basic/components/tab1.ts b/src/components/tabs/test/basic/components/tab1.ts new file mode 100644 index 0000000000..93d30af186 --- /dev/null +++ b/src/components/tabs/test/basic/components/tab1.ts @@ -0,0 +1,44 @@ +import { Component } from '@angular/core'; +import { App, Tabs } from '../../../../..'; + +@Component({ + template: ` + + + Settings + + + + + + + Tab 1 + + Item {{i}} {{i}} {{i}} {{i}} + +

+ +

+

+ +

+
+ ` +}) +export class Tab1 { + items: any[] = []; + + constructor(private tabs: Tabs, private app: App) { + for (var i = 1; i <= 250; i++) { + this.items.push(i); + } + } + + selectPrevious() { + this.tabs.select(this.tabs.previousTab()); + } + + appNavPop() { + this.app.navPop(); + } +} diff --git a/src/components/tabs/test/basic/components/tab2.ts b/src/components/tabs/test/basic/components/tab2.ts new file mode 100644 index 0000000000..3cd06b9db9 --- /dev/null +++ b/src/components/tabs/test/basic/components/tab2.ts @@ -0,0 +1,53 @@ +import { Component } from '@angular/core'; +import { App, Tabs } from '../../../../..'; + +@Component({ + template: ` + + + Schedule + + + + + + + +

{{session.name}} {{session.name}} {{session.name}}

+

{{session.location}} {{session.location}} {{session.location}}

+
+ + + + +
+
+

+ +

+

+ +

+
+ ` +}) +export class Tab2 { + sessions: any[] = []; + + constructor(private tabs: Tabs, private app: App) { + for (var i = 1; i <= 250; i++) { + this.sessions.push({ + name: 'Name ' + i, + location: 'Location: ' + i + }); + } + } + + selectPrevious() { + this.tabs.select(this.tabs.previousTab()); + } + + appNavPop() { + this.app.navPop(); + } +} diff --git a/src/components/tabs/test/basic/components/tab3.ts b/src/components/tabs/test/basic/components/tab3.ts new file mode 100644 index 0000000000..ae976c3c00 --- /dev/null +++ b/src/components/tabs/test/basic/components/tab3.ts @@ -0,0 +1,65 @@ +import { Component } from '@angular/core'; +import { App, AlertController, ModalController, Tabs } from '../../../../..'; + +@Component({ + template: ` + + + + Stopwatch + + + + +

Tab 3

+

+ + +

+

+ + +

+ + + + + Item: {{item}} + + + + +
+ ` +}) +export class Tab3 { + items: number[] = []; + + constructor(private alertCtrl: AlertController, private modalCtrl: ModalController, private tabs: Tabs, private app: App) { + for (var i = 0; i < 100; i++) { + this.items.push(i); + } + } + + presentAlert() { + let alert = this.alertCtrl.create({ + title: 'Alert Title!', + buttons: ['Dismiss'] + }); + alert.present(); + } + + presentModal() { + this.modalCtrl.create('MyModal').present(); + } + + selectPrevious() { + this.tabs.select(this.tabs.previousTab()); + } + + appNavPop() { + this.app.navPop(); + } +} diff --git a/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts b/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts new file mode 100644 index 0000000000..75e3e2ff5c --- /dev/null +++ b/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts @@ -0,0 +1,17 @@ +import { NgModule } from '@angular/core'; +import { DeepLinkModule } from '../../../../../..'; + +import { TabsPage } from './tabs'; + +@NgModule({ + declarations: [ + TabsPage, + ], + imports: [ + DeepLinkModule.forChild(TabsPage) + ], + entryComponents: [ + TabsPage, + ] +}) +export class TabsPageModule {} diff --git a/src/components/tabs/test/basic/pages/tabs-page/tabs.ts b/src/components/tabs/test/basic/pages/tabs-page/tabs.ts new file mode 100644 index 0000000000..a33f3db31f --- /dev/null +++ b/src/components/tabs/test/basic/pages/tabs-page/tabs.ts @@ -0,0 +1,51 @@ +import { Component } from '@angular/core'; +import { Config, Tab } from '../../../../../..'; + +import { Tab1 } from '../../components/tab1'; +import { Tab2 } from '../../components/tab2'; +import { Tab3 } from '../../components/tab3'; + +@Component({ + template: ` + + + + Menu + + + + + + + + + + + + + + + + + ` +}) +export class TabsPage { + root1 = Tab1; + root2 = Tab2; + root3 = Tab3; + myColor: string; + + constructor(config: Config) { + this.myColor = (config.get('mode') !== 'ios') ? 'primary' : null; + } + + onChange(ev: Tab) { + console.log('Changed tab', ev); + } + + onSelect(ev: Tab) { + console.log('Selected tab', ev); + } +}