test(item): improves inputs e2e test

ionic-team · Nov 26, 2016 · 7018bfe · 7018bfe
1 parent d7e1396
commit 7018bfe
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 10 deletions.
diff --git a/src/components/item/test/inputs/app-module.ts b/src/components/item/test/inputs/app-module.ts
@@ -6,6 +6,7 @@ import { IonicApp, IonicModule } from '../../../..';
   templateUrl: 'main.html'
 })
 export class E2EPage {
+  disabled = false;
   datetime = '2016-12-09';
   toggle = true;
   select = 'n64';

diff --git a/src/components/item/test/inputs/e2e.ts b/src/components/item/test/inputs/e2e.ts
@@ -1 +1,4 @@
 
+it('should disable all inputs', function() {
+  element(by.css('.e2eDisableButton')).click();
+});
diff --git a/src/components/item/test/inputs/main.html b/src/components/item/test/inputs/main.html
@@ -2,29 +2,31 @@
 
   <ion-toolbar>
     <ion-title>Item inputs</ion-title>
+    <ion-buttons end>
+      <button ion-button class="e2eDisableButton" (click)="disabled = !disabled">{{disabled ? 'Enable' : 'Disable' }}</button>
+    </ion-buttons>
   </ion-toolbar>
 
 </ion-header>
 
-
 <ion-content>
   <ion-list>
     <ion-item>
       Simple item
     </ion-item>
 
-    <button ion-item>
+    <button ion-item [disabled]='disabled'>
       Item Button
     </button>
 
     <ion-item>
       <ion-label>DateTime</ion-label>
-      <ion-datetime [(ngModel)]="datetime" min="1994-03-14" max="2017-12-09" displayFormat="MM/DD/YYYY" required></ion-datetime>
+      <ion-datetime [(ngModel)]="datetime" min="1994-03-14" max="2017-12-09" displayFormat="MM/DD/YYYY" required [disabled]='disabled'></ion-datetime>
     </ion-item>
 
     <ion-item>
       <ion-label>Select</ion-label>
-      <ion-select [(ngModel)]="select">
+      <ion-select [(ngModel)]="select" [disabled]='disabled'>
         <ion-option value="nes">NES</ion-option>
         <ion-option value="n64">Nintendo64</ion-option>
         <ion-option value="ps">PlayStation</ion-option>
@@ -36,32 +38,32 @@
 
     <ion-item>
       <ion-label>Toggle</ion-label>
-      <ion-toggle name="Actually" [(ngModel)]="toggle"></ion-toggle>
+      <ion-toggle name="Actually" [(ngModel)]="toggle" [disabled]='disabled'></ion-toggle>
     </ion-item>
 
     <ion-item>
       <ion-label>Input (text)</ion-label>
-      <ion-input [(ngModel)]="text"></ion-input>
+      <ion-input [(ngModel)]="text" [disabled]='disabled'></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label>Input (placeholder)</ion-label>
-      <ion-input placeholder="Placeholder"></ion-input>
+      <ion-input placeholder="Placeholder" [disabled]='disabled'></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label>Checkbox</ion-label>
-      <ion-checkbox [(ngModel)]="checkbox"></ion-checkbox>
+      <ion-checkbox [(ngModel)]="checkbox" [disabled]='disabled'></ion-checkbox>
     </ion-item>
 
     <ion-item>
       <ion-label>Toggle (left)</ion-label>
-      <ion-toggle [(ngModel)]="toggle" item-left></ion-toggle>
+      <ion-toggle [(ngModel)]="toggle" item-left [disabled]='disabled'></ion-toggle>
     </ion-item>
 
     <ion-item>
       <ion-label>Range</ion-label>
-      <ion-range [(ngModel)]="range"></ion-range>
+      <ion-range [(ngModel)]="range" [disabled]='disabled'></ion-range>
     </ion-item>
   </ion-list>