diff --git a/src/generators/app/index.js b/src/generators/app/index.js
index 81f695546..6b54cd535 100644
--- a/src/generators/app/index.js
+++ b/src/generators/app/index.js
@@ -542,6 +542,14 @@ export class Generator extends Base {
         // Convert HTML into Pug
         if(this.filters.pug) {
           let pugFilter = filter(['**/*.html', '!client/_index.html'], {restore: true});
+
+          function pugReplacer(contents) {
+            return contents
+              .replace('ngif', 'ngIf')
+              .replace('ngfor', 'ngFor')
+              .replace('ngmodel', 'ngModel');
+          }
+
           this.registerTransformStream([
             pugFilter,
             html2jade({
@@ -552,6 +560,11 @@ export class Generator extends Base {
             rename(path => {
               path.extname = '.pug';
             }),
+            tap(function(file, t) {
+              var contents = file.contents.toString();
+              contents = pugReplacer(contents);
+              file.contents = new Buffer(contents);
+            }),
             pugFilter.restore
           ]);
         }
diff --git a/src/test/get-expected-files.js b/src/test/get-expected-files.js
index 9940d5830..edbbf0a0d 100644
--- a/src/test/get-expected-files.js
+++ b/src/test/get-expected-files.js
@@ -212,6 +212,7 @@ export function app(options) {
   /* WebSockets */
   if (options.ws) {
     files = files.concat([
+      'client/components/socket/primus.mock.' + script,
       'client/components/socket/socket.service.' + script,
       'client/components/socket/socket.mock.' + script,
       'server/api/thing/thing.socket.js',
diff --git a/src/test/main.test.js b/src/test/main.test.js
index d688b2e17..d4d29a6f1 100644
--- a/src/test/main.test.js
+++ b/src/test/main.test.js
@@ -255,7 +255,7 @@ describe('angular-fullstack:app', function() {
     }
   });
 
-  describe('with sequelize models, auth', function() {
+  describe.only('with sequelize models, auth', function() {
     var dir;
     var lintResult;
     var clientTestResult;
diff --git a/templates/app/_package.json b/templates/app/_package.json
index b15db0a8d..882072504 100644
--- a/templates/app/_package.json
+++ b/templates/app/_package.json
@@ -214,6 +214,7 @@
   },
   "scripts": {
     "test": "gulp test",
+    "test:client": "karma start ./karma.conf.js --single-run",
     <%_ if(filters.flow) { -%>
     "flow": "flow",
     <%_ } -%>
diff --git a/templates/app/client/app/main/main.component.js b/templates/app/client/app/main/main.component.js
index 1944616f9..1bc692373 100644
--- a/templates/app/client/app/main/main.component.js
+++ b/templates/app/client/app/main/main.component.js
@@ -24,11 +24,9 @@ export class MainComponent implements OnInit<% if(filters.ws) { %>, OnDestroy<%
   }
 
   ngOnInit() {
-    this.Http.get('/api/things')
-      .map(res => {
-        return res.json();
-      })
-      .catch(err => Observable.throw(err.json().error || 'Server error'))
+    return this.Http.get('/api/things')
+      .map(res => res.json())
+      // .catch(err => Observable.throw(err.json().error || 'Server error'))
       .subscribe(things => {
         this.awesomeThings = things;
         <%_ if(filters.ws) { -%>
diff --git a/templates/app/client/app/main/main.component.spec.js b/templates/app/client/app/main/main.component.spec.js
index b4db508a3..5af50bf0c 100644
--- a/templates/app/client/app/main/main.component.spec.js
+++ b/templates/app/client/app/main/main.component.spec.js
@@ -1,8 +1,75 @@
 'use strict';
-
-// import main from './main.component';
-// import {MainController} from './main.component';
+import {
+  async,
+  ComponentFixture,
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+import {
+  BaseRequestOptions,
+  ConnectionBackend,
+  Http,
+  HttpModule,
+  Response,
+  ResponseOptions,
+} from '@angular/http';
+import { MockBackend } from '@angular/http/testing';
+<%_ if(filters.mocha && filters.expect) { -%>
+import { expect } from 'chai';<% } %><% if(filters.uibootstrap) { %>
+import { TooltipModule } from 'ngx-bootstrap';<% } %>
+import { FormsModule } from '@angular/forms';
+import { SocketService } from '../../components/socket/socket.service';
+import { SocketServiceStub } from '../../components/socket/socket.mock';
+import { MainComponent } from './main.component';
 
 describe('Component: MainComponent', function() {
-  it('should attach a list of things to the controller', function() {});
+  let comp: MainComponent;
+  let fixture: ComponentFixture<MainComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        FormsModule,<% if(filters.uibootstrap) { %>
+        TooltipModule.forRoot(),<% } %>
+        HttpModule,
+      ],
+      declarations: [ MainComponent ], // declare the test component
+      providers: [
+        BaseRequestOptions,
+        MockBackend,
+        {
+          provide: Http,
+          useFactory: (backend: ConnectionBackend, defaultOptions: BaseRequestOptions) => {
+            return new Http(backend, defaultOptions);
+          },<%_ if(filters.ws) { %>
+          deps: [MockBackend, BaseRequestOptions]<% } %>
+        },
+        { provide: SocketService, useClass: SocketServiceStub },
+      ],
+    }).compileComponents();
+  }));
+  <%_ if(filters.ws) { %>
+  beforeEach(async(inject([MockBackend], (mockBackend) => {
+    mockBackend.connections.subscribe(conn => {
+      conn.mockRespond(new Response(new ResponseOptions({
+        body: JSON.stringify(['HTML5 Boilerplate', 'AngularJS', 'Karma', 'Express'])
+      })));
+    });
+  })));<% } %>
+
+  beforeEach(async(() => {
+    fixture = TestBed.createComponent(MainComponent);
+    // MainComponent test instance
+    comp = fixture.componentInstance;
+
+    /**
+     * Trigger initial data binding.
+     */
+    fixture.detectChanges();
+  }));
+
+  it('should attach a list of things to the controller', () => {<% if(filters.jasmine) { %>
+    expect(comp.awesomeThings.length).toEqual(4);<% } else if(filters.mocha) { -%>
+    <%= expect() %>comp.awesomeThings.length<%= to() %>.equal(4);<% } %>
+  });
 });
diff --git a/templates/app/client/components/oauth-buttons(oauth)/oauth-buttons.component.spec.js b/templates/app/client/components/oauth-buttons(oauth)/oauth-buttons.component.spec.js
index 0b05bd987..2661b74bf 100644
--- a/templates/app/client/components/oauth-buttons(oauth)/oauth-buttons.component.spec.js
+++ b/templates/app/client/components/oauth-buttons(oauth)/oauth-buttons.component.spec.js
@@ -2,7 +2,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { DebugElement } from '@angular/core';
-<%_ if(filters.expect) { -%>
+<%_ if(filters.mocha && filters.expect) { -%>
 import { expect } from 'chai';<% } %>
 
 import { OauthButtonsComponent } from './oauth-buttons.component';
diff --git a/templates/app/client/components/socket(ws)/primus.mock.js b/templates/app/client/components/socket(ws)/primus.mock.js
new file mode 100644
index 000000000..de7ab5006
--- /dev/null
+++ b/templates/app/client/components/socket(ws)/primus.mock.js
@@ -0,0 +1 @@
+export default class Primus {}
diff --git a/templates/app/client/components/socket(ws)/socket.mock.js b/templates/app/client/components/socket(ws)/socket.mock.js
index eb7ff0125..7b5921e1a 100644
--- a/templates/app/client/components/socket(ws)/socket.mock.js
+++ b/templates/app/client/components/socket(ws)/socket.mock.js
@@ -1,13 +1,7 @@
 'use strict';
-import { noop } from 'lodash-es';
 
-export class SocketServiceMock {
-    socket = {
-        connect: noop,
-        on: noop,
-        emit: noop,
-        receive: noop
-    };
-    syncUpdates = noop;
-    unsyncUpdates = noop;
+export class SocketServiceStub {
+  constructor() {}
+  syncUpdates() {}
+  unsyncUpdates() {}
 }
diff --git a/templates/app/client/components/socket(ws)/socket.service.js b/templates/app/client/components/socket(ws)/socket.service.js
index ccd8a7ee9..fcb71e68c 100644
--- a/templates/app/client/components/socket(ws)/socket.service.js
+++ b/templates/app/client/components/socket(ws)/socket.service.js
@@ -1,5 +1,5 @@
 'use strict';
-import Primus from './primus';
+import Primus from 'primus';
 import primusEmit from 'primus-emit';
 import { Injectable } from '@angular/core';
 import { noop, find, remove } from 'lodash';
diff --git a/templates/app/client/components/util.spec.js b/templates/app/client/components/util.spec.js
index e99851e5c..ca938aa23 100644
--- a/templates/app/client/components/util.spec.js
+++ b/templates/app/client/components/util.spec.js
@@ -1,5 +1,5 @@
 import { safeCb } from './util';
-<%_ if(filters.expect) { -%>
+<%_ if(filters.mocha && filters.expect) { -%>
 import { expect } from 'chai';<% } %>
 
 describe('Util', () => {
diff --git a/templates/app/karma.conf.js b/templates/app/karma.conf.js
index 812e588b2..bda49111c 100644
--- a/templates/app/karma.conf.js
+++ b/templates/app/karma.conf.js
@@ -2,7 +2,7 @@
 // http://karma-runner.github.io/0.13/config/configuration-file.html
 /*eslint-env node*/
 
-import makeWebpackConfig from './webpack.make';
+const makeWebpackConfig = require('./webpack.make');
 
 module.exports = function(config) {
   config.set({
diff --git a/templates/app/spec.js b/templates/app/spec.js
index 0cf207a88..e85239a70 100644
--- a/templates/app/spec.js
+++ b/templates/app/spec.js
@@ -5,20 +5,18 @@ import 'babel-polyfill';
 import 'zone.js/dist/zone';
 import 'zone.js/dist/long-stack-trace-zone';
 import 'zone.js/dist/proxy';
-import 'zone.js/dist/sync-test';
-<%_ if (filters.jasmine) { -%>
-import 'zone.js/dist/jasmine-patch';
-<%_ } -%>
+import 'zone.js/dist/sync-test';<%_ if (filters.jasmine) { %>
+import 'zone.js/dist/jasmine-patch';<% } %><%_ if (filters.mocha) { %>
+import 'zone.js/dist/mocha-patch';<% } %>
 import 'zone.js/dist/async-test';
 import 'zone.js/dist/fake-async-test';
 
 var testsContext = require.context('./client', true, /\.(spec|test)\.<%= scriptExt %>$/);
 // testsContext.keys().forEach(testsContext);
-// testsContext('./app/main/main.component.spec.<%= scriptExt %>');
+testsContext('./app/main/main.component.spec.<%= scriptExt %>');
 testsContext('./components/util.spec.<%= scriptExt %>');
-<%_ if(filters.oauth) { -%>
-testsContext('./components/oauth-buttons/oauth-buttons.component.spec.<%= scriptExt %>');
-<%_ } -%>
+<% if(filters.oauth) { -%>
+testsContext('./components/oauth-buttons/oauth-buttons.component.spec.<%= scriptExt %>');<% } %>
 
 import { TestBed, getTestBed } from '@angular/core/testing';
 import {
@@ -28,12 +26,3 @@ import {
 
 TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
 
-<%_ if (filters.mocha) { -%>
-var hook = new Mocha.Hook('Modified Angular beforeEach Hook', function() {
-  getTestBed().resetTestingModule();
-});
-
-hook.ctx = mocha.suite.ctx;
-hook.parent = mocha.suite;
-mocha.suite._beforeEach = [hook];
-<%_ } -%>
diff --git a/templates/app/tsconfig(ts).json b/templates/app/tsconfig(ts).json
index 53a1571cf..5cf8d0979 100644
--- a/templates/app/tsconfig(ts).json
+++ b/templates/app/tsconfig(ts).json
@@ -2,11 +2,15 @@
   "compilerOptions": {
     "allowJs": true,
     "allowSyntheticDefaultImports": true,
+    "baseUrl": ".",
     "experimentalDecorators": true,
     "sourceMap": true,
     "rootDir": "./",
     "module": "es6",
-    "outDir": ".tmp",
+    "outDir": ".tmp",<% if(filters.ws) { %>
+    "paths": {
+      "primus": ["client/components/socket/primus.js"]
+    },<% } %>
     "removeComments": false,
     "target": "es5",
     "skipLibCheck": true,
diff --git a/templates/app/webpack.make.js b/templates/app/webpack.make.js
index e87d98c06..ef7eb7fe5 100644
--- a/templates/app/webpack.make.js
+++ b/templates/app/webpack.make.js
@@ -70,18 +70,24 @@ module.exports = function makeWebpackConfig(options) {
         };
     }
 
-    <%_ if(filters.ts) { _%>
     config.resolve = {
         modules: ['node_modules'],
-        extensions: ['.js', '.ts']
-    };<% } %>
+        extensions: ['.js', '.ts'],
+        alias: {
+            primus: path.resolve(__dirname, 'client/components/socket/primus.js'),
+        }
+    };
 
     if(TEST) {
         config.resolve = {
             modules: [
                 'node_modules'
             ],
-            extensions: ['.js', '.ts']
+            extensions: ['.js', '.ts'],
+            alias: {
+                // for some reason the primus client and webpack don't get along in test
+                primus: path.resolve(__dirname, 'client/components/socket/primus.mock.<%= scriptExt %>'),
+            }
         };
     }