New Post: How to unit test Angular directive which have reference to external HTML

Hi mmanela,

I tried to integrate the template path. and wrote the test case as below. I got following error

______Error: [$injector:modulerr] Failed to instantiate module ../templates/directives/dashboardtoolbar.html due to:

Error: [$injector:nomod] Module '../templates/directives/dashboardtoolbar.html' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.______


/// <reference path="../scripts/angular.js" />
/// <reference path="../scripts/angular-mocks.js" />
/// <reference path="../appscripts/directives/dashboard-directive.js" />
/// <reference path="../jasmine.js" />
/// <template path="../templates/directives/dashboardtoolbar.html" />

describe('dashboard directive tests', function () {

beforeEach(module('dashboardDirective'));

var element, scope, $compile;

beforeEach(module('dashboardDirective','../templates/directives/dashboardtoolbar.html'));

beforeEach(inject(function ($rootScope, $compile, $templateCache) {
    template = $templateCache.get('../templates/directives/dashboardtoolbar.html');
    $templateCache.put('../templates/directives/dashboardtoolbar.html', template);

     $compile = $compile;
    scope = $rootScope;

})
)

it("should have the correct amount of drop down items in the list", function () {
    var formElement = angular.element('<toolbarDashboard></toolbarDashboard>');
    var element = $compile(formElement)($rootScope);
    scope.$digest();
    var list = element.find('li');
    expect(list.length).toBe(3);
});

})