From 957bd358dea33503d5ddffaf6cd4a9f6beaa74a8 Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Sat, 25 Nov 2017 16:47:36 +0100
Subject: [PATCH 01/10] [WIP] Run QUnit tests in Puppeteer instead of PhantomJS

---
 gulp/js/default.js                            |  23 +++-
 gulp/js/qunit2.js                             | 104 ++++++++++++++++++
 package.json                                  |   1 +
 .../demo/modules/slideshow/slideshow.data.js  |   2 +-
 source/preview/partials/qunit.hbs             |   2 +-
 5 files changed, 129 insertions(+), 3 deletions(-)
 create mode 100644 gulp/js/qunit2.js

diff --git a/gulp/js/default.js b/gulp/js/default.js
index fda2159b..dfd474b6 100644
--- a/gulp/js/default.js
+++ b/gulp/js/default.js
@@ -12,7 +12,9 @@ var taskName = 'js',
 	taskConfig = {
 		src: [
 			'./source/assets/js/main.js',
-			'./source/assets/js/head.js'
+			'./source/assets/js/head.js',
+			'./source/preview/assets/js/test.js',
+			'./source/demo/modules/slideshow/slideshow.test.js'
 		],
 		devSrc: [
 			'./source/assets/js/dev.js'
@@ -85,9 +87,28 @@ var taskName = 'js',
 								}]
 							]
 						}
+					},
+					{
+						test: /qunit\.js$/,
+						loader: 'expose?QUnit'
+					},
+					{
+						test: /\.css$/,
+						loader: 'style-loader!css-loader'
 					}
 				]
 			},
+			externals: function(context, request, callback) {
+				// Do not include jQuery in test-related files
+				if (request === 'jquery' && /(\/preview\/assets\/js\/|\/modules\/)/.test(context)) {
+					return callback(null, 'jQuery');
+				// Do not include QUnit in every single test file
+				} else if (request === 'qunitjs' && /\/modules\//.test(context)) {
+					return callback(null, 'QUnit');
+				}
+
+				callback();
+			},
 
 			// Minifiy in prod mode
 			plugins: [
diff --git a/gulp/js/qunit2.js b/gulp/js/qunit2.js
new file mode 100644
index 00000000..dd4d318d
--- /dev/null
+++ b/gulp/js/qunit2.js
@@ -0,0 +1,104 @@
+'use strict';
+
+/**
+ * @function `gulp html:test`
+ * @desc Open built HTML files in headless Chrome and report errors.
+ */
+
+var gulp = require('gulp');
+
+var taskName = 'js:qunit2',
+	taskConfig = {
+		src: './build/demo/modules/slideshow/*.html'
+	};
+
+gulp.task(taskName, function() {
+	var helpers = require('require-dir')('../../helpers'),
+		puppeteer = require('puppeteer'),
+		util = require('gulp-util'),
+		glob = require('glob'),
+		path = require('path');
+
+	var files = glob.sync(taskConfig.src).map(function(file) {
+			return path.resolve(file);
+		});
+
+	return puppeteer.launch({
+		// headless: false
+	}).then(function(browser) {
+		return browser.newPage().then(function(page) {
+			var pages = Promise.resolve();
+
+			page.on('pageerror', function(err) {
+				var error = {
+						task: taskName,
+						message: err.message
+					};
+
+				if (!util.env.dev) {
+					return browser.close().then(function() {
+						helpers.errors(error);
+					});
+				}
+
+				helpers.errors(error);
+			});
+
+			page.on('error', console.log);
+
+			// page.on('console', function(msg) {
+			// 	console.log(msg.text);
+			// });
+
+			// page.on('request', function(req) {
+			// 	if (!req.url.match(/data\:/)) {
+			// 		console.log(req.url);
+			// 	}
+			// });
+
+			files.forEach(function(file) {
+				pages = pages.then(function() {
+					util.log(util.colors.cyan('Testing'), file);
+
+					return page.goto('file://' + file, {
+						// waitUntil: 'domcontentloaded'
+					}).then(function() {
+						return page.evaluate(function() {
+							return new Promise(function (resolve, reject) {
+								var details = [];
+
+								QUnit.start();
+
+								QUnit.testDone(function(results) {
+									details.push(results);
+								});
+
+								QUnit.done(function(summary) {
+									resolve({
+										details: details,
+										summary: summary
+									});
+								});
+							});
+						}).then(function(results) {
+							console.log(results.summary);
+						});
+					});
+				});
+			});
+
+			return pages;
+		}).then(function() {
+			return browser.close();
+		}).catch(function(err) {
+			console.log(err);
+
+			return browser.close();
+		});
+	});
+});
+
+module.exports = {
+	taskName: taskName,
+	taskConfig: taskConfig
+};
diff --git a/package.json b/package.json
index 5042bae9..4ce1b77e 100644
--- a/package.json
+++ b/package.json
@@ -92,6 +92,7 @@
     "postcss-url": "5.1.2",
     "pretty-hrtime": "1.0.2",
     "promise": "7.1.1",
+    "puppeteer": "0.13.0",
     "qunitjs": "2.0.1",
     "require-dir": "0.3.1",
     "require-new": "1.1.0",
diff --git a/source/demo/modules/slideshow/slideshow.data.js b/source/demo/modules/slideshow/slideshow.data.js
index 76e88378..3f96cf51 100644
--- a/source/demo/modules/slideshow/slideshow.data.js
+++ b/source/demo/modules/slideshow/slideshow.data.js
@@ -14,7 +14,7 @@ var _ = require('lodash'),
 			jira: 'JIRA-4',
 			documentation: dataHelper.getDocumentation('slideshow.md'),
 			testScripts: [
-				dataHelper.getTestScriptPath('slideshow.test.js')
+				'slideshow.test.js'
 			],
 			mocks: [
 				{
diff --git a/source/preview/partials/qunit.hbs b/source/preview/partials/qunit.hbs
index a715e194..adb19d84 100644
--- a/source/preview/partials/qunit.hbs
+++ b/source/preview/partials/qunit.hbs
@@ -3,7 +3,7 @@
 		<div id="qunit"></div>
 		<div id="qunit-fixture"></div>
 
-		<script src="/test/source/preview/assets/js/test.js"></script>
+		<script src="/preview/assets/js/test.js"></script>
 
 		{{#each meta.testScripts}}
 			<script src="{{this}}"></script>

From a394419d8777f77a273a577978a4f4f42320393c Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Sat, 25 Nov 2017 22:58:03 +0100
Subject: [PATCH 02/10] [Fix] Gulp: Fixed webpack config for QUnit

---
 gulp/js/default.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/gulp/js/default.js b/gulp/js/default.js
index dfd474b6..40c1f662 100644
--- a/gulp/js/default.js
+++ b/gulp/js/default.js
@@ -100,7 +100,7 @@ var taskName = 'js',
 			},
 			externals: function(context, request, callback) {
 				// Do not include jQuery in test-related files
-				if (request === 'jquery' && /(\/preview\/assets\/js\/|\/modules\/)/.test(context)) {
+				if (request === 'jquery' && /(\/preview\/assets\/js|\/modules\/)/.test(context)) {
 					return callback(null, 'jQuery');
 				// Do not include QUnit in every single test file
 				} else if (request === 'qunitjs' && /\/modules\//.test(context)) {

From 11592260a59c3156e546bf2c47898356027732cb Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Sat, 25 Nov 2017 23:13:22 +0100
Subject: [PATCH 03/10] [Update] Gulp: Added basic reporter to QUnit tests

---
 gulp/js/qunit2.js | 31 ++++++++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/gulp/js/qunit2.js b/gulp/js/qunit2.js
index dd4d318d..77bd97d3 100644
--- a/gulp/js/qunit2.js
+++ b/gulp/js/qunit2.js
@@ -81,7 +81,36 @@ gulp.task(taskName, function() {
 								});
 							});
 						}).then(function(results) {
-							console.log(results.summary);
+							var error;
+
+							results.details.forEach(function(test) {
+								if (test.failed === 0) {
+									util.log(util.colors.green(`✓ ${test.name}`));
+								} else {
+									util.log(util.colors.red(`× ${test.name}`));
+
+									test.assertions.filter(function(assertion) {
+										return !assertion.result;
+									}).forEach(function(assertion) {
+										util.log(util.colors.red(`Failing assertion: ${assertion.message}`));
+									});
+								}
+							});
+
+							if (results.summary.failed > 0) {
+								error = {
+									message: `Error in ${file}`,
+									task: taskName
+								};
+
+								if (!util.env.dev) {
+									return browser.close().then(function() {
+										helpers.errors(error);
+									});
+								}
+
+								helpers.errors(error);
+							}
 						});
 					});
 				});

