diff --git a/README.md b/README.md
index 51df08b..7fe240e 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,22 @@
 WebApps 3: Project
 =
 
-Drawing webapplication
+Drawing Web Application
 -
 
+This Application was developed for my college class "WebApps III".
+
+Features:
+-
+* Draw together with others
+* Save your drawings
+* Authentication (& sessions)
+* Custom colors
+* Custom brush size
+* Clear the Canvas
+* Home Page showing several saved drawings
+* More to come...
+
+
 ##### By:
 Thomas Buys, 3D
\ No newline at end of file
diff --git a/client/app/auth/auth.config.js b/client/app/auth/auth.config.js
index a648710..4de2316 100644
--- a/client/app/auth/auth.config.js
+++ b/client/app/auth/auth.config.js
@@ -1,5 +1,4 @@
 function AuthConfig($stateProvider, $httpProvider) {
-  'ngInject';
 
   // Define the routes
   $stateProvider
@@ -29,5 +28,6 @@ function AuthConfig($stateProvider, $httpProvider) {
   });
 
 };
+AuthConfig.$inject = ["$stateProvider", "$httpProvider"]; //Explicit annotation needed!
 
 export default AuthConfig;
\ No newline at end of file
diff --git a/client/app/canvas/canvas.config.js b/client/app/canvas/canvas.config.js
index 61a427b..06f9d96 100644
--- a/client/app/canvas/canvas.config.js
+++ b/client/app/canvas/canvas.config.js
@@ -1,5 +1,4 @@
 function CanvasConfig($stateProvider) {
-  'ngInject';
 
   $stateProvider
   .state('app.canvas', {
@@ -15,5 +14,6 @@ function CanvasConfig($stateProvider) {
   });
 
 };
+CanvasConfig.$inject = ["$stateProvider"]; //Explicit annotation needed!
 
 export default CanvasConfig;
diff --git a/client/app/canvas/canvas.controller.js b/client/app/canvas/canvas.controller.js
index a2384d1..f995483 100644
--- a/client/app/canvas/canvas.controller.js
+++ b/client/app/canvas/canvas.controller.js
@@ -51,7 +51,7 @@ class CanvasCtrl {
 		this.App.canvas.onselectstart = () => {
 			return false;
 		};
-		this.App.ctx.fillStyle = 'solid';
+		this.App.ctx.fillStyle = '#000000';
 		this.App.ctx.strokeStyle = '#000000';
 		this.App.ctx.lineWidth = 5;
 		this.App.ctx.lineCap = 'round';
diff --git a/client/app/canvas/canvas.spec.js b/client/app/canvas/canvas.spec.js
new file mode 100644
index 0000000..fa5bf97
--- /dev/null
+++ b/client/app/canvas/canvas.spec.js
@@ -0,0 +1,51 @@
+describe("Canvas Controller Test", () => {
+    describe("When I call canvas.init", () => {
+
+        beforeEach(angular.mock.module('app'));
+		
+		let scope;
+		let vm;
+	  
+		beforeEach(inject(($controller, _$rootScope_) => {
+			scope = _$rootScope_.$new();
+			vm = $controller('CanvasCtrl', { $scope: scope });
+		}));
+
+        it('sets the brush size to 5', () => {
+			const size = 5;
+			expect(vm.App.ctx.lineWidth).toEqual(size);
+            expect(vm.ownBrushSize).toEqual(size);
+        });
+		
+		it('sets the fillStyle to solid', () => {
+			const lineCap = "round";
+            expect(vm.App.ctx.lineCap).toEqual(lineCap);
+        });
+		
+		it('changes brush size correctly when method is called', () => {
+			const initialSize = 5;
+			const newSize = 85;
+			expect(vm.App.ctx.lineWidth).toEqual(initialSize);
+			expect(vm.ownBrushSize).toEqual(initialSize);
+			vm.App.changeBrushSize(85);
+            expect(vm.App.ctx.lineWidth).toEqual(newSize);
+			expect(vm.ownBrushSize).toEqual(newSize);
+        });
+		
+		it('sets the alert boolean to false initially', () => {
+			const bool = false;
+			expect(scope.showAlert).toEqual(bool);
+        });
+		
+		it('changes brush color correctly when method is called', () => {
+			const initialColor = "#000000";
+			const newColor = "#111111";
+			expect(vm.App.ctx.strokeStyle).toEqual(initialColor);
+			expect(vm.ownColor).toEqual(initialColor);
+			scope.submitCustomColor("#111111");
+            expect(vm.App.ctx.strokeStyle).toEqual(newColor);
+			expect(vm.ownColor).toEqual(newColor);
+        });
+
+   });
+});
\ No newline at end of file
diff --git a/client/app/config/app.config.js b/client/app/config/app.config.js
index 0ad0ea2..7579623 100644
--- a/client/app/config/app.config.js
+++ b/client/app/config/app.config.js
@@ -1,7 +1,6 @@
 import authInterceptor from './auth.interceptor';
 
 function AppConfig($httpProvider, $stateProvider, $locationProvider, $urlRouterProvider) {
-  'ngInject';
   
   $httpProvider.interceptors.push(authInterceptor);
 
@@ -25,5 +24,6 @@ function AppConfig($httpProvider, $stateProvider, $locationProvider, $urlRouterP
   $urlRouterProvider.otherwise('/');
 
 }
+AppConfig.$inject = ["$httpProvider", "$stateProvider", "$locationProvider", "$urlRouterProvider"]; //Explicit annotation needed!
 
 export default AppConfig;
diff --git a/client/app/config/app.run.js b/client/app/config/app.run.js
index 9e711f4..1c22f32 100644
--- a/client/app/config/app.run.js
+++ b/client/app/config/app.run.js
@@ -17,5 +17,6 @@ function AppRun(AppConstants, $rootScope) {
   };
 
 }
+AppRun.$inject = ["AppConstants", "$rootScope"]; //Explicit annotation needed!
 
 export default AppRun;
diff --git a/client/app/config/app.templates.js b/client/app/config/app.templates.js
index 342c03f..c807e50 100644
--- a/client/app/config/app.templates.js
+++ b/client/app/config/app.templates.js
@@ -1,8 +1,8 @@
-angular.module('templates', []).run(['$templateCache', function($templateCache) {$templateCache.put('canvas/canvas.html','<div id="navbar">\r\n\t<ul class="canvasNav">\r\n\t\t<li class="nav-item canvas-button">\r\n\t\t\t<a class="nav-link"\r\n\t\t\t\tui-sref-active="active"\r\n\t\t\t\tui-sref="app.home">\r\n\t\t\t\tHome\r\n\t\t\t</a>\r\n\t\t</li>\r\n\t\t<md-button id="colorOptions" class="md-fab icon ion-android-color-palette" aria-label="Change Color"/>\r\n\t\t<div id="colorList">\r\n\t\t\t<div id="black" class="color"/>\r\n\t\t\t<div id="white" class="color"/>\r\n\t\t\t<div id="green" class="color"/>\r\n\t\t\t<div id="yellow" class="color"/>\r\n\t\t\t<div id="orange" class="color"/>\r\n\t\t\t<div id="red" class="color"/>\r\n\t\t\t<div id="lightBlue" class="color"/>\r\n\t\t\t<div id="blue" class="color"/>\r\n\t\t\t<div id="purple" class="color"/>\r\n\t\t</div>\r\n\t\t<div id="customColor">\r\n\t\t\t<label class="customColorLabel">Custom Color</label>\r\n\t\t\t<input class="customColorInput" ng-model="colorModel" placeholder="HEX/Color..." ng-model="customColor">\r\n\t\t\t<md-button id="submitCustomColor" ng-click="submitCustomColor(colorModel)" class="md-fab icon ion-checkmark" aria-label="SubmitCustomColor"/>\r\n\t\t</div>\r\n\t\t<div class="alert alert-success alertCustom" ng-show="showAlert">\r\n\t\t\t<button type="button" class="close" data-ng-click="switchBool(\'showAlert\')" >\xD7</button>\r\n\t\t\t<strong>{{textTitle}}</strong> {{textAlert}}\r\n\t\t</div>\r\n\t</ul>\r\n</div>\r\n\t\r\n<div id="content">\r\n\r\n\t<div id="cvContainer"><!-- our canvas will be inserted here--></div>\r\n\t<div id="sidebar">\r\n\t\t<md-button id="clearCv" class="md-fab icon ion-ios-trash" aria-label="Clear Canvas"/>\r\n\t\t<md-button id="changeBrushSize" class="md-fab icon ion-record" aria-label="Brush Size"/>\r\n\t\t<md-button id="saveDrawing" class="md-fab icon ion-image" aria-label="Save Image to Server"/>\r\n\t</div>\r\n\t\r\n</div>\r\n\r\n<div id="footer">\r\n\t<p id="footerText">WebApps 3 Drawing Application</p>\r\n</div>');
-$templateCache.put('auth/auth.html','<div class="auth-page">\r\n    <div class="row">\r\n\t\t<div class="auth-header">\r\n\t\t\t<ul>\r\n\t\t\t\t<li class="nav-item canvas-button">\r\n\t\t\t\t\t<a class="nav-link"\r\n\t\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t\t  ui-sref="app.home">\r\n\t\t\t\t\t  Home\r\n\t\t\t\t\t</a>\r\n\t\t\t\t</li>\r\n\t\t\t\t<h1 class="auth-title" ng-bind="::$ctrl.title"></h1>\r\n\t\t\t\t<div class="block"></div>\r\n\t\t\t</ul>\r\n\t\t\t\r\n\t\t</div>\r\n        <p>\r\n          <a ui-sref="app.login" ng-show="$ctrl.authType === \'register\'">\r\n            Have an account?\r\n          </a>\r\n\t\t  <a ui-sref="app.register" ng-show="$ctrl.authType === \'login\'">\r\n            Need an account?\r\n          </a>\r\n        </p>\r\n\t\t\r\n\t\t<p class="auth-error">{{$ctrl.errors}}</p>\r\n\r\n\t\t\t<form name="authForm" novalidate ng-submit="$ctrl.submitForm()" id="authForm">\r\n\t\t\t  <fieldset ng-disabled="$ctrl.isSubmitting">\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="text"\r\n\t\t\t\t\tplaceholder="Username"\r\n\t\t\t\t\tng-model="$ctrl.formData.username"\r\n\t\t\t\t\tng-pattern="/^([A-Za-z0-9\\-\\_]{3,16}$)+$/" ng-required="$ctrl.authType === \'register\'" ng-show="$ctrl.authType === \'register\'"/>\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="email"\r\n\t\t\t\t\tplaceholder="Email"\r\n\t\t\t\t\tng-model="$ctrl.formData.email" required/>\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="password"\r\n\t\t\t\t\tplaceholder="Password"\r\n\t\t\t\t\tng-model="$ctrl.formData.password" required/>\r\n\r\n\t\t\t\t<md-button class="authSubmit md-raised" type="submit" ng-bind="$ctrl.title" ng-disabled="authForm.$invalid" aria-label="auth"/>\r\n\t\t\t  </fieldset>\r\n\t\t\t</form>\r\n  </div>\r\n</div>');
+angular.module('templates', []).run(['$templateCache', function($templateCache) {$templateCache.put('auth/auth.html','<div class="auth-page">\r\n    <div class="row">\r\n\t\t<div class="auth-header">\r\n\t\t\t<ul>\r\n\t\t\t\t<li class="nav-item canvas-button">\r\n\t\t\t\t\t<a class="nav-link"\r\n\t\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t\t  ui-sref="app.home">\r\n\t\t\t\t\t  Home\r\n\t\t\t\t\t</a>\r\n\t\t\t\t</li>\r\n\t\t\t\t<h1 class="auth-title" ng-bind="::$ctrl.title"></h1>\r\n\t\t\t\t<div class="block"></div>\r\n\t\t\t</ul>\r\n\t\t\t\r\n\t\t</div>\r\n        <p>\r\n          <a ui-sref="app.login" ng-show="$ctrl.authType === \'register\'">\r\n            Have an account?\r\n          </a>\r\n\t\t  <a ui-sref="app.register" ng-show="$ctrl.authType === \'login\'">\r\n            Need an account?\r\n          </a>\r\n        </p>\r\n\t\t\r\n\t\t<p class="auth-error">{{$ctrl.errors}}</p>\r\n\r\n\t\t\t<form name="authForm" novalidate ng-submit="$ctrl.submitForm()" id="authForm">\r\n\t\t\t  <fieldset ng-disabled="$ctrl.isSubmitting">\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="text"\r\n\t\t\t\t\tplaceholder="Username"\r\n\t\t\t\t\tng-model="$ctrl.formData.username"\r\n\t\t\t\t\tng-pattern="/^([A-Za-z0-9\\-\\_]{3,16}$)+$/" ng-required="$ctrl.authType === \'register\'" ng-show="$ctrl.authType === \'register\'"/>\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="email"\r\n\t\t\t\t\tplaceholder="Email"\r\n\t\t\t\t\tng-model="$ctrl.formData.email" required/>\r\n\r\n\t\t\t\t  <input class="auth-input"\r\n\t\t\t\t\ttype="password"\r\n\t\t\t\t\tplaceholder="Password"\r\n\t\t\t\t\tng-model="$ctrl.formData.password" required/>\r\n\r\n\t\t\t\t<md-button class="authSubmit md-raised" type="submit" ng-bind="$ctrl.title" ng-disabled="authForm.$invalid" aria-label="auth"/>\r\n\t\t\t  </fieldset>\r\n\t\t\t</form>\r\n  </div>\r\n</div>');
 $templateCache.put('components/list-errors.html','<ul class="error-messages" ng-show="$ctrl.errors">\r\n  <div ng-repeat="(field, errors) in $ctrl.errors">\r\n    <li ng-repeat="error in errors">\r\n      {{field}} {{error}}\r\n    </li>\r\n  </div>\r\n</ul>');
+$templateCache.put('canvas/canvas.html','<div id="navbar">\r\n\t<ul class="canvasNav">\r\n\t\t<li class="nav-item canvas-button">\r\n\t\t\t<a class="nav-link"\r\n\t\t\t\tui-sref-active="active"\r\n\t\t\t\tui-sref="app.home">\r\n\t\t\t\tHome\r\n\t\t\t</a>\r\n\t\t</li>\r\n\t\t<md-button id="colorOptions" class="md-fab icon ion-android-color-palette" aria-label="Change Color"/>\r\n\t\t<div id="colorList">\r\n\t\t\t<div id="black" class="color"/>\r\n\t\t\t<div id="white" class="color"/>\r\n\t\t\t<div id="green" class="color"/>\r\n\t\t\t<div id="yellow" class="color"/>\r\n\t\t\t<div id="orange" class="color"/>\r\n\t\t\t<div id="red" class="color"/>\r\n\t\t\t<div id="lightBlue" class="color"/>\r\n\t\t\t<div id="blue" class="color"/>\r\n\t\t\t<div id="purple" class="color"/>\r\n\t\t</div>\r\n\t\t<div id="customColor">\r\n\t\t\t<label class="customColorLabel">Custom Color</label>\r\n\t\t\t<input class="customColorInput" ng-model="colorModel" placeholder="HEX/Color..." ng-model="customColor">\r\n\t\t\t<md-button id="submitCustomColor" ng-click="submitCustomColor(colorModel)" class="md-fab icon ion-checkmark" aria-label="SubmitCustomColor"/>\r\n\t\t</div>\r\n\t\t<div class="alert alert-success alertCustom" ng-show="showAlert">\r\n\t\t\t<button type="button" class="close" data-ng-click="switchBool(\'showAlert\')" >\xD7</button>\r\n\t\t\t<strong>{{textTitle}}</strong> {{textAlert}}\r\n\t\t</div>\r\n\t</ul>\r\n</div>\r\n\t\r\n<div id="content">\r\n\r\n\t<div id="cvContainer"><!-- our canvas will be inserted here--></div>\r\n\t<div id="sidebar">\r\n\t\t<md-button id="clearCv" class="md-fab icon ion-ios-trash" aria-label="Clear Canvas"/>\r\n\t\t<md-button id="changeBrushSize" class="md-fab icon ion-record" aria-label="Brush Size"/>\r\n\t\t<md-button id="saveDrawing" class="md-fab icon ion-image" aria-label="Save Image to Server"/>\r\n\t</div>\r\n\t\r\n</div>\r\n\r\n<div id="footer">\r\n\t<p id="footerText">WebApps 3 Drawing Application</p>\r\n</div>');
+$templateCache.put('home/home.html','<div class="home-page">\r\n\r\n\t<div id="home-navbar">\r\n\t\t<ul>\r\n\r\n\t\t  <li class="nav-item canvas-button">\r\n\t\t\t<a class="nav-link"\r\n\t\t\t  ui-sref-active="active"\r\n\t\t\t  ui-sref="app.canvas">\r\n\t\t\t  Canvas\r\n\t\t\t</a>\r\n\t\t  </li>\r\n\t\t  \r\n\t\t  <h1>WebApps 3 Drawing Application</h1>\r\n\r\n\t\t  <div ng-hide="$ctrl.authed" class="authDiv">\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link"\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ui-sref="app.login">\r\n\t\t\t\t  Sign in\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link"\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ui-sref="app.register">\r\n\t\t\t\t  Sign up\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\t\t  </div>\r\n\t\t  \r\n\t\t  <div show-authed="true" class="authDiv">\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link" href=""\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ng-click="$ctrl.logout()">\r\n\t\t\t\t  Logout\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\t\t  </div>\r\n\r\n\t\t</ul>\r\n\t</div>\r\n\t\r\n\t<div id="newsMessage">\r\n\t\t<p>Welcome to the home page of this Drawing Application.</p>\r\n\t\t<p>This website allows you to draw alone or with other people. You can also name your drawing and save it, it will then display here on the home page.</p>\r\n\t\t<p>Below you can see a list of drawings that were already saved by other people.</p>\r\n\t\t<p>This website was developed by Thomas Buys.</p>\r\n\t</div>\r\n\t\r\n\t<div id="images">\r\n\t\r\n\t</div>\r\n\r\n</div>\r\n');
 $templateCache.put('layout/app-view.html','<div ui-view></div>');
 $templateCache.put('layout/footer.html','<div id="footer">\r\n\t<span>test</span>\r\n</div>');
 $templateCache.put('layout/header.html','<div id="navbar">\r\n\t<select id="colorOptions"></select>\r\n\t<span>Evil Drawing</span>\r\n</div>');
-$templateCache.put('layout/sidebar.html','<div id="sidebar">\r\n                <input type ="button" id="clearCv" value="Clear Canvas"/>\r\n                <input type ="button" id="changeBrushSize" value="Brush Size"/>\r\n</div>');
-$templateCache.put('home/home.html','<div class="home-page">\r\n\r\n\t<div id="home-navbar">\r\n\t\t<ul>\r\n\r\n\t\t  <li class="nav-item canvas-button">\r\n\t\t\t<a class="nav-link"\r\n\t\t\t  ui-sref-active="active"\r\n\t\t\t  ui-sref="app.canvas">\r\n\t\t\t  Canvas\r\n\t\t\t</a>\r\n\t\t  </li>\r\n\t\t  \r\n\t\t  <h1>WebApps 3 Drawing Application</h1>\r\n\r\n\t\t  <div ng-hide="$ctrl.authed" class="authDiv">\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link"\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ui-sref="app.login">\r\n\t\t\t\t  Sign in\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link"\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ui-sref="app.register">\r\n\t\t\t\t  Sign up\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\t\t  </div>\r\n\t\t  \r\n\t\t  <div show-authed="true" class="authDiv">\r\n\t\t\t  <li class="nav-item auth-button">\r\n\t\t\t\t<a class="nav-link" href=""\r\n\t\t\t\t  ui-sref-active="active"\r\n\t\t\t\t  ng-click="$ctrl.logout()">\r\n\t\t\t\t  Logout\r\n\t\t\t\t</a>\r\n\t\t\t  </li>\r\n\t\t  </div>\r\n\r\n\t\t</ul>\r\n\t</div>\r\n\t\r\n\t<div id="newsMessage">\r\n\t\t<p>Welcome to the home page of this Drawing Application.</p>\r\n\t\t<p>This website allows you to draw alone or with other people. You can also name your drawing and save it, it will then display here on the home page.</p>\r\n\t\t<p>Below you can see a list of drawings that were already saved by other people.</p>\r\n\t\t<p>This website was developed by Thomas Buys.</p>\r\n\t</div>\r\n\t\r\n\t<div id="images">\r\n\t\r\n\t</div>\r\n\r\n</div>\r\n');}]);
\ No newline at end of file
+$templateCache.put('layout/sidebar.html','<div id="sidebar">\r\n                <input type ="button" id="clearCv" value="Clear Canvas"/>\r\n                <input type ="button" id="changeBrushSize" value="Brush Size"/>\r\n</div>');}]);
\ No newline at end of file
diff --git a/client/app/config/auth.interceptor.js b/client/app/config/auth.interceptor.js
index 9ec33ed..003911e 100644
--- a/client/app/config/auth.interceptor.js
+++ b/client/app/config/auth.interceptor.js
@@ -17,5 +17,6 @@ function authInterceptor(JWT, AppConstants, $window, $q) {
 		}
 	}
 }
