Testing angular directives with Jasmine
Testing an Angular directives with Jasmine
HTML
<script src="http://jasmine.github.io/1.3/lib/jasmine.js"></script>
<script src="http://jasmine.github.io/1.3/lib/jasmine-html.js"></script>
<link rel="stylesheet" href="http://jasmine.github.io/1.3/lib/jasmine.css">
<script src="http://code.angularjs.org/1.2.9/angular.js"></script>
<script src="http://code.angularjs.org/1.2.9/angular-mocks.js"></script>
<tree-view model="testHierarchy">Test Hierarchy Data</tree-view>
JavaScript
//--- CODE --------------------------
var myApp = angular.module('myApp', []);
myApp.testHierarchy = "{name:\"Santa Fe Pacific Corp\", issuerId:\"1318\", bbgIssuerId:\"101310\", parentIssuerId:\"54598\", ultimateParentId:\"204\",\"children\":[{name:\"Burlington Northern Inc\", issuerId:\"190452\", bbgIssuerId:\"908623\", parentIssuerId:\"1318\", ultimateParentId:\"204\",\"children\":[{name:\"St Louis-San Fran RR Co\", issuerId:\"76163\", bbgIssuerId:\"201375\", parentIssuerId:\"190452\", ultimateParentId:\"204\"}]}]}";
myApp.directive('myDrtv', function () {
return {
restrict: 'E',
// Better to externalize to templateUrl, this is for demonstration sake
template: '<div>Hello {{name}}</div>',
replace: false
};
});
// ---SPECS-------------------------
describe('myApp', function () {
var element,
name = 'Homer';
beforeEach(function () {
module('myApp');
element = angular.element('<my-drtv/>');
inject(function ($rootScope, $compile) {
var scope = $rootScope.$new();
scope.name = name;
$compile(element)(scope);
scope.$digest();
});
});
it('says hello', function () {
expect(element.text()).toBe('Hello Homer');
});
});
// --- Runner -------------------------
(function () {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;
var htmlReporter = new jasmine.HtmlReporter();
jasmineEnv.addReporter(htmlReporter);
jasmineEnv.specFilter = function (spec) {
return htmlReporter.specFilter(spec);
};
var currentWindowOnload = window.onload;
window.onload = function () {
if (currentWindowOnload) {
currentWindowOnload();
}
execJasmine();
};
function execJasmine() {
jasmineEnv.execute();
}
})();
myApp.directive('treeView', function ($compile) {
return {
restrict: 'E',
scope: {
localNodes: '=model',
...