.drone.yml

@@ -1,7 +1,8 @@
 pipeline:
   build:
-    image: tamlyn/headless-nodejs
+    image: fritteli/headless-nodejs:1.1.0
     commands:
       - npm install
       - npm run test:ci
+      - npm run e2e
       - npm run build-prod

.gitignore

@@ -35,7 +35,7 @@ testem.log
 /typings
 
 # e2e
-/e2e/*.js
+# /e2e/*.js
 /e2e/*.map
 
 # System Files

e2e/protractor.conf.js

@@ -0,0 +1,31 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+const { SpecReporter } = require('jasmine-spec-reporter');
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  specs: [
+    './src/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    'browserName': 'chrome',
+    chromeOptions: {
+      args: [ "--headless", "--disable-gpu", "--no-sandbox" ]
+    }
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:4200/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  onPrepare() {
+    require('ts-node').register({
+      project: require('path').join(__dirname, './tsconfig.e2e.json')
+    });
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+  }
+};

e2e/src/app.e2e-spec.ts

@@ -28,4 +28,14 @@ describe('convertorizr App', () => {
         expect(content).toEqual('SGVsbG8sIFdvcmxkIQ==');
       });
   });
+
+  it('should display an error message if the conversion fails', () => {
+    page.navigateTo()
+      .then(() => page.setInputFieldContent(0, 'Oh noes!'))
+      .then(() => page.selectConverterOption(0, 'Decode Base 64'))
+      .then(() => page.getErrorMessage(0))
+      .then((content: string) => {
+        expect(content).toEqual('Could not decode base64 string. Maybe corrupt input?');
+      });
+  });
 });

e2e/src/app.po.ts

@@ -41,4 +41,13 @@ export class ConvertorizrPage {
       .element(by.cssContainingText('option', optionName))
       .click();
   }
+
+  getErrorMessage(index: number): promise.Promise<string> {
+    return element
+      .all(by.css('app-root div.inputwrapper'))
+      .get(index)
+      .element(by.css('app-error-message div.errormessage'))
+      .getWebElement()
+      .getText();
+  }
 }