End-to-end test infrastructure re-factored

README.md

@@ -9,10 +9,9 @@ No dependencies. Suitable for IoT devices because of minimum code base.
 
 ## Install
 
-Make it simple using npm or bower:
+Make it simple using npm:
 
     $ npm install canv-gauge
-    $ bower install canv-gauge
 
 ## Documentation
 

gulpfile.js

@@ -23,6 +23,9 @@ const gutil = require('gulp-util');
 const chalk = require('chalk');
 const http = require('https');
 const fs = require('fs');
+const selenium = require('selenium-standalone');
+const mocha = require('gulp-mocha');
+const cp = require('child_process');
 
 /**
  * Displays this usage information.
@@ -123,7 +126,7 @@ gulp.task('gzip', ['build'], () => {
 });
 
 /**
- * Performs JavaScript syntax linting checks.
+ * Performs JavaScript syntax check.
  *
  * @task {lint}
  */
@@ -147,7 +150,7 @@ gulp.task('lint', () => {
  *
  * @task {test:spec}
  */
-gulp.task('test:spec', ['lint'], done => {
+gulp.task('test:spec', done => {
     console.log(chalk.bold.green('Starting unit tests...'));
 
     let server = new KarmaServer({
@@ -167,9 +170,9 @@ gulp.task('test:spec', ['lint'], done => {
                 '(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?' +
                 '[0-9A-ORZcf-nqry=><]', 'g');
             let coverage = fs.readFileSync(
-                './coverage/report/coverage.txt',
-                { encoding: 'utf8' }
-            )
+                    './coverage/report/coverage.txt',
+                    { encoding: 'utf8' }
+                )
                 .replace(rx, '')
                 .split(/\r?\n/)[2]
                 .split(':')[1]
@@ -203,6 +206,27 @@ gulp.task('test:spec', ['lint'], done => {
     }).start();
 });
 
+/**
+ * Installs and starts selenium server
+ *
+ * @task {selenium}
+ */
+gulp.task('selenium', done => {
+    cp.execSync('pkill -f selenium-standalone');
+
+    selenium.install({ logger: gutil.log }, err => {
+        if (err) return done(err);
+
+        selenium.start((err, child) => {
+            if (err) return done(err);
+
+            selenium.child = child;
+
+            done();
+        });
+    });
+});
+
 /**
  * Runs end-to-end tests.
  *
@@ -219,16 +243,24 @@ gulp.task('test:spec', ['lint'], done => {
  *     drawing, most probably expected pixels won't match the expected specs,
  *     so we can automatically figure something is broken.
  */
-gulp.task('test:e2e', () => {
+gulp.task('test:e2e', ['selenium'], done => {
     console.log(chalk.bold.green('\nStarting end-to-end tests...\n'));
 
-    return gulp.src('wdio.conf.js')
-        .pipe(wdio({ type: 'selenium' }))
-        .once('error', () => process.exit(1));
+    gulp.src(['test/e2e/**/*.e2e.js'])
+        .pipe(mocha({ reporter: 'spec' }))
+        .once('error', err => {
+            console.error(err);
+            cp.execSync('pkill -f selenium-standalone');
+            process.exit(1);
+        })
+        .once('end', () => {
+            cp.execSync('pkill -f selenium-standalone');
+            done();
+        });
 });
 
 /**
- * Runs all tests including end-to-end tests as well.
+ * Runs all tests and checks.
  *
  * @task {test}
  */

lib/Gauge.js

@@ -52,7 +52,7 @@ const SharedOptions = require('./SharedOptions');
 // todo: online configurator
 // todo: online packager
 // todo: e2e tests
-// todo: optimize build process (glueand minify without babel and browserify)
+// todo: optimize build process (glue and minify without babel and browserify)
 // todo: angular 2 integration
 // todo: react integrations
 // todo: typescript definitions

package.json

@@ -75,7 +75,6 @@
     "babel-cli": "^6.11.4",
     "babel-plugin-external-helpers-2": "^6.3.13",
     "babel-plugin-transform-object-assign": "^6.8.0",
-    "babel-plugin-transform-runtime": "^6.12.0",
     "babel-preset-es2015": "^6.13.2",
     "babelify": "^7.3.0",
     "brfs": "^1.4.3",
@@ -89,6 +88,7 @@
     "gulp-eslint": "^3.0.1",
     "gulp-gzip": "^1.4.0",
     "gulp-help-doc": "^1.0.4",
+    "gulp-mocha": "^3.0.1",
     "gulp-rename": "^1.2.2",
     "gulp-sourcemaps": "^1.6.0",
     "gulp-uglify": "^2.0.0",
@@ -107,12 +107,12 @@
     "karma-threshold-reporter": "^0.1.15",
     "mocha": "^3.0.2",
     "rimraf": "^2.5.4",
+    "selenium-standalone": "^5.5.0",
     "sinon": "^1.17.5",
     "utils-merge": "^1.0.0",
     "vinyl-buffer": "^1.0.0",
     "vinyl-source-stream": "^1.1.0",
     "watchify": "^3.7.0",
-    "wdio-mocha-framework": "^0.4.0",
-    "wdio-spec-reporter": "0.0.3"
+    "webdriverio": "^4.2.7"
   }
 }

test/e2e/gauges.e2e.js

@@ -0,0 +1,38 @@
+const expect = require('chai').expect;
+const webdriver = require('webdriverio');
+const fs = require('fs');
+const chalk = require('chalk');
+const TIMEOUT = 90000;
+
+describe('Gauges UI', function() {
+    this.timeout(TIMEOUT);
+
+    let client;
+    let url = 'file://' + fs.realpathSync('.') + '/test/gauges.html';
+
+    console.log(chalk.cyan('  Loading UI from "' + url + '"'));
+
+    before(() => {
+        client = webdriver.remote({
+            desiredCapabilities: { browserName: 'chrome' }});
+
+        return client.init();
+    });
+
+    it('checking gauges ui', done => {
+        client
+            .url(url)
+            .execute(function () {
+                return document.title;
+            })
+            .then(result => {
+                // console.log(result.value);
+                expect(result.value).to.be.a('string');
+                done();
+            });
+    });
+
+    after(() => {
+        return client.end();
+    });
+});