Angular.js directive test example with service mocking

gistfile1.js

describe('Directive test', function () {

  var container, scope;
  var aStub;

  beforeEach(function () {
    aStub = sinon.stub();
    module('testmodule', function ($provide) {
      $provide.value('someService', aStub);
    });
    inject(function ($rootScope, $compile) {
      scope = $rootScope.$new();
      
      // controller for this directive uses the stubbed service
      // to determine if a button should be shown
      container = $('<some-directive></some-directive>');
      $compile(container)(scope);
      scope.$digest();
    });
  });

  afterEach(function () {
    container.remove();
  });

  it('do not show a button depending on service', function () {
    aStub.returns(false);
    scope.$apply();
    expect(container.find('.button').hasClass('ng-hide')).toBe(true);
  });
  
  it('show a button depending on service', function () {
    aStub.returns(true);
    scope.$apply();
    expect(container.find('.button').hasClass('ng-hide')).toBe(false);
  });

});