Implements testing over a more robust set of browsers.

web/unit_tests/CI.conf.js

@@ -4,11 +4,173 @@
 // Super-useful!  http://www.bradoncode.com/blog/2015/02/27/karma-tutorial/#handling-html-fixtures
 
 module.exports = function(config) {
+
+  /*
+   * Definition of utility functions for managing our browser lists.
+   */
+  var mergeLaunchers = function() {
+    var mergedDefs = {};
+    var i;
+    for(i=0; i < arguments.length; i++) {
+      for(var name in arguments[i]) {
+        mergedDefs[name] = arguments[i][name];
+
+        // Necessary for Karma to process it properly.
+        mergedDefs[name].base = 'BrowserStack';
+      }
+    }
+
+    return mergedDefs;
+  }
+
+  var toBrowserList = function(mergedSet) {
+    var list = [];
+    for(var name in mergedSet) {
+      list.push(name);
+    }
+
+    return list;
+  }
+
+  /*
+   * Definition of browser sets possibly relevant for testing.
+   */
+  var CURRENT_MAC_LAUNCHERS = {
+    bs_firefox_mac: {
+      browser: 'firefox',
+      browser_version: '58',
+      os: 'OS X',
+      os_version: 'High Sierra'
+    },
+    bs_safari_mac: {
+      browser: 'safari',
+      browser_version: '11.0',
+      os: 'OS X',
+      os_version: 'High Sierra'
+    },
+    bs_chrome_mac: {
+      browser: 'chrome',
+      browser_version: '64.0',
+      os: 'OS X',
+      os_version: 'High Sierra'
+    }
+  };
+
+  
+  var CURRENT_IOS_LAUNCHERS = {
+    bs_iphoneX: {
+      device: 'iPhone X',
+      real_mobile: false,
+      os: 'ios',
+      os_version: '11.0'
+    },
+    bs_ipad5: {
+      device: 'iPad 5th',
+      real_mobile: false,
+      os: 'ios',
+      os_version: '11.0'
+    }
+  };
+
+  var CURRENT_WIN_LAUNCHERS = {
+    bs_firefox_win: {
+      os: 'Windows',
+      os_version: '10',
+      browser: 'firefox',
+      browser_version: '58.0'
+    },
+    bs_chrome_win: {
+      os: 'Windows',
+      os_version: '10',
+      browser: 'chrome',
+      browser_version: '64.0'
+    },
+    bs_ie_win: {
+      os: 'Windows',
+      os_version: '10',
+      browser: 'ie',
+      browser_version: '11.0'
+    },
+    bs_edge_win: {
+      os: 'Windows',
+      os_version: '10',
+      browser: 'edge',
+      browser_version: '16.0'
+    }
+  }
+
+  var CURRENT_ANDROID_LAUNCHERS = {
+    bs_native_android: {
+      os: 'android',
+      os_version: '7.1',
+      browser: 'android',
+      real_mobile: true,
+      device: 'Samsung Galaxy Note 8'
+    },
+    bs_chrome_android: {
+      os: 'android',
+      os_version: '7.1',
+      browser: 'chrome',
+      real_mobile: true,
+      device: 'Samsung Galaxy Note 8'
+    }
+  }
+
+  var LEGACY_MAC_LAUNCHERS = {
+    bs_firefox_legacy_mac: {
+      browser: 'firefox',
+      browser_version: '40.0',
+      os: 'OS X',
+      os_version: 'Mountain Lion'
+    },
+    bs_safari_legacy_mac: {
+      browser: 'safari',
+      browser_version: '6.2',
+      os: 'OS X',
+      os_version: 'Mountain Lion'
+    }
+  };
+
+  var LEGACY_IOS_LAUNCHERS = {
+    bs_iphone7: {
+      device: 'iPhone 7',
+      real_mobile: false,
+      os: 'ios',
+      os_version: '10.3'
+    }
+  };
+
+  // Sadly, legacy IE isn't very testable with Mocha.  One of its dependencies requires a feature that is IE11+.
+
+  /*
+   * Final selection of the sets to be used for BrowserStack testing.
+   */
+  var FINAL_LAUNCHER_DEFS = mergeLaunchers( CURRENT_MAC_LAUNCHERS,
+                                            CURRENT_IOS_LAUNCHERS,
+                                            CURRENT_WIN_LAUNCHERS,
+                                            CURRENT_ANDROID_LAUNCHERS,
+                                            LEGACY_MAC_LAUNCHERS,
+                                            LEGACY_IOS_LAUNCHERS);
+
+  var FINAL_BROWSER_LIST = toBrowserList(FINAL_LAUNCHER_DEFS);
+
+  /*
+   * Final definition of our BrowserStack testing Karma configuration.
+   */
+
   config.set({
 
     // base path that will be used to resolve all patterns (eg. files, exclude)
     basePath: '..',
 
+    // BrowserStack configuration options
+    browserStack: {
+      video: false,
+      retryLimit: 1, // 0 is ignored.
+      startTunnel: true,
+    },
+
+    captureTimeout: 180000, // in milliseconds
 
     // frameworks to use
     // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
@@ -72,39 +234,11 @@ module.exports = function(config) {
     singleRun: true,
 
     // Concurrency level
-    // how many browser should be started simultaneous
-    concurrency: Infinity,
+    // For CI, it really helps to keep a nice, clean set of output logs.
+    concurrency: 5,
 
-    browserStack: {
-      startTunnel: true,
-      retryLimit: 0,
-      video: false
-    },
+    customLaunchers: FINAL_LAUNCHER_DEFS,
 
-    customLaunchers: {
-      bs_firefox_mac: {
-        base: 'BrowserStack',
-        browser: 'firefox',
-        browser_version: '40.0',
-        os: 'OS X',
-        os_version: 'Mountain Lion'
-      },
-      bs_safari_mac: {
-        base: 'BrowserStack',
-        browser: 'safari',
-        browser_version: '6.2',
-        os: 'OS X',
-        os_version: 'Mountain Lion'
-      },
-      bs_iphone5: {
-        base: 'BrowserStack',
-        device: 'iPhone 7',
-        realMobile: 'true',
-        os: 'ios',
-        os_version: '10.3'
-      }
-    },
-
-    browsers: ['bs_firefox_mac', 'bs_safari_mac', 'bs_iphone5']
+    browsers: FINAL_BROWSER_LIST
   })
 }

web/unit_tests/cases/basics.js

@@ -3,7 +3,7 @@ var assert = chai.assert;
 describe('KeymanWeb Initialization', function() {
 
   beforeEach(function(done) {
-    this.timeout(5000);
+    this.timeout(10000);
 
     fixture.setBase('unit_tests/fixtures');
     fixture.load("singleInput.html");
@@ -34,7 +34,7 @@ Modernizr.on('touchevents', function(result) {
     describe('Toggle UI Initialization', function() {
 
       beforeEach(function(done) {
-        this.timeout(5000);
+        this.timeout(10000);
         fixture.setBase('unit_tests/fixtures');
         fixture.load('singleInput.html');
 
@@ -69,7 +69,7 @@ Modernizr.on('touchevents', function(result) {
     describe('Button UI Initialization', function() {
 
       beforeEach(function(done) {
-        this.timeout(5000);
+        this.timeout(10000);
         fixture.setBase('unit_tests/fixtures');
         fixture.load('singleInput.html');
 
@@ -91,7 +91,7 @@ Modernizr.on('touchevents', function(result) {
     describe('Float UI Initialization', function() {
 
       beforeEach(function(done) {
-        this.timeout(5000);
+        this.timeout(10000);
         fixture.setBase('unit_tests/fixtures');
         fixture.load('singleInput.html');
 
@@ -126,13 +126,14 @@ Modernizr.on('touchevents', function(result) {
     describe('Toolbar UI Initialization', function() {
 
       beforeEach(function(done) {
-        this.timeout(5000);
+        this.timeout(10000);
         fixture.setBase('unit_tests/fixtures');
         fixture.load('singleInput.html');
 
         setupKMW('toolbar');
 
-        initTimer(done);
+        // The Toolbar UI has extra-special init to do... may as well feed it more time.
+        initTimer(done, 2500);
       });
       
       afterEach(function() {

web/unit_tests/debug.conf.js

@@ -1,86 +0,0 @@
-// Karma configuration
-// Generated on Mon Jan 29 2018 11:58:53 GMT+0700 (SE Asia Standard Time)
-
-// Super-useful!  http://www.bradoncode.com/blog/2015/02/27/karma-tutorial/#handling-html-fixtures
-
-module.exports = function(config) {
-  config.set({
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '..',
-
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'chai', 'fixture'],
-
-
-    // list of files / patterns to load in the browser
-    files: [
-      'unit_tests/test_utils.js', // A basic utility script useful for constructing tests
-      'unit_tests/modernizr.js', // A dependency-managed utility script that helps with browser feature detection.
-      'unit_tests/cases/**/*.js', // Where the tests actually reside.
-      {pattern: 'release/unminified/web/**/*.css', watched: false, served: true, included: false}, // OSK resources
-      {pattern: 'release/unminified/web/**/*.gif', watched: false, served: true, included: false}, // OSK resources
-      {pattern: 'release/unminified/web/**/*.png', watched: false, served: true, included: false}, // OSK resources
-      {pattern: 'release/unminified/web/*.js', watched: true, served: true, included: false},  // The actual KMW code.
-      {pattern: 'release/unminified/web/*.map', watched: true, served: true, included: false}, // + sourcemaps.
-      {pattern: 'unit_tests/fixtures/**/*.html', watched: true} // HTML structures useful for testing.
-    ],
-
-    proxies: {
-      "/source/": "/base/release/unminified/web/"
-    },
-
-
-    // list of files / patterns to exclude
-    exclude: [
-    ],
-
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-		'**/*.html'	: ['html2js']
-    },
-
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: true,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['Firefox', 'IE', 'Chrome', 'Edge'], // Can be specified at run-time instead!
-	// Future note for us:  https://www.npmjs.com/package/karma-browserstack-launcher
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-	// if false, it generates the pages and acts as a persistent server.
-    singleRun: false,
-
-    // Concurrency level
-    // how many browser should be started simultaneous
-    concurrency: Infinity
-  })
-}

web/unit_tests/manual.conf.js

@@ -37,14 +37,12 @@ module.exports = function(config) {
     exclude: [
     ],
 
-
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
 		'**/*.html'	: ['html2js']
     },
 
-
     // test results reporter to use
     // possible values: 'dots', 'progress'
     // available reporters: https://npmjs.org/browse/keyword/karma-reporter

web/unit_tests/test.sh

@@ -1,16 +1,20 @@
 #! /bin/bash
 
 # A simple utility script to facilitate our different modes for unit-testing KMW.
-# It's rigged to be callable 
+# It's rigged to be callable by NPM to facilitate testing during development when in other folders.
 
 display_usage ( ) {
-    echo "test.sh [-CI | -debug | -? | -h | -help]"
+    echo "test.sh [-CI | -debug | -? | -h | -help] [-r <reporter>]"
     echo
     echo "  -CI               to run unit tests in CI mode on BrowserStack."
     echo "                    This requires credentials to be set in environment variables - see "
     echo "                    https://stackoverflow.com/questions/32450546/hiding-browserstack-key-in-karma"
     echo ""
     echo "  -debug            to establish a Karma server that facilitates unit test debugging"
+    echo "                    Not compatible with -CI."
+    echo ""
+    echo "  -r                sets the test engine to utilize the specified <reporter>."
+    echo "                    Valid options:  BrowserStack, teamcity, dots, progress, mocha"
     echo ""
     echo "  -? | -h | -help   to display this help information"
     echo ""
@@ -20,7 +24,9 @@ display_usage ( ) {
 }
 
 # Defaults
-CONFIG=manual.conf.js
+CONFIG=manual.conf.js  # TODO - get/make OS-specific version
+DEBUG=false
+FLAGS=
 
 # Parse args
 while [[ $# -gt 0 ]] ; do
@@ -30,7 +36,13 @@ while [[ $# -gt 0 ]] ; do
             CONFIG=CI.conf.js
             ;;
         -debug)
-            CONFIG=debug.conf.js
+            # Disables the default 'run once, then done' configuration needed for CI.
+            DEBUG=true
+            FLAGS="--no-single-run $FLAGS"
+            ;;
+        -r)
+            shift
+            FLAGS="--reporters $1 $FLAGS"
             ;;
         -h)
             display_usage
@@ -45,8 +57,13 @@ while [[ $# -gt 0 ]] ; do
     shift # past argument
 done
 
+if [ $DEBUG = true ] && [ $CONFIG = CI.conf.js ]; then
+    echo "-CI and -debug are not compatible!"
+    exit 1
+fi
+
 npm run modernizr -- -c unit_tests/modernizr.config.json -d unit_tests/modernizr.js
-npm run karma start unit_tests/$CONFIG
+npm run karma -- start $FLAGS unit_tests/$CONFIG
 
 CODE=$?
 

web/unit_tests/test_utils.js

@@ -50,13 +50,13 @@ var teardownKMW = function() {
 }
 
 // Make sure the main script loads...
-var initTimer = function(done) {
+var initTimer = function(done, timeout) {
   window.setTimeout(function() {
     if(window['keyman']) {
       // ... and then give KMW and the UI a bit more time to init and attach.
       window.setTimeout(function() {
         done();
-      }, 1000);
+      }, timeout ? timeout : 1000);
     } else {
       initTimer(done);
     }