Merge pull request #252 from hfwittmann/master

alert controller

e2e/page2.e2e-spec.ts

@@ -14,7 +14,7 @@ describe('Page2', () => {
       element.all(by.className('input-wrapper')).then((items) => {
         items[1].click();
         browser.driver.sleep(2000); // wait for the animation
-        expect(message.getText()).toEqual('Bye!');
+        expect(message.getText()).toEqual('SHOW SIMPLE ALERT\nSHOW MORE ADVANCED ALERT');
         return items[1];
       });
     });

src/mocks.ts

@@ -3,20 +3,28 @@
 import { EventEmitter}      from '@angular/core';
 import { FormBuilder }      from '@angular/forms';
 
+// from
+// https://github.com/stonelasley/ionic-mocks/
+// should the package be incorporated?
+
 export class AlertMock {
+	public static instance(): any {
+		let instance = jasmine.createSpyObj('Alert', ['present', 'dismiss']);
+		instance.present.and.returnValue(Promise.resolve());
+		instance.dismiss.and.returnValue(Promise.resolve());
 
-  public create(): any {
-    let rtn: Object = {};
-    rtn['present'] = (() => true);
-    return rtn;
-  }
+		return instance;
+	}
+}
 
-  // function actually on the AlertClass (not AlertController), but using these interchangably for now
-  public dismiss(): Promise<{}> {
-    return new Promise(function(resolve: Function): void {
-      resolve();
-    });
-  }
+export class AlertControllerMock {
+	public static instance(alertMock?: AlertMock): any {
+
+		let instance = jasmine.createSpyObj('AlertController', ['create']);
+		instance.create.and.returnValue(alertMock || AlertMock.instance());
+
+		return instance;
+	}
 }
 
 export class ToastMock {

src/pages/page2/page2.html

@@ -8,5 +8,6 @@
 </ion-header>
 
 <ion-content padding class="message bye-ionic">
-  <h2>Bye!</h2>
+  <button ion-button (click)="showSimpleAlert()">Show Simple Alert</button>
+  <button ion-button (click)="showMoreAdvancedAlert()">Show More Advanced Alert</button>
 </ion-content>

src/pages/page2/page2.spec.ts

@@ -1,12 +1,17 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { App, Config, Form, IonicModule, Keyboard, DomController, MenuController, NavController, Platform } from 'ionic-angular';
-import { ConfigMock, PlatformMock } from '../../mocks';
+import { App, Config, Form, IonicModule, Keyboard, DomController, MenuController, NavController, Platform, AlertController } from 'ionic-angular';
+import { ConfigMock, PlatformMock, AlertControllerMock } from '../../mocks';
 import { Page2 }      from './page2';
 
+const alertControllerMock: AlertController = AlertControllerMock.instance();
+
 let fixture: ComponentFixture<Page2> = null;
 let instance: any = null;
 
+let alertSpy: any;
+let alertControllerSpy: any;
+
 describe('Pages: Page2', () => {
 
   // demonstration on how to manually compile the test bed (as opposed to calling TestUtils)
@@ -18,6 +23,7 @@ describe('Pages: Page2', () => {
         App, DomController, Form, Keyboard, MenuController, NavController,
         {provide: Config, useClass: ConfigMock},
         {provide: Platform, useClass: PlatformMock},
+        {provide: AlertController, useValue: alertControllerMock},
       ],
       imports: [
         FormsModule,
@@ -30,6 +36,10 @@ describe('Pages: Page2', () => {
       instance = fixture;
       fixture.detectChanges();
       fixture.componentInstance.onGainChange();
+
+      alertSpy = fixture.componentInstance.alertController;
+      alertControllerSpy = fixture.componentInstance.alertController.create();
+
     });
   }));
 
@@ -41,4 +51,45 @@ describe('Pages: Page2', () => {
     expect(fixture).toBeTruthy();
     expect(instance).toBeTruthy();
   });
+
+  it('should fire the simple alert', fakeAsync(() => {
+
+    alertSpy.create.calls.reset();
+    alertControllerSpy.present.calls.reset();
+
+    expect(alertSpy.create).not.toHaveBeenCalledTimes(1);
+    expect(alertControllerSpy.present).not.toHaveBeenCalledTimes(1);
+
+    expect(alertSpy.create).not.toHaveBeenCalled();
+    expect(alertControllerSpy.present).not.toHaveBeenCalled();
+
+    fixture.componentInstance.showSimpleAlert();
+    tick();
+
+    expect(alertSpy.create).toHaveBeenCalledTimes(1);
+    expect(alertControllerSpy.present).toHaveBeenCalledTimes(1);
+
+    expect(alertSpy.create).toHaveBeenCalled();
+    expect(alertControllerSpy.present).toHaveBeenCalled();
+
+  }));
+
+  it('should fire the more advanced alert', fakeAsync(() => {
+
+    alertSpy.create.calls.reset();
+    alertControllerSpy.present.calls.reset();
+
+    fixture.componentInstance.okEd = false;
+
+    expect(fixture.componentInstance.okEd).toBeFalsy();
+
+    fixture.componentInstance.showMoreAdvancedAlert();
+    tick();
+
+    fixture.componentInstance.OK();
+
+    expect(fixture.componentInstance.okEd).toBeTruthy();
+
+  }));
+
 });

src/pages/page2/page2.ts

@@ -1,16 +1,55 @@
 'use strict';
 
-import { Component }        from '@angular/core';
+import { Component } from '@angular/core';
+import { Alert, AlertController } from 'ionic-angular';
 
 @Component({
   templateUrl: './page2.html',
 })
 
 export class Page2 {
 
+  public okEd: boolean;
+  public alert1: Alert;
+  public alertController: AlertController;
+
+  constructor(alertController: AlertController) {
+    this.alertController = alertController;
+
+  };
+
   public title: string = 'Page 2';
 
   public onGainChange(): void {
     return;
   }
+
+  public showSimpleAlert(): any {
+
+    this.alert1 = this.alertController.create({
+      title: 'This is an example for an alert',
+      buttons: ['Ok', 'Dismiss'],
+    });
+
+    this.alert1.present();
+  }
+
+  public showMoreAdvancedAlert(): any {
+
+    this.alert1 = this.alertController.create({
+      title: 'This is an example for an alert',
+      buttons: [{
+        text: 'More Advanced Ok',
+        handler: this.OK,
+      }
+        , 'Dismiss'],
+    });
+
+    this.alert1.present();
+  }
+
+  public OK = () => {
+
+    this.okEd = true;
+  }
 }