chore(tests) add karma to 'watch' and 'build' tasks

Author: kfb

config.json

@@ -4,17 +4,21 @@
     "dist"  : "dist",
 
     "paths" : {
-        "scripts"   : "src/+(app|common)/**/*.js",
-        "templates" : [
+        "scripts": [
+          "src/+(app|common)/**/*.js",
+          "!src/+(app|common)/**/*.spec.js"
+        ],
+        "templates": [
             "src/app/**/*.tpl.html",
             "src/common/**/*.tpl.html"
         ],
         "sass"   : "src/+(sass|app|common)/**/*",
         "assets" : "src/assets/**",
-        "html"   : "src/index.html"
+        "html"   : "src/index.html",
+        "tests"  : "src/+(app|common)/**/*.spec.js"
     },
 
-    "vendor_files" : {
+    "vendor_files": {
         "js": [
             "vendor/angular/angular.js",
             "vendor/angular-ui-router/release/angular-ui-router.js",
@@ -25,5 +29,7 @@
         "assets": [
             "vendor/bootstrap-sass-official/vendor/assets/fonts/**/*"
         ]
-    }
+    },
+
+    "mocks": "vendor/angular-mocks/angular-mocks.js"
 }

gulpfile.js

@@ -177,11 +177,39 @@ gulp.task('html', ['html:replace'], function () {
 
 
 
+// Karma
+// ============
+var testFiles = [
+    config.build + '/vendor/**/*.js',
+    config.build + '/+(app|common)/**/*.js',
+    config.mocks,
+    config.paths.tests
+];
+
+gulp.task('test:run', ['vendor:assets'] , function() {
+  // Be sure to return the stream
+  return gulp.src(testFiles)
+    .pipe(plugins.karma({
+      configFile: 'karma.conf.js',
+      action: 'run'
+    }));
+});
+
+gulp.task('test:watch', ['vendor:assets'], function() {
+  gulp.src(testFiles)
+    .pipe(plugins.karma({
+      configFile: 'karma.conf.js',
+      action: 'watch'
+    }));
+});
+
+
+
 // Set up Watch
 // ============
 
 // Add files to Watch
-gulp.task('watch', ['styles:sass', 'scripts:lint', 'scripts:html2js', 'assets:img', 'vendor:js', 'vendor:assets', 'html:inject'], function () {
+gulp.task('watch', ['styles:sass', 'scripts:lint', 'scripts:html2js', 'assets:img', 'vendor:js', 'vendor:assets', 'test:watch', 'html:inject'], function () {
     require('./server.js')(server);
 
     // watch for JS changes
@@ -253,7 +281,7 @@ gulp.task('clean', function () {
 // ===============
 
 gulp.task('build', ['clean'], function () {
-    gulp.start('styles:sass', 'scripts:lint', 'scripts:html2js', 'vendor:js', 'vendor:assets', 'assets:img', 'html:inject');
+    gulp.start('styles:sass', 'scripts:lint', 'scripts:html2js', 'vendor:js', 'vendor:assets', 'test:run', 'assets:img', 'html:inject');
 });
 
 gulp.task('compile', ['build'], function () {

karma.conf.js

@@ -0,0 +1,26 @@
+module.exports = function ( karma ) {
+  karma.set({
+    frameworks: [ 'jasmine' ],
+    plugins: [ 'karma-jasmine', 'karma-firefox-launcher', 'karma-chrome-launcher', 'karma-phantomjs-launcher' ],
+    /**
+     * How to report, by default.
+     */
+    reporters: 'dots',
+    /**
+    * The list of browsers to launch to test on. This includes only "Firefox" by
+    * default, but other browser names include:
+    * Chrome, ChromeCanary, Firefox, Opera, Safari, PhantomJS
+    *
+    * Note that you can also use the executable name of the browser, like "chromium"
+    * or "firefox", but that these vary based on your operating system.
+    *
+    * You may also leave this blank and manually navigate your browser to
+    * http://localhost:9018/ when you're running tests. The window/tab can be left
+    * open and the tests will automatically occur there during the build. This has
+    * the aesthetic advantage of not launching a browser every time you save.
+    */
+    browsers: [
+    'Chrome'
+    ]
+  });
+};

package.json

@@ -36,6 +36,17 @@
     "gulp-ruby-sass": "~0.3.0",
     "gulp-size": "~0.1.2",
     "gulp-uglify": "~0.2.0",
-    "gulp-util": "~2.2.14"
+    "gulp-util": "~2.2.14",
+    "karma-script-launcher": "^0.1.0",
+    "karma-chrome-launcher": "^0.1.2",
+    "karma-firefox-launcher": "^0.1.3",
+    "karma-html2js-preprocessor": "^0.1.0",
+    "karma-jasmine": "^0.1.5",
+    "requirejs": "^2.1.11",
+    "karma-requirejs": "^0.2.1",
+    "karma-coffee-preprocessor": "^0.1.3",
+    "karma-phantomjs-launcher": "^0.1.2",
+    "karma": "^0.10.9",
+    "gulp-karma": "0.0.2"
   }
 }

src/app/about/about.spec.js

@@ -0,0 +1,18 @@
+/**
+ * Tests sit right alongside the file they are testing, which is more intuitive
+ * and portable than separating `src` and `test` directories. Additionally, the
+ * build process will exclude all `.spec.js` files from the build
+ * automatically.
+ */
+describe( 'home module', function() {
+  beforeEach( module( 'ngDevstack' ) );
+  beforeEach( module( 'ngDevstack.about' ) );
+  beforeEach(inject(function($rootScope, $controller) {
+    $controller('AboutCtrl', {$scope: $rootScope.$new()});
+  }));
+
+  it( 'should load', inject( function() {
+    expect( true ).toBeTruthy();
+  }));
+});
+

src/app/app.spec.js

@@ -0,0 +1,18 @@
+describe( 'AppCtrl', function() {
+  describe( 'isCurrentUrl', function() {
+    var AppCtrl, $location, $scope;
+
+    beforeEach( module( 'ngDevstack' ) );
+
+    beforeEach( inject( function( $controller, _$location_, $rootScope ) {
+      $location = _$location_;
+      $scope = $rootScope.$new();
+      AppCtrl = $controller( 'AppCtrl', { $location: $location, $scope: $scope });
+    }));
+
+    it( 'should pass a dummy test', inject( function() {
+      expect( AppCtrl ).toBeTruthy();
+    }));
+  });
+});
+

src/app/home/home.spec.js

@@ -0,0 +1,17 @@
+/**
+ * Tests sit right alongside the file they are testing, which is more intuitive
+ * and portable than separating `src` and `test` directories. Additionally, the
+ * build process will exclude all `.spec.js` files from the build
+ * automatically.
+ */
+describe( 'home module', function() {
+  beforeEach( module( 'ngDevstack' ) );
+  beforeEach( module( 'ngDevstack.home' ) );
+  beforeEach(inject(function($rootScope, $controller) {
+    $controller('HomeCtrl', {$scope: $rootScope.$new()});
+  }));
+
+  it( 'should load', inject( function() {
+    expect( true ).toBeTruthy();
+  }));
+});