ionic-framework/e2e/searchbar/floating/main.html

<ion-content>
  <h5 padding-left padding-top> Search - Default </h5>
  <ion-searchbar [(ng-model)]="defaultSearch" (input)="triggerInput()" class="e2eDefaultFloatingSearchbar"></ion-searchbar>

  <h5 padding-left> Search - Custom Placeholder </h5>
  <ion-searchbar [(ng-model)]="customPlaceholder" placeholder="Filter Schedules" class="e2eCustomPlaceholderFloatingSearchbar"></ion-searchbar>

  <h5 padding-left> Search - Default Cancel Button </h5>
  <ion-searchbar [(ng-model)]="defaultCancel" show-cancel="true" class="e2eDefaultCancelButtonFloatingSearchbar"></ion-searchbar>

  <h5 padding-left> Search - Custom Cancel Button Danger </h5>
  <ion-searchbar [(ng-model)]="customCancel" show-cancel="true" cancel-text="Really Long Cancel" class="e2eCustomCancelButtonFloatingSearchbar" danger></ion-searchbar>

  <h5 padding-left> Search - Custom Cancel Action</h5>
  <ion-searchbar [(ng-model)]="customCancelAction" show-cancel="true" cancel-text="Done" [cancel-action]="myCancelAction" class="e2eCustomCancelActionFloatingSearchbar"></ion-searchbar>

  <div *ng-if="clickedCustomAction">
    Clicked custom action with input = {{customCancelAction}}
  </div>
</ion-content>