From 143996f5a5c3506c8b577d71f1a451be50b3ba1a Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 09:15:04 +0100
Subject: [PATCH 04/10] [Update] Gulp: Added glob resolver to QUnit task

---
 gulp/js/default.js | 11 +++++++++--
 gulp/js/qunit2.js  | 28 +++++++++++++++++++++++-----
 2 files changed, 32 insertions(+), 7 deletions(-)

diff --git a/gulp/js/default.js b/gulp/js/default.js
index 40c1f662..626a2037 100644
--- a/gulp/js/default.js
+++ b/gulp/js/default.js
@@ -14,7 +14,7 @@ var taskName = 'js',
 			'./source/assets/js/main.js',
 			'./source/assets/js/head.js',
 			'./source/preview/assets/js/test.js',
-			'./source/demo/modules/slideshow/slideshow.test.js'
+			'./source/demo/modules/**/*.test.js'
 		],
 		devSrc: [
 			'./source/assets/js/dev.js'
@@ -44,10 +44,17 @@ var taskName = 'js',
 		var helpers = require('require-dir')('../../helpers'),
 			_ = require('lodash'),
 			path = require('path'),
+			glob = require('glob'),
 			webpack = require('webpack'),
 			livereload = require('gulp-livereload');
 
-		var src = config.src,
+		var src = taskConfig.src.reduce(function(paths, pathGlob) {
+				var resolvedGlob = glob.sync(pathGlob).map(function(file) {
+						return path.resolve(file);
+					});
+
+				return paths.concat(resolvedGlob);
+			}, []),
 			compiler;
 
 		// Optionally build dev scripts
diff --git a/gulp/js/qunit2.js b/gulp/js/qunit2.js
index 77bd97d3..6b18b946 100644
--- a/gulp/js/qunit2.js
+++ b/gulp/js/qunit2.js
@@ -9,7 +9,12 @@ var gulp = require('gulp');
 
 var taskName = 'js:qunit2',
 	taskConfig = {
-		src: './build/demo/modules/slideshow/*.html'
+		src: [
+			'./build/pages/**/*.html',
+			'./build/demo/pages/**/*.html',
+			'./build/modules/**/*.html',
+			'./build/demo/modules/**/*.html'
+		]
 	};
 
 gulp.task(taskName, function() {
@@ -19,9 +24,14 @@ gulp.task(taskName, function() {
 		glob = require('glob'),
 		path = require('path');
 
-	var files = glob.sync(taskConfig.src).map(function(file) {
-			return path.resolve(file);
-		});
+	// Create array of resolved paths
+	var src = taskConfig.src.reduce(function(paths, pathGlob) {
+			var resolvedGlob = glob.sync(pathGlob).map(function(file) {
+					return path.resolve(file);
+				});
+
+			return paths.concat(resolvedGlob);
+		}, []);
 
 	return puppeteer.launch({
 		// headless: false
@@ -56,7 +66,7 @@ gulp.task(taskName, function() {
 			// 	}
 			// });
 
-			files.forEach(function(file) {
+			src.forEach(function(file) {
 				pages = pages.then(function() {
 					util.log(util.colors.cyan('Testing'), file);
 
@@ -65,6 +75,10 @@ gulp.task(taskName, function() {
 					}).then(function() {
 						return page.evaluate(function() {
 							return new Promise(function (resolve, reject) {
+								if (typeof QUnit === 'undefined') {
+									return resolve();
+								}
+
 								var details = [];
 
 								QUnit.start();
@@ -81,6 +95,10 @@ gulp.task(taskName, function() {
 								});
 							});
 						}).then(function(results) {
+							if (!results) {
+								return;
+							}
+
 							var error;
 
 							results.details.forEach(function(test) {

From 019f99b4aabec308321a592a235ac8f2a8d030e7 Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 09:18:46 +0100
Subject: [PATCH 05/10] [Update] Gulp: Replaced PhantomJS test task with
 Headless Chrome, renamed to js:test

---
 docs/Tasks.md                         |   6 +-
 gulp/build.js                         |   6 +-
 gulp/js/qunit.js                      | 188 ------------------------
 gulp/js/{qunit2.js => test.js}        |   6 +-
 npm-shrinkwrap.json                   | 199 ++++++++++++++++----------
 package.json                          |   1 -
 source/preview/assets/js/phantomjs.js |   5 -
 7 files changed, 136 insertions(+), 275 deletions(-)
 delete mode 100644 gulp/js/qunit.js
 rename gulp/js/{qunit2.js => test.js} (95%)
 delete mode 100644 source/preview/assets/js/phantomjs.js

diff --git a/docs/Tasks.md b/docs/Tasks.md
index 9689498b..1a564328 100644
--- a/docs/Tasks.md
+++ b/docs/Tasks.md
@@ -17,7 +17,7 @@ Create static webserver with livereload functionality, serve build directory on
 ### `gulp build`
 Create build by running every HTML, CSS, JavaScript and media task.
 
-* Prompts whether the `js:qunit` task should run in the end (default: yes).
+* Prompts whether the `js:test` task should run in the end (default: yes).
 * For non-interactive mode: `gulp --interactive=false --skipTests`
 
 ### `gulp clean`
@@ -75,8 +75,8 @@ Create static JSON data mocks
 ### `gulp js:modernizr`
 Generate customized Modernizr build (using `Customizr`, crawling through files and gathering up references to Modernizr tests).
 
-### `gulp js:qunit`
-Run QUnit tests (using PhantomJS).
+### `gulp js:test`
+Open built HTML files in headless Chrome, report console errors and run QUnit tests.
 
 ### `gulp media:copy`
 Copy specific media files to build directory.
diff --git a/gulp/build.js b/gulp/build.js
index 192d995a..097b3870 100644
--- a/gulp/build.js
+++ b/gulp/build.js
@@ -4,7 +4,7 @@
  * @function `gulp build`
  * @desc Create build by running every HTML, CSS, JavaScript and media task.
  *
- * * Prompts whether the `js:qunit` task should run in the end (default: yes).
+ * * Prompts whether the `js:test` task should run in the end (default: yes).
  * * For non-interactive mode: `gulp --interactive=false --skipTests`
  */
 
@@ -43,7 +43,7 @@ gulp.task(taskName, function(cb) {
 						'media:copy',
 						'media:imageversions'
 					],
-					'js:qunit',
+					'js:test',
 					function(err) {
 						if (err) {
 							helpers.errors(err);
@@ -54,7 +54,7 @@ gulp.task(taskName, function(cb) {
 				];
 
 			if (skipTests) {
-				runTasks = _.without(runTasks, 'js:qunit');
+				runTasks = _.without(runTasks, 'js:test');
 			}
 
 			runSequence.apply(this, runTasks);
diff --git a/gulp/js/qunit.js b/gulp/js/qunit.js
deleted file mode 100644
index 0dcf4b7c..00000000
--- a/gulp/js/qunit.js
+++ /dev/null
@@ -1,188 +0,0 @@
-'use strict';
-
-/**
- * @function `gulp js:qunit`
- * @desc Run QUnit tests (using PhantomJS).
- */
-
-var gulp = require('gulp'),
-	util = require('gulp-util');
-
-var taskName = 'js:qunit',
-	taskConfig = {
-		srcTests: [
-			'./source/preview/assets/js/test.js',
-			'./source/modules/**/*.test.js',
-			'./source/demo/modules/**/*.test.js'
-		],
-		srcCustomJS: './source/preview/assets/js/phantomjs.js',
-		srcTestsBase: './',
-		srcTestsPattern: /\/modules\//,
-		destTests: './build/test/',
-		srcTemplates: [
-			'./build/pages/**/*.html',
-			'./build/demo/pages/**/*.html',
-			'./build/modules/**/*.html',
-			'./build/demo/modules/**/*.html',
-			'!./build/**/*.qunit.html'
-		],
-		srcTemplatesBase: './build/',
-		watch: [
-			'source/modules/**/*.test.js',
-			'source/demo/modules/**/*.test.js'
-		],
-		hasWebpackWatch: true,
-		viewports: {
-			tablet: { width: 700, height: 1000 },
-			mobile: { width: 400, height: 1000 },
-			desktop: { width: 1400, height: 1000 }
-		},
-		phantomJS: ['--web-security=no']
-	};
-
-gulp.task(taskName, function(cb) {
-	var helpers = require('require-dir')('../../helpers'),
-		path = require('path'),
-		through = require('through2'),
-		webpack = require('webpack'),
-		rename = require('gulp-rename'),
-		qunit = require('gulp-qunit'),
-		del = require('del'),
-		glob = require('glob'),
-		vinylPaths = require('vinyl-paths'),
-		_ = require('lodash'),
-		lazypipe = require('lazypipe'),
-		tap = require('gulp-tap'),
-		plumber = require('gulp-plumber');
-
-	var compiler,
-		src = [],
-		runQUnit = lazypipe(),
-		runTests = function(config, changedFiles, cb) {
-			gulp.src(config.srcTemplates, {
-				base: config.srcTemplatesBase
-			})
-				.pipe(through.obj(function(file, enc, done) {
-					var content = file.contents.toString(),
-						polyfillsPath = path.resolve(config.destTests, config.srcCustomJS),
-						changedFileMatch;
-
-					// Ignore files without a reference to a changed file
-					changedFileMatch = changedFiles.filter(function(filePath) {
-						return (content.search(filePath) !== -1);
-					});
-
-					if (!changedFileMatch.length) {
-						return done();
-					}
-
-					// Insert PhantomJS-specific code (autostart config, polyfills, e.g.)
-					content = content.replace('</body>', '<script src="' + polyfillsPath + '"></script></body>');
-
-					file.contents = Buffer.from(content);
-
-					this.push(file);
-
-					done();
-				}))
-
-				// Temporarily save to file system since gulp-qunit does not read from stream
-				.pipe(rename(function(filePath) {
-					filePath.basename += '.qunit';
-				}))
-				.pipe(gulp.dest(config.srcTemplatesBase))
-
-				// Run tests
-				.pipe(plumber())
-				.pipe(runQUnit().on('error', function(err) {
-					helpers.errors({
-						task: taskName,
-						message: err.message
-					});
-				}))
-
-				// Delete temporary files
-				.pipe(vinylPaths(del))
-				.on('finish', cb);
-		},
-		compilerCallback = function(err, stats) {
-			var changedFiles = Object.keys(stats.compilation.assets).filter(function(asset) {
-					return stats.compilation.assets[asset].emitted;
-				});
-
-			helpers.webpack.log(err, stats, taskName);
-
-			runTests(taskConfig, changedFiles, cb);
-		};
-
-	// Resolve test paths
-	taskConfig.srcTests.forEach(function(fileGlob) {
-		src = src.concat(glob.sync(fileGlob));
-	});
-
-	// Add polyfills to files to be copied
-	src = src.concat(taskConfig.srcCustomJS);
-
-	// Prepare viewports
-	_.each(taskConfig.viewports, function(viewport) {
-		runQUnit = runQUnit
-			.pipe(tap, function() {
-				if (viewport) {
-					util.log('Testing viewport ' + JSON.stringify(viewport));
-				} else {
-					util.log('Testing default viewport');
-				}
-			})
-			.pipe(qunit, {
-				page: {
-					viewportSize: viewport
-				},
-				'phantomjs-options': taskConfig.phantomJS
-			});
-	});
-
-	// Prepare test-config
-	compiler = webpack({
-		// Create a map of entries, i.e. {'assets/js/main': './source/assets/js/main.js'}
-		entry: helpers.webpack.getEntries(src, taskConfig.srcTestsBase),
-		module: {
-			loaders: [
-				{
-					test: /qunit\.js$/,
-					loader: 'expose?QUnit'
-				},
-				{
-					test: /\.css$/,
-					loader: 'style-loader!css-loader'
-				}
-			]
-		},
-		externals: function(context, request, callback) {
-			if (request === 'jquery') {
-				return callback(null, 'jQuery');
-			} else if (request === 'qunitjs' && taskConfig.srcTestsPattern.test(context)) {
-				return callback(null, 'QUnit');
-			}
-
-			callback();
-		},
-
-		output: {
-			path: taskConfig.destTests,
-			filename: '[name].js'
-		}
-	});
-
-	if (util.env.watch && !util.env.skipWebpackWatch) {
-		cb = _.once(cb);
-
-		compiler.watch({}, compilerCallback);
-	} else {
-		compiler.run(compilerCallback);
-	}
-});
-
-module.exports = {
-	taskName: taskName,
-	taskConfig: taskConfig
-};
diff --git a/gulp/js/qunit2.js b/gulp/js/test.js
similarity index 95%
rename from gulp/js/qunit2.js
rename to gulp/js/test.js
index 6b18b946..09db96c6 100644
--- a/gulp/js/qunit2.js
+++ b/gulp/js/test.js
@@ -1,13 +1,13 @@
 'use strict';
 
 /**
- * @function `gulp html:test`
- * @desc Open built HTML files in headless Chrome and report errors.
+ * @function `gulp js:test`
+ * @desc Open built HTML files in headless Chrome, report console errors and run QUnit tests.
  */
 
 var gulp = require('gulp');
 
-var taskName = 'js:qunit2',
+var taskName = 'js:test',
 	taskConfig = {
 		src: [
 			'./build/pages/**/*.html',
diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json
index 81f4c256..fc71c883 100644
--- a/npm-shrinkwrap.json
+++ b/npm-shrinkwrap.json
@@ -24,6 +24,11 @@
         }
       }
     },
+    "agent-base": {
+      "version": "4.1.2",
+      "from": "agent-base@>=4.1.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.1.2.tgz"
+    },
     "ajv": {
       "version": "4.11.4",
       "from": "ajv@>=4.7.0 <5.0.0",
@@ -41,7 +46,7 @@
     },
     "alphanum-sort": {
       "version": "1.0.2",
-      "from": "alphanum-sort@>=1.0.1 <2.0.0",
+      "from": "alphanum-sort@^1.0.1",
       "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
     },
     "amdefine": {
@@ -224,7 +229,7 @@
     },
     "assert": {
       "version": "1.4.1",
-      "from": "assert@>=1.1.1 <2.0.0",
+      "from": "assert@^1.1.1",
       "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
     },
     "assert-plus": {
@@ -257,6 +262,11 @@
       "from": "async-foreach@>=0.1.3 <0.2.0",
       "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
     },
+    "async-limiter": {
+      "version": "1.0.0",
+      "from": "async-limiter@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.0.tgz"
+    },
     "asynckit": {
       "version": "0.4.0",
       "from": "asynckit@>=0.4.0 <0.5.0",
@@ -1280,7 +1290,7 @@
     },
     "browserify-zlib": {
       "version": "0.1.4",
-      "from": "browserify-zlib@>=0.1.4 <0.2.0",
+      "from": "browserify-zlib@^0.1.4",
       "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
     },
     "browserslist": {
@@ -1290,7 +1300,7 @@
     },
     "buffer": {
       "version": "4.9.1",
-      "from": "buffer@>=4.9.0 <5.0.0",
+      "from": "buffer@^4.3.0",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz"
     },
     "buffer-crc32": {
@@ -1588,12 +1598,12 @@
     },
     "color-string": {
       "version": "0.3.0",
-      "from": "color-string@>=0.3.0 <0.4.0",
+      "from": "color-string@^0.3.0",
       "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
     },
     "colormin": {
       "version": "1.1.2",
-      "from": "colormin@>=1.0.5 <2.0.0",
+      "from": "colormin@^1.0.5",
       "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
     },
     "colors": {
@@ -1760,7 +1770,7 @@
     },
     "console-browserify": {
       "version": "1.1.0",
-      "from": "console-browserify@>=1.1.0 <1.2.0",
+      "from": "console-browserify@^1.1.0",
       "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
     },
     "console-control-strings": {
@@ -1886,7 +1896,7 @@
     },
     "cssesc": {
       "version": "0.1.0",
-      "from": "cssesc@>=0.1.0 <0.2.0",
+      "from": "cssesc@^0.1.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
     },
     "cssnano": {
@@ -2028,7 +2038,7 @@
     },
     "date-now": {
       "version": "0.1.4",
-      "from": "date-now@>=0.1.4 <0.2.0",
+      "from": "date-now@^0.1.4",
       "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
     },
     "date.js": {
@@ -2422,7 +2432,7 @@
     },
     "domain-browser": {
       "version": "1.1.7",
-      "from": "domain-browser@>=1.1.1 <2.0.0",
+      "from": "domain-browser@^1.1.1",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
     },
     "domelementtype": {
@@ -2646,7 +2656,7 @@
     },
     "errno": {
       "version": "0.1.4",
-      "from": "errno@>=0.1.3 <0.2.0",
+      "from": "errno@^0.1.3",
       "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
     },
     "error-ex": {
@@ -2674,6 +2684,11 @@
       "from": "es6-promise@>=4.0.3 <4.1.0",
       "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
     },
+    "es6-promisify": {
+      "version": "5.0.0",
+      "from": "es6-promisify@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/es6-promisify/-/es6-promisify-5.0.0.tgz"
+    },
     "es6-set": {
       "version": "0.1.4",
       "from": "es6-set@>=0.1.3 <0.2.0",
@@ -2814,7 +2829,7 @@
     },
     "events": {
       "version": "1.1.1",
-      "from": "events@>=1.0.0 <2.0.0",
+      "from": "events@^1.0.0",
       "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
     },
     "exec-buffer": {
@@ -3142,7 +3157,7 @@
     },
     "flatten": {
       "version": "1.0.2",
-      "from": "flatten@>=1.0.2 <2.0.0",
+      "from": "flatten@^1.0.2",
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
     },
     "for-in": {
@@ -3581,7 +3596,7 @@
         },
         "mkdirp": {
           "version": "0.5.1",
-          "from": "mkdirp@>=0.5.0 <0.6.0",
+          "from": "mkdirp@>=0.5.1 <0.6.0",
           "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz"
         },
         "ms": {
@@ -3596,7 +3611,7 @@
         },
         "nopt": {
           "version": "3.0.6",
-          "from": "nopt@>=3.0.1 <3.1.0",
+          "from": "nopt@>=3.0.6 <3.1.0",
           "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
         },
         "npmlog": {
@@ -3745,7 +3760,7 @@
         },
         "tar": {
           "version": "2.2.1",
-          "from": "tar@>=2.2.0 <2.3.0",
+          "from": "tar@>=2.2.1 <2.3.0",
           "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz"
         },
         "tar-pack": {
@@ -4532,28 +4547,6 @@
       "from": "gulp-prettify@0.5.0",
       "resolved": "https://registry.npmjs.org/gulp-prettify/-/gulp-prettify-0.5.0.tgz"
     },
-    "gulp-qunit": {
-      "version": "1.5.0",
-      "from": "gulp-qunit@1.5.0",
-      "resolved": "https://registry.npmjs.org/gulp-qunit/-/gulp-qunit-1.5.0.tgz",
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-        },
-        "through2": {
-          "version": "0.6.5",
-          "from": "through2@0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
-        }
-      }
-    },
     "gulp-raster": {
       "version": "0.1.0",
       "from": "git://github.com/unic/gulp-raster.git#acd044d950d9ed65870b3c39cb6294a09174d166",
@@ -5488,6 +5481,11 @@
       "from": "https-browserify@0.0.0",
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
     },
+    "https-proxy-agent": {
+      "version": "2.1.0",
+      "from": "https-proxy-agent@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.1.0.tgz"
+    },
     "iconv-lite": {
       "version": "0.4.17",
       "from": "iconv-lite@>=0.4.5 <0.5.0",
@@ -5500,7 +5498,7 @@
     },
     "ieee754": {
       "version": "1.1.8",
-      "from": "ieee754@>=1.1.4 <2.0.0",
+      "from": "ieee754@^1.1.4",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
     },
     "ignore": {
@@ -5572,7 +5570,7 @@
     },
     "indexes-of": {
       "version": "1.0.1",
-      "from": "indexes-of@>=1.0.1 <2.0.0",
+      "from": "indexes-of@^1.0.1",
       "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
     },
     "indexof": {
@@ -5815,7 +5813,7 @@
     },
     "is-plain-obj": {
       "version": "1.1.0",
-      "from": "is-plain-obj@>=1.0.0 <2.0.0",
+      "from": "is-plain-obj@^1.0.0",
       "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
     },
     "is-png": {
@@ -6108,7 +6106,7 @@
     },
     "jsesc": {
       "version": "1.3.0",
-      "from": "jsesc@>=1.3.0 <2.0.0",
+      "from": "jsesc@^1.3.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz"
     },
     "jshint-stylish": {
@@ -6659,7 +6657,7 @@
     },
     "macaddress": {
       "version": "0.2.8",
-      "from": "macaddress@>=0.2.8 <0.3.0",
+      "from": "macaddress@^0.2.8",
       "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
     },
     "make-iterator": {
@@ -7506,7 +7504,7 @@
     },
     "postcss-calc": {
       "version": "5.3.1",
-      "from": "postcss-calc@>=5.2.0 <6.0.0",
+      "from": "postcss-calc@^5.2.0",
       "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
     },
     "postcss-colormin": {
@@ -7521,7 +7519,7 @@
     },
     "postcss-discard-comments": {
       "version": "2.0.4",
-      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
+      "from": "postcss-discard-comments@^2.0.4",
       "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
     },
     "postcss-discard-duplicates": {
@@ -7531,12 +7529,12 @@
     },
     "postcss-discard-empty": {
       "version": "2.1.0",
-      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
+      "from": "postcss-discard-empty@^2.0.1",
       "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
     },
     "postcss-discard-overridden": {
       "version": "0.1.1",
-      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
+      "from": "postcss-discard-overridden@^0.1.1",
       "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
     },
     "postcss-discard-unused": {
@@ -7546,12 +7544,12 @@
     },
     "postcss-filter-plugins": {
       "version": "2.0.2",
-      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
+      "from": "postcss-filter-plugins@^2.0.0",
       "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
-      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
+      "from": "postcss-merge-idents@^2.1.5",
       "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
     },
     "postcss-merge-longhand": {
@@ -7573,12 +7571,12 @@
     },
     "postcss-message-helpers": {
       "version": "2.0.0",
-      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
+      "from": "postcss-message-helpers@^2.0.0",
       "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
     },
     "postcss-minify-font-values": {
       "version": "1.0.5",
-      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
+      "from": "postcss-minify-font-values@^1.0.2",
       "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
       "dependencies": {
         "object-assign": {
@@ -7694,7 +7692,7 @@
     },
     "postcss-unique-selectors": {
       "version": "2.0.2",
-      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
+      "from": "postcss-unique-selectors@^2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
     },
     "postcss-url": {
@@ -7789,9 +7787,14 @@
       "from": "proto-list@>=1.2.1 <1.3.0",
       "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz"
     },
+    "proxy-from-env": {
+      "version": "1.0.0",
+      "from": "proxy-from-env@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.0.0.tgz"
+    },
     "prr": {
       "version": "0.0.0",
-      "from": "prr@>=0.0.0 <0.1.0",
+      "from": "prr@~0.0.0",
       "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
     },
     "pseudomap": {
@@ -7804,6 +7807,48 @@
       "from": "punycode@>=1.4.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
     },
+    "puppeteer": {
+      "version": "0.13.0",
+      "from": "puppeteer@latest",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-0.13.0.tgz",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.9",
+          "from": "debug@>=2.6.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
+        },
+        "extract-zip": {
+          "version": "1.6.6",
+          "from": "extract-zip@>=1.6.5 <2.0.0",
+          "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.6.tgz"
+        },
+        "mime": {
+          "version": "1.6.0",
+          "from": "mime@>=1.3.4 <2.0.0",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz"
+        },
+        "mkdirp": {
+          "version": "0.5.0",
+          "from": "mkdirp@0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
+        },
+        "ms": {
+          "version": "2.0.0",
+          "from": "ms@2.0.0",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
+        },
+        "progress": {
+          "version": "2.0.0",
+          "from": "progress@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.0.tgz"
+        },
+        "yauzl": {
+          "version": "2.4.1",
+          "from": "yauzl@2.4.1",
+          "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz"
+        }
+      }
+    },
     "q": {
       "version": "1.4.1",
       "from": "q@>=1.1.2 <2.0.0",
@@ -7828,19 +7873,9 @@
     },
     "querystring-es3": {
       "version": "0.2.1",
-      "from": "querystring-es3@>=0.2.0 <0.3.0",
+      "from": "querystring-es3@^0.2.0",
       "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
     },
-    "qunit-phantomjs-runner": {
-      "version": "2.3.0",
-      "from": "qunit-phantomjs-runner@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/qunit-phantomjs-runner/-/qunit-phantomjs-runner-2.3.0.tgz"
-    },
-    "qunit-reporter-junit": {
-      "version": "1.1.1",
-      "from": "qunit-reporter-junit@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/qunit-reporter-junit/-/qunit-reporter-junit-1.1.1.tgz"
-    },
     "qunitjs": {
       "version": "2.0.1",
       "from": "qunitjs@2.0.1",
@@ -7873,6 +7908,11 @@
         }
       }
     },
+    "raf-throttle": {
+      "version": "2.0.3",
+      "from": "raf-throttle@2.0.3",
+      "resolved": "https://registry.npmjs.org/raf-throttle/-/raf-throttle-2.0.3.tgz"
+    },
     "randomatic": {
       "version": "1.1.6",
       "from": "randomatic@>=1.1.3 <2.0.0",
@@ -7988,7 +8028,7 @@
     },
     "reduce-css-calc": {
       "version": "1.3.0",
-      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
+      "from": "reduce-css-calc@^1.2.6",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
     },
     "reduce-extract": {
@@ -8258,6 +8298,11 @@
       "from": "rx-lite@>=3.1.2 <4.0.0",
       "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz"
     },
+    "safe-buffer": {
+      "version": "5.1.1",
+      "from": "safe-buffer@>=5.1.0 <5.2.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz"
+    },
     "sass-graph": {
       "version": "2.1.2",
       "from": "sass-graph@>=2.1.1 <3.0.0",
@@ -8410,7 +8455,7 @@
     },
     "shebang-regex": {
       "version": "1.0.0",
-      "from": "shebang-regex@>=1.0.0 <2.0.0",
+      "from": "shebang-regex@^1.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz"
     },
     "shelljs": {
@@ -8470,7 +8515,7 @@
     },
     "slash": {
       "version": "1.0.0",
-      "from": "slash@>=1.0.0 <2.0.0",
+      "from": "slash@^1.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz"
     },
     "slice-ansi": {
@@ -8495,7 +8540,7 @@
     },
     "sort-keys": {
       "version": "1.1.2",
-      "from": "sort-keys@>=1.0.0 <2.0.0",
+      "from": "sort-keys@^1.0.0",
       "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz"
     },
     "source-list-map": {
@@ -8792,7 +8837,7 @@
     },
     "strict-uri-encode": {
       "version": "1.1.0",
-      "from": "strict-uri-encode@>=1.0.0 <2.0.0",
+      "from": "strict-uri-encode@^1.0.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
     },
     "string_decoder": {
@@ -9242,6 +9287,11 @@
       "from": "uglify-to-browserify@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz"
     },
+    "ultron": {
+      "version": "1.1.1",
+      "from": "ultron@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.1.tgz"
+    },
     "unc-path-regex": {
       "version": "0.1.2",
       "from": "unc-path-regex@>=0.1.0 <0.2.0",
@@ -9281,7 +9331,7 @@
     },
     "uniqs": {
       "version": "2.0.0",
-      "from": "uniqs@>=2.0.0 <3.0.0",
+      "from": "uniqs@^2.0.0",
       "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz"
     },
     "unique-stream": {
@@ -9355,7 +9405,7 @@
     },
     "util": {
       "version": "0.10.3",
-      "from": "util@>=0.10.3 <0.11.0",
+      "from": "util@^0.10.3",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
       "dependencies": {
         "inherits": {
@@ -9426,7 +9476,7 @@
     },
     "vendors": {
       "version": "1.0.1",
-      "from": "vendors@>=1.0.0 <2.0.0",
+      "from": "vendors@^1.0.0",
       "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz"
     },
     "verror": {
@@ -9734,6 +9784,11 @@
       "from": "write@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/write/-/write-0.2.1.tgz"
     },
+    "ws": {
+      "version": "3.3.2",
+      "from": "ws@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.2.tgz"
+    },
     "xmldom": {
       "version": "0.1.27",
       "from": "xmldom@>=0.1.22 <0.2.0",
diff --git a/package.json b/package.json
index 4ce1b77e..46f89fb7 100644
--- a/package.json
+++ b/package.json
@@ -59,7 +59,6 @@
     "gulp-plumber": "1.1.0",
     "gulp-postcss": "6.2.0",
     "gulp-prettify": "0.5.0",
-    "gulp-qunit": "1.5.0",
     "gulp-raster": "git://github.com/unic/gulp-raster.git#acd044d950d9ed65870b3c39cb6294a09174d166",
     "gulp-rename": "1.2.2",
     "gulp-sass": "2.3.2",
diff --git a/source/preview/assets/js/phantomjs.js b/source/preview/assets/js/phantomjs.js
deleted file mode 100644
index 20bc8bc2..00000000
--- a/source/preview/assets/js/phantomjs.js
+++ /dev/null
@@ -1,5 +0,0 @@
-/**
- * Load and init PhantomJS-specific code (polyfills, e.g.)
- */
-
-QUnit.config.autostart = true;

From 5a14e21203bf5804b844987123da23aa58e616ea Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 10:12:33 +0100
Subject: [PATCH 06/10] [Update] Gulp: Run js:test in multiple viewports

---
 gulp/js/test.js | 131 +++++++++++++++++++++++++++++-------------------
 1 file changed, 80 insertions(+), 51 deletions(-)

diff --git a/gulp/js/test.js b/gulp/js/test.js
index 09db96c6..7851bb0f 100644
--- a/gulp/js/test.js
+++ b/gulp/js/test.js
@@ -14,6 +14,11 @@ var taskName = 'js:test',
 			'./build/demo/pages/**/*.html',
 			'./build/modules/**/*.html',
 			'./build/demo/modules/**/*.html'
+		],
+		viewports: [
+			{ width: 700, height: 1000 },
+			{ width: 400, height: 1000 },
+			{ width: 1400, height: 1000 }
 		]
 	};
 
@@ -24,6 +29,68 @@ gulp.task(taskName, function() {
 		glob = require('glob'),
 		path = require('path');
 
+	function runTests(page, file) {
+		return page.evaluate(function() {
+			return new Promise(function (resolve, reject) {
+				if (typeof QUnit === 'undefined') {
+					return resolve();
+				}
+
+				var details = [];
+
+				QUnit.start();
+
+				QUnit.testDone(function(results) {
+					details.push(results);
+				});
+
+				QUnit.done(function(summary) {
+					resolve({
+						details: details,
+						summary: summary
+					});
+				});
+			});
+		}).then(function(results) {
+			if (!results) {
+				return;
+			}
+
+			var error;
+
+			results.details.forEach(function(test) {
+				if (test.failed === 0) {
+					util.log(util.colors.green(`✓ ${test.name}`));
+				} else {
+					util.log(util.colors.red(`× ${test.name}`));
+
+					test.assertions.filter(function(assertion) {
+						return !assertion.result;
+					}).forEach(function(assertion) {
+						util.log(util.colors.red(`Failing assertion: ${assertion.message}`));
+					});
+				}
+			});
+
+			if (results.summary.failed > 0) {
+				error = {
+					message: `Error in ${file}`,
+					task: taskName
+				};
+
+				if (!util.env.dev) {
+					return browser.close().then(function() {
+						helpers.errors(error);
+					});
+				}
+
+				helpers.errors(error);
+			}
+
+			return results;
+		});
+	}
+
 	// Create array of resolved paths
 	var src = taskConfig.src.reduce(function(paths, pathGlob) {
 			var resolvedGlob = glob.sync(pathGlob).map(function(file) {
@@ -73,63 +140,25 @@ gulp.task(taskName, function() {
 					return page.goto('file://' + file, {
 						// waitUntil: 'domcontentloaded'
 					}).then(function() {
-						return page.evaluate(function() {
-							return new Promise(function (resolve, reject) {
-								if (typeof QUnit === 'undefined') {
-									return resolve();
-								}
+						var tests = Promise.resolve();
 
-								var details = [];
+						taskConfig.viewports.forEach(function(viewport, i) {
+							tests = tests.then(function() {
+								return page.setViewport(viewport).then(function() {
+									if (i > 0) {
+										return page.reload();
+									}
 
-								QUnit.start();
+									return page;
+								}).then(function() {
+									util.log(util.colors.cyan('Viewport'), viewport);
 
-								QUnit.testDone(function(results) {
-									details.push(results);
-								});
-
-								QUnit.done(function(summary) {
-									resolve({
-										details: details,
-										summary: summary
-									});
+									return runTests(page, file);
 								});
 							});
-						}).then(function(results) {
-							if (!results) {
-								return;
-							}
-
-							var error;
-
-							results.details.forEach(function(test) {
-								if (test.failed === 0) {
-									util.log(util.colors.green(`✓ ${test.name}`));
-								} else {
-									util.log(util.colors.red(`× ${test.name}`));
-
-									test.assertions.filter(function(assertion) {
-										return !assertion.result;
-									}).forEach(function(assertion) {
-										util.log(util.colors.red(`Failing assertion: ${assertion.message}`));
-									});
-								}
-							});
-
-							if (results.summary.failed > 0) {
-								error = {
-									message: `Error in ${file}`,
-									task: taskName
-								};
-
-								if (!util.env.dev) {
-									return browser.close().then(function() {
-										helpers.errors(error);
-									});
-								}
-
-								helpers.errors(error);
-							}
 						});
+
+						return tests;
 					});
 				});
 			});

From 407432a0a05f059d8958b966ef6cfd809dfab3ed Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 11:30:44 +0100
Subject: [PATCH 07/10] [Fix] Gulp: Pass browser instance to test runner

---
 gulp/js/test.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/gulp/js/test.js b/gulp/js/test.js
index 7851bb0f..550e35a8 100644
--- a/gulp/js/test.js
+++ b/gulp/js/test.js
@@ -29,7 +29,7 @@ gulp.task(taskName, function() {
 		glob = require('glob'),
 		path = require('path');
 
-	function runTests(page, file) {
+	function runTests(browser, page, file) {
 		return page.evaluate(function() {
 			return new Promise(function (resolve, reject) {
 				if (typeof QUnit === 'undefined') {
@@ -153,7 +153,7 @@ gulp.task(taskName, function() {
 								}).then(function() {
 									util.log(util.colors.cyan('Viewport'), viewport);
 
-									return runTests(page, file);
+									return runTests(browser, page, file);
 								});
 							});
 						});

From 0bba90ace2cbbb636546e1d73c099e1d2c068eab Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 11:33:26 +0100
Subject: [PATCH 08/10] [Fix] Gulp: Fixed test script paths for prod mode

---
 helpers/data.js                                 | 8 +++++++-
 source/demo/modules/slideshow/slideshow.data.js | 2 +-
 source/preview/partials/qunit.hbs               | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/helpers/data.js b/helpers/data.js
index e671f72b..5569e732 100644
--- a/helpers/data.js
+++ b/helpers/data.js
@@ -11,6 +11,7 @@ var _ = require('lodash'),
 	Highlight = require('highlight.js'),
 	marked = require('marked'),
 	prettify = require('js-beautify'),
+	util = require('gulp-util'),
 	fileCache = {},
 	getFile = function(requirePath) {
 		var cache = fileCache[requirePath],
@@ -75,11 +76,16 @@ module.exports = {
 
 	getTestScriptPath: function(filePath) {
 		var requirePath = getRequirePath(filePath),
-			scriptPath = path.join('/test/', path.relative('./', requirePath));
+			scriptPath = path.join('/', path.relative('./source', requirePath));
 
 		// Fix path on windows
 		scriptPath = scriptPath.replace(new RegExp('\\' + path.sep, 'g'), '/');
 
+		// Add .min in prod mode
+		if (!util.env.dev) {
+			scriptPath = scriptPath.replace(/\.js/, '.min.js');
+		}
+
 		return scriptPath;
 	},
 
diff --git a/source/demo/modules/slideshow/slideshow.data.js b/source/demo/modules/slideshow/slideshow.data.js
index 3f96cf51..76e88378 100644
--- a/source/demo/modules/slideshow/slideshow.data.js
+++ b/source/demo/modules/slideshow/slideshow.data.js
@@ -14,7 +14,7 @@ var _ = require('lodash'),
 			jira: 'JIRA-4',
 			documentation: dataHelper.getDocumentation('slideshow.md'),
 			testScripts: [
-				'slideshow.test.js'
+				dataHelper.getTestScriptPath('slideshow.test.js')
 			],
 			mocks: [
 				{
diff --git a/source/preview/partials/qunit.hbs b/source/preview/partials/qunit.hbs
index adb19d84..62ae71dc 100644
--- a/source/preview/partials/qunit.hbs
+++ b/source/preview/partials/qunit.hbs
@@ -3,7 +3,7 @@
 		<div id="qunit"></div>
 		<div id="qunit-fixture"></div>
 
-		<script src="/preview/assets/js/test.js"></script>
+		<script src="/preview/assets/js/test{{#unless env.dev}}.min{{/unless}}.js"></script>
 
 		{{#each meta.testScripts}}
 			<script src="{{this}}"></script>

From 0b61d7687fd0252e271a68b1ed0707838b426b2a Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 12:00:42 +0100
Subject: [PATCH 09/10] [Fix] Gulp: Move test scripts into preview/assets/js

---
 gulp/js/default.js | 11 ++++++++++-
 helpers/data.js    |  2 +-
 helpers/webpack.js | 16 +++++++++-------
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/gulp/js/default.js b/gulp/js/default.js
index 626a2037..36d9996b 100644
--- a/gulp/js/default.js
+++ b/gulp/js/default.js
@@ -20,6 +20,8 @@ var taskName = 'js',
 			'./source/assets/js/dev.js'
 		],
 		srcBase: './source/assets/js/',
+		testSrcRoot: './source/',
+		testSrcBase: './source/preview/assets/js/',
 		dest: './build/assets/js/',
 		destBase: './build/',
 		destAsyncSuffix: 'async/',
@@ -64,7 +66,14 @@ var taskName = 'js',
 
 		compiler = webpack({
 			// Create a map of entries, i.e. {'assets/js/main': './source/assets/js/main.js'}
-			entry: helpers.webpack.getEntries(src, config.srcBase),
+			entry: helpers.webpack.getEntries(src, config.srcBase, function(key, srcBase, file) {
+				// Move test files into 'preview/assets/js'
+				if (path.extname(key) === '.test') {
+					key = path.join(path.relative(config.srcBase, config.testSrcBase), path.relative(config.testSrcRoot, file)).replace(path.extname(file), '');
+				}
+
+				return key;
+			}),
 			module: {
 				loaders: [
 					{
diff --git a/helpers/data.js b/helpers/data.js
index 5569e732..32c97b35 100644
--- a/helpers/data.js
+++ b/helpers/data.js
@@ -76,7 +76,7 @@ module.exports = {
 
 	getTestScriptPath: function(filePath) {
 		var requirePath = getRequirePath(filePath),
-			scriptPath = path.join('/', path.relative('./source', requirePath));
+			scriptPath = path.join('/preview/assets/js/', path.relative('./source', requirePath));
 
 		// Fix path on windows
 		scriptPath = scriptPath.replace(new RegExp('\\' + path.sep, 'g'), '/');
diff --git a/helpers/webpack.js b/helpers/webpack.js
index 7831c559..d4c4d250 100644
--- a/helpers/webpack.js
+++ b/helpers/webpack.js
@@ -7,15 +7,17 @@ var _ = require('lodash'),
 
 module.exports = {
 	getEntries: function(src, srcBase, transformKey) {
-		return _.keyBy(src, function(file) {
-			var key = path.relative(srcBase, file).replace(path.extname(file), '');
+		var entries = _.keyBy(src, function(file) {
+				var key = path.relative(srcBase, file).replace(path.extname(file), '');
 
-			if (transformKey) {
-				key = transformKey(key);
-			}
+				if (transformKey) {
+					key = transformKey(key, srcBase, file);
+				}
 
-			return key;
-		});
+				return key;
+			});
+
+		return entries;
 	},
 
 	log: function(err, stats, taskName) {

From dbb968300717ef1cef1628e50b7113cd5d96d715 Mon Sep 17 00:00:00 2001
From: Thomas Jaggi <thomas.jaggi@unic.com>
Date: Mon, 27 Nov 2017 13:14:04 +0100
Subject: [PATCH 10/10] [Fix] Register explicit
 'estatico.events.(throttled|debounced)(resize|scroll)' over just
 'estatico.events.(resize|scroll)'

---
 docs/Coding_Guidelines.md                       | 4 ++--
 source/assets/js/helpers/events.js              | 4 ++--
 source/demo/modules/slideshow/slideshow.test.js | 8 ++++----
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/docs/Coding_Guidelines.md b/docs/Coding_Guidelines.md
index 0ce76c21..daedd074 100644
--- a/docs/Coding_Guidelines.md
+++ b/docs/Coding_Guidelines.md
@@ -93,12 +93,12 @@ It is highly recommended to integrate ESLint with your IDE. Instructions can be
 
 ```js
 // Scroll
-$(document).on(estatico.events.scroll, function(event, originalEvent) {
+$(document).on(estatico.events.throttledscroll, function(event, originalEvent) {
 	console.log(originalEvent);
 }.bind(this));
 
 // Resize
-$(document).on(estatico.events.resize, function(event, originalEvent) {
+$(document).on(estatico.events.debouncedresize, function(event, originalEvent) {
 	console.log(originalEvent);
 }.bind(this));
 ```
diff --git a/source/assets/js/helpers/events.js b/source/assets/js/helpers/events.js
index 931d5c58..d8508099 100644
--- a/source/assets/js/helpers/events.js
+++ b/source/assets/js/helpers/events.js
@@ -57,7 +57,7 @@ class WindowEventListener {
 
 		// Save to global namespace
 		$.extend(true, estatico, { events: {} });
-		estatico.events[eventName] = debouncedEventName;
+		estatico.events[debouncedEventName.split('.')[0]] = debouncedEventName;
 	}
 
 	/**
@@ -80,7 +80,7 @@ class WindowEventListener {
 
 		// Save to global namespace
 		$.extend(true, estatico, { events: {} });
-		estatico.events[eventName] = throttledEventName;
+		estatico.events[throttledEventName.split('.')[0]] = throttledEventName;
 	}
 
 	/**
diff --git a/source/demo/modules/slideshow/slideshow.test.js b/source/demo/modules/slideshow/slideshow.test.js
index 87243393..560ba279 100644
--- a/source/demo/modules/slideshow/slideshow.test.js
+++ b/source/demo/modules/slideshow/slideshow.test.js
@@ -34,11 +34,11 @@ QUnit.test('Test correct plugin init', function(assert) {
 		}),
 
 		docEvents = $._data(document, 'events'),
-		resizeEvent = $.grep(docEvents[estatico.events.resize.split('.')[0]] || [], function(event) {
+		resizeEvent = $.grep(docEvents[estatico.events.debouncedresize.split('.')[0]] || [], function(event) {
 			return $.inArray(instance.uuid, event.namespace.split('.')) !== -1;
 		}),
 
-		scrollEvent = $.grep(docEvents[estatico.events.scroll.split('.')[0]] || [], function(event) {
+		scrollEvent = $.grep(docEvents[estatico.events.throttledscroll.split('.')[0]] || [], function(event) {
 			return $.inArray(instance.uuid, event.namespace.split('.')) !== -1;
 		}),
 
@@ -70,11 +70,11 @@ QUnit.test('Test correct plugin destroy', function(assert) {
 		}),
 
 		docEvents = $._data(document, 'events'),
-		resizeEvent = $.grep(docEvents[estatico.events.resize.split('.')[0]] || [], function(event) {
+		resizeEvent = $.grep(docEvents[estatico.events.debouncedresize.split('.')[0]] || [], function(event) {
 			return $.inArray(instance.uuid, event.namespace.split('.')) !== -1;
 		}),
 
-		scrollEvent = $.grep(docEvents[estatico.events.scroll.split('.')[0]] || [], function(event) {
+		scrollEvent = $.grep(docEvents[estatico.events.throttledscroll.split('.')[0]] || [], function(event) {
 			return $.inArray(instance.uuid, event.namespace.split('.')) !== -1;
 		}),