test(searchbar): searchbar + modal

ionic-team · Sep 26, 2016 · 514fed8 · 514fed8
1 parent 8c84cc9
commit 514fed8
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 8 deletions.
diff --git a/src/components/searchbar/searchbar.ts b/src/components/searchbar/searchbar.ts
@@ -418,7 +418,7 @@ export class Searchbar extends Ion {
     this.onTouched = fn;
   }
 
-  focus() {
-    this.getNativeElement().focus();
+  setFocus() {
+    this._renderer.invokeElementMethod(this._searchbarInput.nativeElement, 'focus');
   }
 }
diff --git a/src/components/searchbar/test/nav/app-module.ts b/src/components/searchbar/test/nav/app-module.ts
@@ -1,5 +1,5 @@
 import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule, NavController, NavParams } from '../../../..';
+import { IonicApp, IonicModule, ModalController, NavController, NavParams, ViewController } from '../../../..';
 
 
 @Component({
@@ -13,13 +13,23 @@ export class MainPage {
   }
 }
 
+@Component({
+  templateUrl: 'modal.html'
+})
+export class ModalPage {
+ constructor(public viewCtrl: ViewController) {}
+  close() {
+    this.viewCtrl.dismiss();
+  }
+}
+
 @Component({
   templateUrl: 'search.html'
 })
 export class SearchPage {
   items: string[];
 
-  constructor(public navCtrl: NavController) {
+  constructor(public navCtrl: NavController, public modalCtrl: ModalController) {
     this.initializeItems();
   }
 
@@ -88,6 +98,11 @@ export class SearchPage {
       return false;
     });
   }
+
+  openModal() {
+    let modal = this.modalCtrl.create(ModalPage);
+    modal.present();
+  }
 }
 
 @Component({
@@ -121,6 +136,7 @@ export class E2EApp {
     E2EApp,
     MainPage,
     SearchPage,
+    ModalPage,
     DetailPage,
     TabsPage
   ],
@@ -132,6 +148,7 @@ export class E2EApp {
     E2EApp,
     MainPage,
     SearchPage,
+    ModalPage,
     DetailPage,
     TabsPage
   ]

diff --git a/src/components/searchbar/test/nav/modal.html b/src/components/searchbar/test/nav/modal.html
@@ -0,0 +1,21 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-buttons start>
+      <button ion-button >
+          Does nothing
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button ion-button (click)="close()">
+          Close
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content padding>
+  Close the modal with the button and the searchbar SHOULD NOT become focused.
+  <button ion-button (click)="close()">
+    Close
+  </button>
+</ion-content>
diff --git a/src/components/searchbar/test/nav/search.html b/src/components/searchbar/test/nav/search.html
@@ -1,17 +1,19 @@
 <ion-header>
 
   <ion-navbar no-border-bottom>
-    <ion-title>Searchbar</ion-title>
+    <ion-searchbar color="primary" autofocus (ionInput)="getItems($event)" placeholder="Filter Schedules">
+    </ion-searchbar>
   </ion-navbar>
 
   <ion-toolbar no-border-top>
-    <ion-searchbar color="primary" (ionInput)="getItems($event)" placeholder="Filter Schedules">
-    </ion-searchbar>
+    <ion-title>Searchbar</ion-title>
+    <ion-buttons end>
+      <button ion-button (click)="openModal()">Open modal</button>
+    </ion-buttons>
   </ion-toolbar>
 
 </ion-header>
 
-
 <ion-content>
 
   <form>