e2e

.gitignore

@@ -29,6 +29,10 @@ plugins/ios.json
 www/
 $RECYCLE.BIN/
 
+# e2e
+/e2e/*.js
+/e2e/*.map
+
 .DS_Store
 Thumbs.db
 UserInterfaceState.xcuserstate

src/app/app.e2e.ts → e2e/app.e2e-spec.ts

@@ -1,3 +1,5 @@
+import { browser, element, by } from 'protractor';
+
 describe('ClickerApp', () => {
 
   beforeEach(() => {
@@ -20,7 +22,7 @@ describe('ClickerApp', () => {
     element(by.css('.bar-button-menutoggle')).click()
       .then(() => {
         browser.driver.sleep(2000); // wait for the animation
-        expect(element.all(by.css('.toolbar-title')).first().getText()).toEqual('Menu');
+        expect(element.all(by.css('.toolbar-title')).first().getText()).toEqual('Pages');
       });
   });
 

src/pages/clickerList/clickerList.e2e.ts → e2e/clickerList.e2e-spec.ts

@@ -1,8 +1,8 @@
-import { ElementFinder } from 'protractor';
+import { browser, element, by, ElementFinder } from 'protractor';
 
 let clickerField: ElementFinder = element(by.css('.text-input'));
 let clickerButton: ElementFinder = element.all(by.className('button-outline')).first();
-let removeButton: ElementFinder = element.all(by.css('.button-outline-danger')).first();
+let removeButton: ElementFinder = element.all(by.css('.button-outline-md-danger')).first();
 let firstClicker: ElementFinder = element.all(by.className('clickerList')).first();
 
 describe('ClickerList', () => {

src/pages/page2/page2.e2e.ts → e2e/page2.e2e-spec.ts

@@ -1,4 +1,4 @@
-import { ElementFinder } from 'protractor';
+import { browser, element, by, ElementFinder } from 'protractor';
 
 let message: ElementFinder = element(by.className('message'));
 
@@ -15,6 +15,7 @@ describe('Page2', () => {
         items[1].click();
         browser.driver.sleep(2000); // wait for the animation
         expect(message.getText()).toEqual('Bye!');
+        return items[1];
       });
     });
   });

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"
+    ]
+  }
+}

package.json

@@ -11,7 +11,7 @@
     "deploy:before": "build",
     "build:before": "build",
     "run:before": "build",
-    "e2e": "gulp --gulpfile test/gulpfile.ts --cwd ./ build-e2e && protractor test/protractor.conf.js",
+    "e2e": "protractor",
     "postinstall": "ionic state restore && webdriver-manager update",
     "start": "ionic serve",
     "test": "ng test"
@@ -49,6 +49,7 @@
     "karma-remap-istanbul": "0.2.1",
     "protractor": "4.0.10",
     "protractor-jasmine2-screenshot-reporter": "0.3.2",
+    "ts-node": "1.6.1",
     "tslint": "3.15.1",
     "tslint-eslint-rules": "2.1.0",
     "typescript": "2.0.6"

protractor.conf.js

@@ -0,0 +1,32 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/docs/referenceConf.js
+
+/*global jasmine */
+var SpecReporter = require('jasmine-spec-reporter');
+
+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());
+  }
+};

tsconfig.json

@@ -13,8 +13,7 @@
     "target": "es5"
   },
   "exclude": [
-    "node_modules",
-    "**/*.e2e.ts"
+    "node_modules"
   ],
   "compileOnSave": false,
   "atom": {