title: Test a simple function in a directive, angular
body: <p>This is my directive:</p>
  
  <pre><code>angular.module('clientApp')
    .directive('positionDropDowns', function (CommonFactory) {
      return {
        templateUrl: 'template/position-drop-downs/position-drop-downs.html',
        restrict: 'E',
        scope: {
          districtsWithSubObjects: '='
        },
        link: function postLink(scope, element, attrs) {
  
          scope.hello = function(name){
            return 'hello ' + name;
          }
        }
      };
    });
  </code></pre>
  
  <p>How do I test the <code>hello</code> function? I tried this:</p>
  
  <pre><code>describe('Directive: positionsDropDowns', function () {
  
    // load the directive's module
    beforeEach(module('clientApp'));
  
    beforeEach(module('template/position-drop-downs/position-drop-downs.html'));
  
    var element,
      scope;
  
    beforeEach(inject(function ($rootScope) {
      scope = $rootScope.$new();
  
      element = angular.element('&lt;position-drop-downs&gt;&lt;/position-drop-downs&gt;');
  
      $rootScope.$digest();
    }));
  
    it('fn hello', inject(function ($compile) {
      expect(element.scope.hello('john')).toBe("hello john");
  
    }));
  });
  </code></pre>
  
  <p>I get <code>TypeError: undefined is not a function</code></p>