Use nightwatch.js for functional tests (#122)

* add tests_output to gitignore

* reverse conditional

* lowercase ID

* add full.html to keys tests

* replace deprecated <font> with <mark>

* add chromedriver dep

* add nightwatch.json

* use nightwatch in tests

* remove gulp-webdriver

* gulp test => unit

* Remove F5 “reload” shortcuts

* Test only Shift F5 PPT shortcut

* better glob

* remove `wdio.conf.js`

* fix merging issues

* add tests for N and P keys

* fix `lint:ec` task

.editorconfig

@@ -8,5 +8,5 @@ trim_trailing_whitespace = true
 insert_final_newline = true
 charset = utf-8
 
-[{package.json,.eslintrc.json,.travis.yml}]
+[*.{json,yml}]
 indent_size = 2

.gitignore

@@ -4,3 +4,4 @@
 /shower.js
 /shower.min.js
 /tests/unit/tests.js
+/tests_output

Gulpfile.js

@@ -8,7 +8,6 @@ const lintspaces = require('gulp-lintspaces');
 const mocha = require('gulp-mocha-phantomjs');
 const rename = require('gulp-rename');
 const uglify = require('gulp-uglify');
-const webdriver = require('gulp-webdriver');
 
 const pkg = require('./package.json');
 const now = new Date().getFullYear();
@@ -24,10 +23,9 @@ gulp.task('lint:ec', () => {
     const sources = [
         '.editorconfig',
         '.gitignore',
-        '*.{json,yml,md}',
+        '{.,}*.{json,yml,md}',
         'lib/**',
         'tests/**',
-        'wdio.conf.js',
     ];
 
     const options = {
@@ -38,7 +36,7 @@ gulp.task('lint:ec', () => {
         ],
     };
 
-    return gulp.src(sources, { dot: true })
+    return gulp.src(sources)
         .pipe(lintspaces(options))
         .pipe(lintspaces.reporter());
 });
@@ -81,11 +79,6 @@ gulp.task('minify', [ 'concat:lib' ], () => {
         .pipe(gulp.dest('.'));
 });
 
-gulp.task('webdriver', () => {
-    return gulp.src('wdio.conf.js')
-        .pipe(webdriver());
-});
-
 gulp.task('mocha', () => {
     return gulp.src('tests/unit/index.html')
         .pipe(mocha());
@@ -107,17 +100,8 @@ gulp.task('build', [
     'minify',
 ]);
 
-gulp.task('test', [
+gulp.task('unit', [
     'lint',
-    'test:unit',
-    'test:func',
-]);
-
-gulp.task('test:func', [
-    'webdriver',
-]);
-
-gulp.task('test:unit', [
     'concat:test',
     'mocha',
 ]);

lib/shower/shower.Container.js

@@ -201,11 +201,13 @@ shower.modules.define('shower.Container', [
                 return;
             }
 
+            var slideNumber;
+
             switch (e.which) {
                 case 13: // Enter
                     e.preventDefault();
                     if (!this.isSlideMode() && e.metaKey) {
-                        var slideNumber = e.shiftKey ? 0 : this._shower.player.getCurrentSlideIndex();
+                        slideNumber = e.shiftKey ? 0 : this._shower.player.getCurrentSlideIndex();
                         this._shower.player.go(slideNumber);
                         this.enterSlideMode();
                     } else {
@@ -225,7 +227,7 @@ shower.modules.define('shower.Container', [
                 case 116: // F5 Shift
                     if (!this.isSlideMode() && e.shiftKey) {
                         e.preventDefault();
-                        var slideNumber = this._shower.player.getCurrentSlideIndex();
+                        slideNumber = this._shower.player.getCurrentSlideIndex();
                         this._shower.player.go(slideNumber);
                         this.enterSlideMode();
                     }
@@ -242,4 +244,4 @@ shower.modules.define('shower.Container', [
     });
 
     provide(Container);
-});
+});

nightwatch.json

@@ -0,0 +1,23 @@
+{
+  "src_folders" : ["tests/functional"],
+  "globals_path": "tests/chromedriver.js",
+  "selenium": {
+    "start_process": false
+  },
+
+  "test_settings": {
+    "default": {
+      "selenium_port": 9515,
+      "selenium_host": "localhost",
+      "default_path_prefix": "",
+
+      "desiredCapabilities": {
+        "browserName": "chrome",
+        "chromeOptions": {
+          "args": ["--no-sandbox"]
+        },
+        "acceptSslCerts": true
+      }
+    }
+  }
+}

package.json

@@ -43,6 +43,7 @@
   "devDependencies": {
     "chai": "^3.5.0",
     "chai-dom": "^1.4.3",
+    "chromedriver": "^2.27.2",
     "eslint-config-standard": "^6.2.1",
     "eslint-plugin-promise": "^3.4.0",
     "eslint-plugin-standard": "^2.0.1",
@@ -57,6 +58,7 @@
     "gulp-uglify": "^2.0.0",
     "gulp-webdriver": "^2.0.3",
     "mocha": "^3.0.2",
+    "nightwatch": "^0.9.12",
     "selenium-standalone": "^5.6.3",
     "shower-next": "0.0.6",
     "shower-progress": "0.0.9",
@@ -73,7 +75,7 @@
     "prepublish": "gulp build",
     "build": "gulp build",
     "lint": "gulp lint",
-    "test": "gulp test",
+    "test": "gulp unit && nightwatch",
     "report": "allure report generate -o allure-report allure-results && allure report open -o allure-report"
   }
 }

tests/chromedriver.js

@@ -0,0 +1,12 @@
+'use strict';
+const chromedriver = require('chromedriver');
+
+module.exports = {
+    before: done => {
+        chromedriver.start();
+        done();
+    },
+    after: () => {
+        chromedriver.stop();
+    },
+};

tests/functional/a11y/test.js

@@ -1,21 +1,16 @@
-describe('a11y', () => {
+'use strict';
+module.exports = {
+    '@tags': ['a11y'],
 
-    beforeEach(() => {
-        browser.url('about:blank');
-    });
+    'doesn’t add `application` role in list mode': browser => {
+        browser.url(`file:///${__dirname}/list.html`);
+        browser.assert.elementNotPresent('.shower[role=application]');
+        browser.end();
+    },
 
-    afterEach(() => {
-        browser.sessionStorage('DELETE');
-    });
-
-    it('doesn’t add `application` role in list mode', () => {
-        browser.url('/a11y/list.html');
-        browser.isExisting('.shower[role=application]').should.equal(false);
-    });
-
-    it('adds `application` role in full mode', () => {
-        browser.url('/a11y/full.html');
-        browser.isExisting('.shower[role=application]').should.equal(true);
-    });
-
-});
+    'adds `application` role in full screen mode': browser => {
+        browser.url(`file:///${__dirname}/full.html`);
+        browser.assert.elementPresent('.shower[role=application]');
+        browser.end();
+    },
+};

tests/functional/core/full.html

@@ -5,7 +5,7 @@
     <section class="slide">
         <h2>1</h2>
     </section>
-    <section class="slide" id="ID">
+    <section class="slide" id="id">
         <h2>2</h2>
     </section>
     <section class="slide">

tests/functional/core/list.html

@@ -5,7 +5,7 @@
     <section class="slide">
         <h2>1</h2>
     </section>
-    <section class="slide" id="ID">
+    <section class="slide" id="id">
         <h2>2</h2>
     </section>
     <section class="slide">

tests/functional/core/none.html

@@ -5,7 +5,7 @@
     <section class="slide">
         <h2>1</h2>
     </section>
-    <section class="slide" id="ID">
+    <section class="slide" id="id">
         <h2>2</h2>
     </section>
     <section class="slide">