JavaScripting

The definitive source of the best
JavaScript libraries, frameworks, and plugins.


  • ×

    Angular Debaser

    Just a better way to test AngularJS apps.
    Filed under 

    • 🔾12%Overall
    • 109
    • 20.7 days
    • 🕩3
    • 👥2

    angular-debaser Build Status Code Climate Test Coverage

    Just a better way to test AngularJS apps.

    The Idea

    AngularJS and its dependency injection make it very easy to isolate your code under test.
    Unfortunately, coding up stubs for those services can get tedious (many services injected, many modules depending upon modules), and you could end up with a fixture that dwarfs your assertions.

    angular-debaser attempts to reduce the size of your fixtures and make them natural to write.

    Example

    Given the following beastly fixture and test:

    describe('AdminDashboardCtrl', function () {
      var sandbox;
    
      beforeEach(function () {
        sandbox = sinon.sandbox.create('AdminDashboardCtrl');
      });
    
      afterEach(function() {
        sandbox.restore();
      });
    
      beforeEach(module(function ($provide) {
        $provide.provider('User', function () {
          this.assertAdmin = sandbox.stub();
          this.$get = function() {
            return {
              getAll: sandbox.stub().returns([])
            };
          };
        });
        $provide.service('Settings', function() {
          this.location_id = 1;
        });
        $provide.service('Pizza', function() {
          this.getAll = sandbox.stub().returns([]);
        });
        $provide.service('Toppings', function() {
          this.getAll = sandbox.stub().returns({});
        });
        $provide.service('Sides', function() {
          this.getAll = sandbox.stub().returns([]);
        });
        $provide.service('Orders', function() {
          this.getPreviousWeek = sandbox.stub().returns([]);
        });
        $provide.service('Deliveries', function() {
          this.getPreviousWeek = sandbox.stub().returns([]);
        });
      }));
    
      beforeEach(module('donny.pizzajoint.admin'));
    
      it('should gather a list of users', inject(function ($controller, $rootScope, User) {
        var scope = $rootScope.$new();
        $controller('AdminDashboardCtrl', {
          $scope: scope
        });
        expect(scope.getUsers()).to.eql([]);
        expect(User.getAll).to.have.been.calledOnce;
      }));
    });
    

    We'll use angular-debaser instead. It becomes this:

    describe('AdminDashboardCtrl', function () {
      beforeEach(function () {
        debaser()
          .module('donny.pizzajoint.admin')
          .object('Settings', {
            location_id: 1
          })
          .object('User').withFunc('getAll').returns([])
          .object('Pizza').withFunc('getAll').returns([])
          .object('Toppings').withFunc('getAll').returns({})
          .object('Sides').withFunc('getAll').returns([])
          .object('Orders').withFunc('getPreviousWeek').returns([])
          .object('Deliveries').withFunc('getPreviousWeek').returns([])
          .debase();
      });
    
      it('should gather a list of users',
        inject(function ($controller, User) {
          var scope = $controller('AdminDashboardCtrl');
          expect(scope.getUsers()).to.eql([]);
          expect(User.getAll).to.have.been.calledOnce;
        }));
    });
    

    (If you're counting, that's about half as many lines.)

    Interested? Trying to test something that injects 46 services?? You may want to read the tutorial & go down the rabbit hole.

    API

    If Sinon.JS is present, see this API for working with functions.

    See the API documentation.

    Installation

    bower install angular-debaser
    

    Optionally, save it to your bower.json: you probably don't want to use --save; use --save-dev.

    Current dependencies:

    Required, but not marked as dependencies:

    Recommended:

    • sinon-ng for working with $q; bower install sinon-ng

    Depending on your test runner setup, you may want to install these either via bower or npm:

    Also, if you are testing directives, I've found that jQuery is always handy to have around.

    Issues

    Issues here.

    License

    Copyright © 2014 Decipher, Inc. Licensed MIT.

    Maintainer

    Christopher Hiller

    Show All