+authInterceptor.$inject = ["JWT", "AppConstants", "$window", "$q"]; //Explicit annotation needed!
 
 export default authInterceptor;
\ No newline at end of file
diff --git a/client/app/home/home.config.js b/client/app/home/home.config.js
index ede6de8..55729bf 100644
--- a/client/app/home/home.config.js
+++ b/client/app/home/home.config.js
@@ -1,5 +1,4 @@
 function HomeConfig($stateProvider) {
-  'ngInject';
 
   $stateProvider
   .state('app.home', {
@@ -11,5 +10,6 @@ function HomeConfig($stateProvider) {
   });
 
 };
+HomeConfig.$inject = ["$stateProvider"]; //Explicit annotation needed!
 
 export default HomeConfig;
diff --git a/client/app/services/jwt.service.js b/client/app/services/jwt.service.js
index a6ac405..4b5c0b3 100644
--- a/client/app/services/jwt.service.js
+++ b/client/app/services/jwt.service.js
@@ -17,4 +17,5 @@ export default class JWT {
 	destroy() {
 		this._$window.localStorage.removeItem(this._AppConstants.jwtKey);
 	}
-}
\ No newline at end of file
+}
+JWT.$inject = ["AppConstants", "$window"]; //Explicit annotation needed!
\ No newline at end of file
diff --git a/karma.conf.babel.js b/karma.conf.babel.js
new file mode 100644
index 0000000..93242d0
--- /dev/null
+++ b/karma.conf.babel.js
@@ -0,0 +1,94 @@
+// Karma configuration
+// Generated on Tue Dec 06 2016 21:41:03 GMT+0100 (Romance Standard Time)
+
+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: [
+		'https://code.jquery.com/jquery-3.1.1.js',
+		'node_modules/angular/angular.js',
+		'node_modules/angular-mocks/angular-mocks.js',
+		'node_modules/angular-ui-router/release/angular-ui-router.js',
+		'node_modules/angular-material/angular-material.js',
+		'node_modules/angular-animate/angular-animate.js',
+		'node_modules/angular-aria/angular-aria.js',
+		'http://localhost:9876/socket.io/socket.io.js',
+		'client/app/app.js',
+		{ pattern: 'test-context.js', watched: false }
+    ],
+
+
+    // 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: {
+		'client/app/app.js': ['webpack'],
+		'test-context.js': ['webpack']
+    },
+	webpack: {
+            module: {
+                loaders: [
+                    { test: /\.js/, exclude: /node_modules/, loader: 'babel-loader' }
+                ]
+            },
+			node: {
+				fs: 'empty'
+			},
+            watch: true
+        },
+        webpackServer: {
+            noInfo: true
+    },
+
+
+    // 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: true,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['Chrome'],
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: false,
+
+    // Concurrency level
+    // how many browser should be started simultaneous
+    concurrency: Infinity
+  })
+}
diff --git a/package.json b/package.json
index f6efa4d..8bf95de 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
   },
   "homepage": "https://github.com/gevalo1/WebApps3#readme",
   "devDependencies": {
+    "angular-mocks": "^1.5.8",
     "babel-cli": "^6.18.0",
     "babel-core": "^6.18.2",
     "babel-loader": "^6.2.7",
@@ -45,6 +46,13 @@
     "gulp-notify": "^2.2.0",
     "gulp-rename": "^1.2.2",
     "gulp-uglify": "^2.0.0",
+    "jasmine": "^2.5.2",
+    "jasmine-core": "^2.5.2",
+    "karma": "^1.3.0",
+    "karma-babel-preprocessor": "^6.0.1",
+    "karma-chrome-launcher": "^2.0.0",
+    "karma-jasmine": "^1.0.2",
+    "karma-webpack": "^1.8.0",
     "vinyl-buffer": "^1.0.0",
     "vinyl-source-stream": "^1.1.0"
   },
