1

我正在将我们所有的代码转移到 Karma 和 Jasmine 上,并且很难弄清楚我从哪里开始。

如果我从 TDD 的角度开始构建它,这段代码会是什么样子?一个简单的测试是什么样的?

注意:此代码 100% 有效,但我没有任何测试设置。

(function() {

    "use strict";

    angular.module('system_centers', [
        'system'
    ])

        .factory('System', ['Api', function(Api) {
            this.loadSystem = function(contactId, cardId) {
                return Api.get('lmc/contact/system/' + contactId, {
                    card_id: cardId
                });
            };

            this.completeSystem = function(recordId) {
                return Api.put('system/complete/' + recordId);
            };

            this.createSystem = function(contactId, cardId) {
                if (+contactId === 0 || +cardId === 0) {
                    return false;
                }

                return Api.post('contact/system/' + contactId, {
                    card_id: cardId,
                    type: 'systems',
                    origin: 'lmc'
                });
            };

            return this;
        }])

        .controller('System_centersCtrl', ['$scope', 'System', function($scope, System) {
            $scope.main.cardType = 'systems';
            $scope.main.type = 'system_centers';

            $scope.completeSystem = function(recordId) {
                System.completeSystem(recordId).success(function(){
                    toastr.success("System completed!");
                    $scope.createSystem();
                    $scope.loadSystems();
                });
            };

            $scope.createSystem = function() {
                System.createSystem($scope.main.contactId, $scope.main.cardId).success(function() {
                    $scope.loadSystem($scope.main.contactId, $scope.main.cardId);
                    $scope.loadContacts();
                });
            };

            $scope.loadSystem = function() {
                System.loadSystem($scope.main.contactId, $scope.main.cardId).success(function(data) {
                    if (data.error) {
                        $scope.createSystem();
                    } else {
                        $scope.main.record = data.record;
                    }
                });
            };

            $scope.loadSystems();
        }]);

})();
4

1 回答 1

6

测试很容易,您只需要断言您的工厂工作正常。这并不意味着您实际上想要获取/放置/发布属于Api测试的内容。这里我们只想知道调用我们工厂的某些函数会调用一些Api参数正确的函数。

我想这Api属于system模块。我加载并模拟它:

beforeEach(module('system', function($provide) {
  api = {
    get: function(url, params) {},
    put: function(url, params) {},
    post: function(url, params) {}
  };

  spyOn(api, 'get');
  spyOn(api, 'put');
  spyOn(api, 'post');

  $provide.value('Api', api);
}));

module将加载您的system模块,然后我们只需要使用我们的Api服务接口创建一个简单的对象。无需对它们实施任何操作。

然后我们只需要监视方法(以便能够断言它们已被调用)。

接下来,我们加载system_centers模块并注入我们的服务:

beforeEach(module('system_centers'));

beforeEach(inject(function(System) {
  system = System;
}));

inject用于在我们的测试中注入依赖项。我们只需要注入我们的System工厂。

剩下的测试是什么,我创建了一堆:

it('should load the system', function() {
  system.loadSystem(1, 0);
  expect(api.get).toHaveBeenCalledWith('lmc/contact/system/1', {card_id : 0});
});

it('should be able to complete the system', function() {
  system.completeSystem(20);
  expect(api.put).toHaveBeenCalledWith('system/complete/20');
});

it('should create the system', function() {
  system.createSystem(1, 3);
  expect(api.post).toHaveBeenCalledWith('contact/system/1', { card_id: 3, type: 'systems', origin: 'lmc'});
});

it('should not create the system if contact_id is 0', function() {
  system.createSystem(0, 20);
  expect(api.post).not.toHaveBeenCalled();
});

it('should not create the system if card_id is 0', function() {
  system.createSystem(1, 0);
  expect(api.post).not.toHaveBeenCalled();
});

它们几乎相同。我们调用了一些工厂方法,并且我们期望我们Api已经被调用了一些参数。甚至createSystem使用联系人或卡 ID 为 0 的呼叫也不会呼叫Api.

嗯,这是一个好的开始。您可以继续进行更多测试或应用程序的其他部分。

这是plunker:http ://plnkr.co/edit/5vfg0Y1G0vo2nnz0xByN?p=preview

于 2014-01-04T11:55:32.797 回答