Merge branch 'master' into single-run

Author: leifwells

README.md

@@ -5,6 +5,18 @@ Based on the awesome [unit testing example](https://github.com/roblouie/unit-tes
 
 Clone repo, run `npm install`.
 
+Unit Tests
+----------
+
 To run the tests, run `npm test`.
 
 See the example test in `src/app/app.component.spec.ts` for an example of a component test.
+
+End-To-End Tests (Browser-Only)
+-------------------------------
+
+To serve the app, run `ionic serve`.
+
+To run the end-to-end tests, run (while the app is being served) `npm run e2e`.
+
+See the example end-to-end test in `e2e/app.e2e-spec.ts`.

e2e/app.e2e-spec.ts

@@ -0,0 +1,21 @@
+import { Page } from './app.po';
+
+describe('App', function() {
+  let page: Page;
+
+  beforeEach(() => {
+    page = new Page();
+  });
+
+  describe('default screen', () => {
+    beforeEach(() => {
+      page.navigateTo('/');
+    });
+
+    it('should have a title saying Page One', () => {
+      page.getTitle().then(title => {
+        expect(title).toEqual('Page One');
+      });
+    });
+  })
+});

e2e/app.po.ts

@@ -0,0 +1,13 @@
+import { browser } from 'protractor';
+
+export class Page {
+
+  navigateTo(destination) {
+    return browser.get(destination);
+  }
+
+  getTitle() {
+    return browser.getTitle();
+  }
+  
+}

e2e/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "declaration": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "outDir": "../dist/out-tsc-e2e",
+    "sourceMap": true,
+    "target": "es5",
+    "typeRoots": [
+      "../node_modules/@types"
+    ]
+  }
+}

ionic.config.json

@@ -1,5 +1,7 @@
 {
-  "name": "test-test",
+  "name": "ionic-unit-testing-example",
   "app_id": "",
-  "projectTypeId": "ionic-angular"
-}
+  "projectTypeId": "ionic-angular",
+  "v2": true,
+  "typescript": true
+}

package.json

@@ -10,6 +10,7 @@
     "ionic:serve": "ionic-app-scripts serve",
     "test": "karma start ./test-config/karma.conf.js",
     "test-ci": "karma start ./test-config/karma.conf.js --single-run"
+    "e2e": "webdriver-manager update --standalone false --gecko false; protractor ./test-config/protractor.conf.js"
   },
   "dependencies": {
     "@angular/common": "2.4.8",
@@ -40,15 +41,18 @@
     "angular2-template-loader": "^0.6.2",
     "html-loader": "^0.4.5",
     "jasmine": "^2.5.3",
+    "jasmine-spec-reporter": "^3.2.0",
     "karma": "^1.5.0",
     "karma-chrome-launcher": "^2.0.0",
     "karma-jasmine": "^1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^2.0.3",
     "null-loader": "^0.1.1",
+    "protractor": "^5.1.1",
     "ts-loader": "^2.0.3",
-    "typescript": "2.0.9"
+    "ts-node": "^3.0.2",
+    "typescript": "2.1.6"
   },
   "version": "0.0.1",
   "description": "An Ionic project"

src/app/app.html

@@ -1 +1,18 @@
-<ion-nav [root]="rootPage"></ion-nav>
+<ion-menu [content]="content">
+  <ion-header>
+    <ion-toolbar>
+      <ion-title>Menu</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
+        {{p.title}}
+      </button>
+    </ion-list>
+  </ion-content>
+
+</ion-menu>
+
+<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

test-config/protractor.conf.js

@@ -0,0 +1,32 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+/*global jasmine */
+var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  specs: [
+    '../e2e/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    'browserName': 'chrome'
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:8100/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  useAllAngular2AppRoots: true,
+  beforeLaunch: function() {
+    require('ts-node').register({
+      project: 'e2e'
+    });
+  },
+  onPrepare: function() {
+    jasmine.getEnv().addReporter(new SpecReporter());
+  }
+};

test-config/webpack.test.js

@@ -20,7 +20,7 @@ module.exports = {
       },
       {
         test: /\.html$/,
-        loader: 'html-loader'
+        loader: 'html-loader?attrs=false'
       },
       {
         test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,