Merge pull request #434 from passy/angular-ut-squashed

AngularJS: Unit Tests

architecture-examples/angularjs/component.json

@@ -4,5 +4,8 @@
   "dependencies": {
     "angular": "~1.0.5",
     "todomvc-common": "~0.1.0"
+  },
+  "devDependencies": {
+    "angular-mocks": "~1.0.5"
   }
-}
+}
\ No newline at end of file

architecture-examples/angularjs/test/config/testacular.conf.js

+basePath = '../../';
+
+files = [
+  JASMINE,
+  JASMINE_ADAPTER,
+  'components/angular/angular.js',
+  'components/angular-mocks/angular-mocks.js',
+  'js/**/*.js',
+  'test/unit/**/*.js'
+];
+
+autoWatch = true;
+
+browsers = ['Chrome'];

architecture-examples/angularjs/test/package.json

+{
+    "name": "todomvc-angular-tests",
+    "description": "Unit tests for the AngularJS example of TodoMVC",
+    "author": "Pascal Hartig <phartig@rdrei.net>",
+    "version": "1.0.0",
+    "devDependencies": {
+        "testacular": "~ 0.4.0"
+    },
+    "scripts": {
+        "test": "testacular start config/testacular.conf.js"
+    }
+}

architecture-examples/angularjs/test/readme.md

+Angular Unit Tests
+==================
+
+To run the test suite, run these commands:
+
+    npm install
+    npm test

architecture-examples/angularjs/test/unit/directivesSpec.js

+/*global describe, it, beforeEach, inject, expect, angular*/
+(function () {
+	'use strict';
+
+	beforeEach(module('todomvc'));
+
+	describe('todoBlur directive', function () {
+		var scope, compile;
+
+		beforeEach(inject(function ($rootScope, $compile) {
+			scope = $rootScope.$new();
+			compile = $compile;
+		}));
+
+		it('should $apply on blur', function () {
+			var el,
+				mock = {
+				called: false,
+				call: function () { this.called = true; }
+			};
+
+			scope.mock = mock;
+			el = angular.element('<input todo-blur="mock.call()">');
+			compile(el)(scope);
+
+			el.triggerHandler('blur');
+			scope.$digest();
+
+			expect(mock.called).toBeTruthy();
+		});
+	});
+
+	describe('todoFocus directive', function () {
+		var scope, compile, browser;
+
+		beforeEach(inject(function ($rootScope, $compile, $browser) {
+			scope = $rootScope.$new();
+			compile = $compile;
+			browser = $browser;
+		}));
+
+		it('should focus on truthy expression', function () {
+			var el = angular.element('<input todo-focus="focus">');
+			scope.focus = false;
+
+			compile(el)(scope);
+			expect(browser.deferredFns.length).toBe(0);
+
+			scope.$apply(function () {
+				scope.focus = true;
+			});
+
+			expect(browser.deferredFns.length).toBe(1);
+		});
+	});
+}());

architecture-examples/angularjs/test/unit/todoCtrlSpec.js

+/*global describe, it, beforeEach, inject, expect*/
+(function () {
+	'use strict';
+
+	describe('Todo Controller', function () {
+		var ctrl, scope;
+
+			// Load the module containing the app, only 'ng' is loaded by default.
+		beforeEach(module('todomvc'));
+
+		beforeEach(inject(function ($controller, $rootScope) {
+			scope = $rootScope.$new();
+			ctrl = $controller('TodoCtrl', {$scope: scope});
+		}));
+
+		it('should not have an edited Todo on start', function () {
+			expect(scope.editedTodo).toBeNull();
+		});
+
+		it('should not have any Todos on start', function () {
+			expect(scope.todos.length).toBe(0);
+		});
+
+		it('should have all Todos completed', function () {
+			scope.$digest();
+			expect(scope.allChecked).toBeTruthy();
+		});
+
+		describe('the path', function () {
+			it('should default to "/"', function () {
+				expect(scope.location.path()).toBe('/');
+			});
+
+			describe('being at /active', function () {
+				it('should filter non-completed', inject(function ($controller) {
+					ctrl = $controller('TodoCtrl', {
+						$scope: scope,
+						$location: {
+							path: function () { return '/active'; }
+						}
+					});
+
+					scope.$digest();
+					expect(scope.statusFilter.completed).toBeFalsy();
+				}));
+			});
+
+			describe('being at /completed', function () {
+				it('should filter completed', inject(function ($controller) {
+					ctrl = $controller('TodoCtrl', {
+						$scope: scope,
+						$location: {
+							path: function () { return '/completed'; }
+						}
+					});
+
+					scope.$digest();
+					expect(scope.statusFilter.completed).toBeTruthy();
+				}));
+			});
+		});
+
+		describe('having some saved Todos', function () {
+			var todoList,
+				todoStorage = {
+				storage: {},
+				get: function () {
+					return this.storage;
+				},
+				put: function (value) {
+					this.storage = value;
+				}
+			};
+
+			beforeEach(inject(function ($controller) {
+				todoList = [{
+						'title': 'Uncompleted Item 0',
+						'completed': false
+					}, {
+						'title': 'Uncompleted Item 1',
+						'completed': false
+					}, {
+						'title': 'Uncompleted Item 2',
+						'completed': false
+					}, {
+						'title': 'Completed Item 0',
+						'completed': true
+					}, {
+						'title': 'Completed Item 1',
+						'completed': true
+					}];
+
+				todoStorage.storage = todoList;
+				ctrl = $controller('TodoCtrl', {
+					$scope: scope,
+					todoStorage: todoStorage
+				});
+				scope.$digest();
+			}));
+
+			it('should count Todos correctly', function () {
+				expect(scope.todos.length).toBe(5);
+				expect(scope.remainingCount).toBe(3);
+				expect(scope.completedCount).toBe(2);
+				expect(scope.allChecked).toBeFalsy();
+			});
+
+			it('should save Todos to local storage', function () {
+				expect(todoStorage.storage.length).toBe(5);
+			});
+
+			it('should remove Todos w/o title on saving', function () {
+				var todo = todoList[2];
+				todo.title = '';
+
+				scope.doneEditing(todo);
+				expect(scope.todos.length).toBe(4);
+			});
+
+			it('clearCompletedTodos() should clear completed Todos', function () {
+				scope.clearCompletedTodos();
+				expect(scope.todos.length).toBe(3);
+			});
+
+			it('markAll() should mark all Todos completed', function () {
+				scope.markAll();
+				scope.$digest();
+				expect(scope.completedCount).toBe(5);
+			});
+		});
+	});
+}());