test(searchbar): searchbar + modal

src/components/searchbar/searchbar.ts

@@ -135,7 +135,7 @@ export class Searchbar extends Ion {
   @Input() type: string = 'search';
 
   /**
-   * @input {string|boolean} Set the input's spellcheck property. Values: `true`, `false`. Default `false`.
+   * @input {string|boolean} Configures if the searchbar is animated or no. By default, animation is disabled.
    */
   @Input() animated: string | boolean = false;
 
@@ -357,7 +357,7 @@ export class Searchbar extends Ion {
     this.ionClear.emit(ev);
 
     // setTimeout() fixes https://github.com/driftyco/ionic/issues/7527
-    // way for 4 frames
+    // wait for 4 frames
     setTimeout(() => {
       let value = this._value;
       if (isPresent(value) && value !== '') {
@@ -418,7 +418,7 @@ export class Searchbar extends Ion {
     this.onTouched = fn;
   }
 
-  focus() {
-    this.getNativeElement().focus();
+  setFocus() {
+    this._renderer.invokeElementMethod(this._searchbarInput.nativeElement, 'focus');
   }
 }

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
   ]

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>

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>