@@ -57,13 +65,13 @@
     "body-parser": "1.15.2",
     "cookie-parser": "1.4.3",
     "cors": "^2.8.1",
-    "ejs": "2.5.2",
+    "ejs": "2.5.5",
     "express": "4.14.0",
     "gulp": "^3.9.1",
     "jsonwebtoken": "^7.1.9",
     "mongoose": "^4.6.6",
     "morgan": "1.7.0",
-    "serve-favicon": "2.3.0",
+    "serve-favicon": "2.3.2",
     "socket.io": "^1.5.1"
   }
 }
diff --git a/spec/run.js b/spec/run.js
new file mode 100644
index 0000000..9740a8d
--- /dev/null
+++ b/spec/run.js
@@ -0,0 +1,5 @@
+import Jasmine from 'jasmine'
+
+var jasmine = new Jasmine()
+jasmine.loadConfigFile('spec/support/jasmine.json')
+jasmine.execute()
\ No newline at end of file
diff --git a/spec/support/jasmine.json b/spec/support/jasmine.json
new file mode 100644
index 0000000..1a4529c
--- /dev/null
+++ b/spec/support/jasmine.json
@@ -0,0 +1,11 @@
+{
+  "spec_dir": "spec",
+  "spec_files": [
+	"client/app/**/*[sS]pec.js"
+  ],
+  "helpers": [
+    "helpers/**/*.js"
+  ],
+  "stopSpecOnExpectationFailure": false,
+  "random": false
+}
diff --git a/test-context.js b/test-context.js
new file mode 100644
index 0000000..8684560
--- /dev/null
+++ b/test-context.js
@@ -0,0 +1,2 @@
+var context = require.context('./client/app', true, /spec\.js$/);
+context.keys().forEach(context);
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index 4c6dc17..58666c1 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,7 +3,7 @@ var webpack = require('webpack');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 
 module.exports = {
-  devtool: 'source-map',
+  devtool: 'inline-source-map',
   entry: {},
   module: {
     loaders: [