feat(test generated projets): setup unit testing structure powered by Karma

Closes #10

Author: cironunes

addon/ng2/blueprints/ng2/files/karma.conf.js

@@ -0,0 +1,73 @@
+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: ['jasmine'],
+
+    // list of files / patterns to load in the browser
+    files: [
+      'spec.bundle.js'
+    ],
+
+    // list of files to exclude
+    exclude: [
+    ],
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      'spec.bundle.js': ['webpack', 'sourcemap']
+    },
+
+    webpack: {
+      resolve: {
+        root: __dirname,
+        extensions: ['','.ts','.js','.json']
+      },
+      devtool: 'inline-source-map',
+      module: {
+        loaders: [
+          { test: /\.ts$/,   loader: 'typescript-simple?ignoreWarnings[]=2304', exclude: [
+            /web_modules/,
+            /node_modules/
+          ]
+          },
+          { test: /\.json$/, loader: 'json' },
+          { test: /\.html$/, loader: 'raw' },
+          { test: /\.css$/,  loader: 'raw' }
+        ]
+      },
+      stats: { colors: true, reasons: true },
+      debug: false
+    },
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['progress'],
+
+    // 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: false,
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['ChromeCanary'],
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: true
+  })
+};

addon/ng2/blueprints/ng2/files/package.json

@@ -4,6 +4,25 @@
   "license": "MIT",
   "devDependencies": {
     "angular-cli": "0.0.*",
-    "ember-cli-inject-live-reload": "^1.3.0"
+    "angular2": "^2.0.0-alpha.34",
+    "ember-cli-inject-live-reload": "^1.3.0",
+    "jasmine-core": "^2.3.4",
+    "karma": "^0.13.9",
+    "karma-chrome-launcher": "^0.2.0",
+    "karma-jasmine": "^0.3.6",
+    "karma-sourcemap-loader": "^0.3.5",
+    "karma-webpack": "^1.7.0",
+    "reflect-metadata": "^0.1.0",
+    "typescript": "^1.5.3",
+    "typescript-simple-loader": "^0.3.4",
+    "webpack": "^1.11.0",
+    "css-loader": "^0.16.0",
+    "exports-loader": "^0.6.2",
+    "expose-loader": "^0.7.0",
+    "file-loader": "^0.8.4",
+    "json-loader": "^0.5.2",
+    "raw-loader": "^0.5.1",
+    "style-loader": "^0.12.3",
+    "url-loader": "^0.5.6"
   }
 }

addon/ng2/blueprints/ng2/files/spec.bundle.js

@@ -0,0 +1,30 @@
+// @AngularClass
+/*
+ * When testing with webpack and ES6, we have to do some extra
+ * things get testing to work right. Because we are gonna write test
+ * in ES6 to, we have to compile those as well. That's handled in
+ * karma.conf.js with the karma-webpack plugin. This is the entry
+ * file for webpack test. Just like webpack will create a bundle.js
+ * file for our client, when we run test, it well compile and bundle them
+ * all here! Crazy huh. So we need to do some setup
+ */
+Error.stackTraceLimit = Infinity;
+require('reflect-metadata');
+require('angular2/test');
+require('angular2/mock');
+
+/*
+ Ok, this is kinda crazy. We can use the the context method on
+ require that webpack created in order to tell webpack
+ what files we actually want to require or import.
+ Below, context will be an function/object with file names as keys.
+ using that regex we are saying look in client/app and find
+ any file that ends with spec.js and get its path. By passing in true
+ we say do this recursively
+ */
+var appContext = require.context('./src', true, /\.spec\.ts/);
+
+// get all the files, for each file, call the context function
+// that will require the file and load it up here. Context will
+// loop and require those spec files here
+appContext.keys().forEach(appContext);

addon/ng2/blueprints/ng2/files/src/__name__.html

@@ -1,3 +1,4 @@
+<h1>Hello {{ name }}!</h1>
 <p>
     <%= htmlComponentName %> Works!
 </p>

addon/ng2/blueprints/ng2/files/src/__name__.spec.ts

@@ -0,0 +1,14 @@
+/// <reference path="./typings/jasmine/jasmine.d.ts"/>
+import {<%= jsComponentName %>App} from './<%= htmlComponentName %>';
+
+describe('Component: <%= jsComponentName %>', () => {
+    let app;
+
+    beforeEach(() => {
+        app = new <%= jsComponentName %>App();
+    });
+
+    it('should have a name', () => {
+        expect(app.name).toBe('World');
+    });
+});

addon/ng2/blueprints/ng2/files/src/__name__.ts

@@ -8,9 +8,11 @@ import {Component, View, bootstrap} from 'angular2/angular2';
     templateUrl: '<%= htmlComponentName %>.html',
     directives: []
 })
-class <%= jsComponentName %>App {
-    constructor() {
+export class <%= jsComponentName %>App {
+    name: string;
 
+    constructor() {
+        this.name = 'World';
     }
 }
 bootstrap(<%= jsComponentName %>App);