Adding screenshots to e2e tests

package.json

@@ -42,6 +42,7 @@
     "karma-phantomjs-launcher": "1.0.1",
     "phantomjs-prebuilt": "2.1.11",
     "protractor": "4.0.3",
+    "protractor-jasmine2-screenshot-reporter": "^0.3.2",
     "run-sequence": "1.2.2",
     "ts-node": "1.2.2",
     "tsify": "1.0.3",

test/protractor.conf.js

@@ -1,8 +1,20 @@
+var HtmlScreenshotReporter = require('protractor-jasmine2-screenshot-reporter');
+
+var reporter = new HtmlScreenshotReporter ({
+  dest: 'coverage/screenshots',
+  pathBuilder: function(currentSpec, suites) {
+    var name = currentSpec.fullName
+    var testname = name.replace(/\s+/g, '-').toLowerCase();
+    return testname;
+  },
+  filename: 'index.html'
+});
+
 exports.config = {
     baseUrl: 'http://localhost:8100',
 
     specs: [
-        '../www/build/test/**/*.e2e.js'
+      '../www/build/test/**/*.e2e.js'
     ],
 
     exclude: [],
@@ -12,27 +24,46 @@ exports.config = {
     allScriptsTimeout: 110000,
 
     jasmineNodeOpts: {
-        showTiming: true,
-        showColors: true,
-        isVerbose: false,
-        includeStackTrace: false,
-        defaultTimeoutInterval: 400000
+      showTiming: true,
+      showColors: true,
+      isVerbose: false,
+      includeStackTrace: false,
+      defaultTimeoutInterval: 400000
     },
 
     directConnect: true,
 
     capabilities: {
-        'browserName': 'chrome'
+      'browserName': 'chrome'
+    },
+
+    beforeLaunch: function() {
+      return new Promise(function(resolve){
+        reporter.beforeLaunch(resolve);
+      });
     },
 
     onPrepare: function() {
-        var SpecReporter = require('jasmine-spec-reporter');
-        // add jasmine spec reporter
-        jasmine.getEnv().addReporter(new SpecReporter({displayStacktrace: true}));
+      jasmine.getEnv().addReporter(reporter);
+      var SpecReporter = require('jasmine-spec-reporter');
+
+      // Add jasmine spec reporter
+      jasmine.getEnv().addReporter(new SpecReporter({displayStacktrace: true}));
+
+      // Define browser size for tests/screenshots
+      var width = 360;
+      var height = 640;
+      browser.driver.manage().window().setSize(width, height);
 
-        browser.ignoreSynchronization = false;
+      browser.ignoreSynchronization = false;
     },
 
+    // Close the report after all tests finish
+    afterLaunch: function(exitCode) {
+      return new Promise(function(resolve){
+        reporter.afterLaunch(resolve.bind(this, exitCode));
+      });
+    },
 
     /**
      * Angular 2 configuration