0

I have a directive in which controller is defined as a part of directive definition. 

 (function(){
     var app = angular.module('app', []); 
    app.directive('test', function(){ 
    return { 
    restrict: 'E', 
    templateUrl: 'test.html', 
    controller: ['$scope', function ($scope){...*set of functions*......}], 
    controllerAs:'reportCtrl',
    link:function(Attrs){
       }
     }; 
   }); 
})();

I need to write unit test for the set of functions. I am new to karma testing and I did not find much resources for this kind of code. I almost tried all the possible ways. Can someone help me to write unit test for this

vino
  • 57
  • 1
  • 7
  • Possible duplicate of [angular JS unit testing a controller](http://stackoverflow.com/questions/33134566/angular-js-unit-testing-a-controller) – angmerica Oct 16 '15 at 18:10

1 Answers1

0

Here is an example. See Demo http://plnkr.co/edit/zK9MNkvNpHF2UY9BgMKz?p=preview

What I did was compile the directive and called the digest cycle. After the setup, it is pretty much the same as a regular controller.

describe('Auth Service Tests', function() {
  var element;
  var isolated;
  var $scope;
  beforeEach(module('MyApp'));
  beforeEach(inject(function($rootScope, $compile, $templateCache) {
    // Imports test.html
    var templateUrl = 'test.html';
    var req = new XMLHttpRequest();
    req.onload = function() {
      $templateCache.put(templateUrl, this.responseText);
    };
    req.open('get', templateUrl, false);
    req.send();


    $scope = $rootScope.$new();

    element = '<test></test>';
    // Creates the directive.
    element = $compile(element)($scope);

    // activates the $digest cycle.
    $scope.$apply();
  }));

  it('tests the transclude', function() {
    expect($scope.apple).toEqual('world');
    expect($scope.getApple()).toEqual('world');
  });

});
angmerica
  • 787
  • 8
  • 13
  • Thank you.. I have the template Url : ../test/test/test.html and I am writing unit tests in a different folder. Should I give the path to test.html from the unit tests folder in $templateCache.put . I am getting an error unexpected request: GET ../test/test/test.html – vino Oct 16 '15 at 17:43
  • yes, you should change the example to fit your path. alternatively you could use ngHtml2JsPreprocessor. http://stackoverflow.com/questions/15214760/unit-testing-angularjs-directive-with-templateurl This will transform your html into js and place it into a single module. This way you do not have to use the $templateCache. – angmerica Oct 16 '15 at 18:14
  • If we use ngHtml2JsPreprocessor, then we just need to load the module and we can avoid template cache right? – vino Oct 16 '15 at 18:26
  • I dont know what mistake I am making.. In karma.conf.js I have the link to html and gave a name to module under nghtml2jspreprocessor. I get error saying module is not available. – vino Oct 16 '15 at 18:33
  • It could be your karma.conf.js is not set up correctly. Maybe create a new post for this issue. – angmerica Oct 16 '15 at 18:43