Changed watch task according to feedback

build/global.d.ts

@@ -35,4 +35,6 @@ interface ICommandLineArgs {
   verbose?: boolean;
   version?: number;
   dev?: boolean;
+  watch?: boolean;
+  serve?: boolean;
 }

build/gulp/BaseGulpTask.ts

@@ -23,4 +23,9 @@ export class BaseGulpTask {
    */
   public static options: any = {};
 
+  /**
+   * @property  {string}  helpMargin   - whitespaces for nicely displaying help in the console
+   */
+  public static helpMargin: string = '\r\n                      ';
+
 }

build/gulp/tasks/build-lib.ts

@@ -24,7 +24,7 @@ export class GulpTask extends BaseGulpTask {
   /**
    * @property  {string[]}  dependencies  - Array of all tasks that should be run before this one.
    */
-  public static dependencies: string[] = ['test'];
+  public static dependencies: string[] = [];
 
   /**
    * @property  {string[]}  aliases   - Different options to run the task.
@@ -35,7 +35,8 @@ export class GulpTask extends BaseGulpTask {
    * @property  {Object}  options   - Any command line flags that can be passed to the task.
    */
   public static options: any = {
-    'dev': 'Create unminified version of the library with source maps & comments (otherwise, production bundle created)',
+    'dev':     'Create unminified version of the library with source maps & comments (otherwise, production' + GulpTask.helpMargin +
+               'bundle created)',
     'verbose': 'Output all TypeScript files being compiled & JavaScript files included in the external library',
     'version': 'Version number to set build library (if omitted, version from package.json is used)'
   };

build/gulp/tasks/clean-build.ts

@@ -9,7 +9,7 @@ let $: any = require('gulp-load-plugins')({ lazy: true });
 
 /**
  * Removes all generated JavaScript from TypeScript used in the build as the gulp task 'clean-build-ts'.
- * 
+ *
  * @class
  */
 export class GulpTask extends BaseGulpTask {

build/gulp/tasks/clean-lib.ts

@@ -9,7 +9,7 @@ let $: any = require('gulp-load-plugins')({ lazy: true });
 
 /**
  * Removes all generated JavaScript from TypeScript used in the app as the gulp task 'clean-lib-ts'.
- * 
+ *
  * @class
  */
 export class GulpTask extends BaseGulpTask {

build/gulp/tasks/clean.ts

@@ -5,7 +5,7 @@ import {Utils} from '../utils';
 
 /**
  * Removes all transpiled TypeScript files as the gulp task 'clean'.
- * 
+ *
  * @class
  */
 export class GulpTask extends BaseGulpTask {

build/gulp/tasks/live-dev.ts

@@ -0,0 +1,195 @@
+'use strict';
+
+import {BaseGulpTask} from '../BaseGulpTask';
+import {Utils} from '../utils';
+import * as gulp from 'gulp';
+import * as path from 'path';
+import * as yargs from 'yargs';
+import * as karma from 'karma';
+import * as runSequence from 'run-sequence';
+import * as browserSyncModule from 'browser-sync';
+import * as fs from 'fs';
+
+/**
+ * Watches for file change and automatically run vet, test, transpile, build.
+ *
+ * @class
+ */
+export class GulpTask extends BaseGulpTask {
+
+  /**
+   * @property  {string}  description   - Help description for the task.
+   */
+  public static description: string = 'Watches for changes in source files and automatically runs vet, build, test' + GulpTask.helpMargin;
+
+  /**
+   * @property  {string[]}  dependencies  - Array of all tasks that should be run before this one.
+   */
+  public static dependencies: string[] = ['validate-build'];
+
+  /**
+   * @property  {string[]}  aliases   - Different options to run the task.
+   */
+  public static aliases: string[] = ['ld', 'LD'];
+
+  /**
+   * @property  {Object}  options   - Any command line flags that can be passed to the task.
+   */
+  public static options: any = {
+    'debug':   'Affects \'test\' task, sets karma log level to DEBUG',
+    'dev':     'Affects \'build-lib\' task, creates unminified version of the library with source maps & comments ' + GulpTask.helpMargin +
+               '(otherwise, production bundle created)',
+    'serve':   'Automatically reloads connected browsers when sources for demo changed. Starts static server at' + GulpTask.helpMargin +
+               'http://localhost:3000/. To connect browser you need to explicitly open your demo with url,'  + GulpTask.helpMargin +
+               'such as http://localhost:3000/src/components/icon/demo/index.html',
+    'specs':   'Affects \'test\' task, outputs all tests being run',
+    'verbose': 'Affects \'test\' and \'build-lib\' tasks, outputs all TypeScript files being compiled & JavaScript ' + GulpTask.helpMargin +
+               'files included in the external library, set karma log level to INFO',
+    'version': 'Affects \'build-lib\' task, version number to set build library (if omitted, version from ' + GulpTask.helpMargin +
+               'package.json is used)'
+  };
+
+  /**
+   * @property  {ICommandLineArgs}  args  - Command line arguments;
+   */
+  private _args: ICommandLineArgs = yargs.argv;
+
+  /**
+   * @property {Object} browserSync   - If 'serve' option is provied, contains reference to browerSync object
+   */
+  private browserSync: browserSyncModule.BrowserSyncInstance;
+
+  /** @constructor */
+  constructor() {
+    super();
+
+    Utils.log('Watching for files changes....');
+
+    let eventSeparator: string = '---------------- *** ----------------------';
+
+    let logEvent: (event: gulp.WatchEvent, eventName: string) => void = (event: gulp.WatchEvent, eventName: string) => {
+      let fileName: string = path.basename(event.path);
+      Utils.log(eventSeparator);
+      Utils.log(`${eventName}`);
+      Utils.log(eventSeparator);
+      Utils.log(`Triggered by: '${fileName}'`);
+    };
+
+    let subscribeWatcher: (watcher: NodeJS.EventEmitter, eventName: string) => void = (watcher: NodeJS.EventEmitter, eventName: string) => {
+      watcher.on('change', (event: gulp.WatchEvent) => {
+        logEvent(event, eventName);
+      });
+    };
+
+    let modeName: string = 'DEV';
+    if (!this._args.dev) {
+      modeName = 'RELEASE';
+    }
+
+    let buildLibEventName: string = `Build and test library in ${modeName} mode`;
+
+    let reloadBrowsers: () => void = () => {
+      if (this._args.serve) {
+            this.browserSync.reload();
+          }
+    };
+
+    if (this._args.serve) {
+          this.browserSync = browserSyncModule.create();
+          this.browserSync.init({
+              server: {
+                  baseDir: './'
+              }
+          });
+
+          gulp.watch(['./dist/*.js', './src/**/demo*/*.*', '!./src/**/demo*/*.ts'], (event: gulp.WatchEvent) => {
+            let filePath: path.ParsedPath = path.parse(event.path);
+
+            /* skip reloading for files which are changed by typescript transpilation
+               they are reloading by other task */
+            if (filePath.ext === '.js') {
+              let tsFile: string = event.path.replace('.js', '.ts');
+              fs.stat(tsFile, (err: NodeJS.ErrnoException, stats: fs.Stats) => {
+              /* corresponding .ts not found -->> reload */
+              if (err) {
+                this.browserSync.reload();
+                return;
+              }
+              /* .ts found -->> do nothing, at this point browsers should be reloaded by the `Transpile demo files` */
+            });
+
+            } else {
+              this.browserSync.reload();
+            }
+          });
+      }
+
+    subscribeWatcher(
+      gulp.watch(['./build/**/*.ts', './gulpfile.ts', './config/**/*.ts'], ['transpile-ts']), 'Transpile build files');
+
+    subscribeWatcher(
+      gulp.watch(['./src/**/demo*/*.ts'], () => {
+        runSequence('transpile-ts', reloadBrowsers);
+      }),
+      'Transpile demo files');
+
+
+    subscribeWatcher(
+      gulp.watch(['./src/**/*.ts', '!./src/**/demo*/*.ts'], (event: gulp.WatchEvent) => {
+
+      let currentPath: path.ParsedPath = path.parse(event.path);
+      let allExceptSpecs: string = path.join(currentPath.dir, '!(*.spec).js');
+      let allSpecs: string = path.join(currentPath.dir, '*.spec.js');
+      let pathParts: string[] = currentPath.dir.split(path.sep);
+      let dirName: string = pathParts[pathParts.length - 1] || pathParts[pathParts.length - 2];
+
+      runSequence('transpile-ts', 'build-lib', () => {
+
+        Utils.log('Starting Karma server');
+        Utils.log(`Using specs under src/components/${dirName}/`);
+
+        let karmaConfig: karma.ConfigOptions = <karma.ConfigOptions>{
+          configFile: '../../../config/karma.js',
+          singleRun: true
+        };
+
+        // if in spec mode, change reporters from progress => spec
+        if (this._args.specs) {
+          karmaConfig.reporters = ['spec', 'coverage'];
+        }
+
+        // set log level accordingly
+        if (this._args.debug) {
+          karmaConfig.logLevel = 'DEBUG';
+        } else if (this._args.verbose) {
+          karmaConfig.logLevel = 'INFO';
+        }
+
+        karmaConfig.files = [
+          'node_modules/angular/angular.js',
+          'node_modules/angular-mocks/angular-mocks.js',
+          'node_modules/jquery/dist/jquery.min.js',
+          'node_modules/jasmine-jquery/lib/jasmine-jquery.js',
+          'src/core/jquery.phantomjs.fix.js',
+          'src/core/*.js',
+          allExceptSpecs,
+          allSpecs
+        ];
+
+        let karmaServer: karma.Server = new karma.Server(karmaConfig, (karmaResult: number) => {
+          Utils.log('Karma test run completed');
+
+          // result = 1 means karma exited with error
+          if (karmaResult === 1) {
+            Utils.log('Karma finished with error(s)');
+          }
+        });
+
+        karmaServer.start();
+      });
+
+    }),
+      buildLibEventName);
+
+  }
+}

build/gulp/tasks/test.ts

@@ -4,10 +4,11 @@ import {BaseGulpTask} from '../BaseGulpTask';
 import {Utils} from '../utils';
 import * as yargs from 'yargs';
 import * as karma from 'karma';
+import * as gulp from 'gulp';
 
 /**
  * Runs all tests against the directives.
- * 
+ *
  * @class
  */
 export class GulpTask extends BaseGulpTask {
@@ -20,7 +21,7 @@ export class GulpTask extends BaseGulpTask {
   /**
    * @property  {string[]}  dependencies  - Array of all tasks that should be run before this one.
    */
-  public static dependencies: string[] = ['transpile-ts'];
+  public static dependencies: string[] = [];
 
   /**
    * @property  {string[]}  aliases   - Different options to run the task.
@@ -31,9 +32,10 @@ export class GulpTask extends BaseGulpTask {
    * @property  {Object}  options   - Any command line flags that can be passed to the task.
    */
   public static options: any = {
-    'debug': 'Set karma log level to DEBUG',
-    'specs': 'Output all tests being run',
-    'verbose': 'Output all TypeScript files being built & set karma log level to INFO'
+    'debug':   'Set karma log level to DEBUG',
+    'specs':   'Output all tests being run',
+    'verbose': 'Output all TypeScript files being built & set karma log level to INFO',
+    'watch':   'Adds Chrome browser and start listening on file changes for easier debugging'
   };
 
   /**
@@ -42,7 +44,7 @@ export class GulpTask extends BaseGulpTask {
   private _args: ICommandLineArgs = yargs.argv;
 
   /** @constructor */
-  constructor(done: IStringCallback) {
+  constructor(done: gulp.TaskCallback) {
     super();
     Utils.log('Testing code with Karma');
 
@@ -64,17 +66,22 @@ export class GulpTask extends BaseGulpTask {
       karmaConfig.logLevel = 'INFO';
     }
 
+    if (this._args.watch) {
+      karmaConfig.singleRun = false;
+      karmaConfig.browsers = ['Chrome', 'PhantomJS'];
+    }
+
     // create karma server
     let karmaServer: karma.Server = new karma.Server(karmaConfig, (karmaResult: number) => {
       Utils.log('Karma test run completed');
 
       // result = 1 means karma exited with error
       if (karmaResult === 1) {
-        done('Karma returned error code ' + karmaResult + ' because at least one test failed.'
-          + '\nThe following stack trace is expected when tests fail.');
-      } else {
-        done();
+        Utils.log('Karma finished with error(s)');
       }
+
+      done();
+
     });
     karmaServer.start();
   }

build/gulp/tasks/transpile-ts.ts

@@ -50,6 +50,7 @@ export class GulpTask extends BaseGulpTask {
 
     // compile all TypeScript files, including sourcemaps inline in the generated JavaScript
     let result: any = tsProject.src()
+      .pipe($.plumber())
       .pipe($.if(this._args.verbose, $.print()))
       .pipe($.sourcemaps.init())
       .pipe($.typescript(tsProject));
@@ -58,5 +59,4 @@ export class GulpTask extends BaseGulpTask {
       .pipe($.sourcemaps.write())
       .pipe(gulp.dest(''));
   }
-
 }

build/gulp/tasks/validate-build.ts

@@ -0,0 +1,50 @@
+'use strict';
+
+import {BaseGulpTask} from '../BaseGulpTask';
+import * as gulp from 'gulp';
+import * as runSequence from 'run-sequence';
+
+/**
+ * Watches for file change and automatically run vet, test, transpile, build.
+ *
+ * @class
+ */
+export class GulpTask extends BaseGulpTask {
+
+  /**
+   * @property  {string}  description   - Help description for the task.
+   */
+  public static description: string = 'Validates the build runs \'vet\', \'transpile-ts\', \'build-lib\' and \'test\' in a sequence'
+                                      + GulpTask.helpMargin;
+
+  /**
+   * @property  {string[]}  dependencies  - Array of all tasks that should be run before this one.
+   */
+  public static dependencies: string[] = [];
+
+  /**
+   * @property  {string[]}  aliases   - Different options to run the task.
+   */
+  public static aliases: string[] = ['vb', 'VB'];
+
+  /**
+   * @property  {Object}  options   - Any command line flags that can be passed to the task.
+   */
+  public static options: any = {
+    'debug':   'Affects \'test\' task, sets karma log level to DEBUG',
+    'dev':     'Create unminified version of the library with source maps & comments (otherwise, production' + GulpTask.helpMargin +
+               'bundle created)',
+    'specs':   'Affects \'test\' task, outputs all tests being run',
+    'verbose': 'Affects \'test\' and \'build-lib\' tasks, outputs all TypeScript files being compiled & JavaScript ' + GulpTask.helpMargin +
+               'files included in the external library, set karma log level to INFO',
+    'version': 'Affects \'build-lib\' task, version number to set build library (if omitted, version from' + GulpTask.helpMargin +
+               'package.json is used)'
+  };
+
+  /** @constructor */
+  constructor(cb: gulp.TaskCallback) {
+    super();
+
+    runSequence('transpile-ts', 'build-lib', 'test', cb);
+  }
+}