title: Unit testing AngularJS Directives with Jest
body: <p>I feel I am missing something crucial in this extremely simplified angular directive unit test:</p>
  
  <pre><code>import * as angular from 'angular'
  import 'angular-mocks'
  
  const app = angular.module('my-app', [])
  
  app.directive('myDirective', () =&gt; ({
      template: 'this does not work either',
      link: (scope, element) =&gt; { // have also tried compile fn
          console.log('This does not log')
          element.html('Hi!')
      }
  }))
  
  describe('myDirective', () =&gt; {
      var element, scope
  
      beforeEach(app)
  
      beforeEach(inject(($rootScope, $compile) =&gt; {
          scope = $rootScope.$new()
          element = $compile('&lt;my-directive /&gt;')(scope)
          scope.$digest()
      }))
  
      it('should actually do something', () =&gt; {
          expect(element.html()).toEqual('Hi!')
      })
  })
  </code></pre>
  
  <p>When jest runs it appears the directive has not been linked/compiled/whatever</p>
  
  <pre><code> FAIL  test/HtmlToPlaintextDirective.spec.js
    ● myDirective › should actually do something
  
      expect(received).toEqual(expected)
  
      Expected value to equal:
        "Hi!"
      Received:
        ""
  </code></pre>