在yeoman angularjs中使用模拟文件夹进行业力测试

时间:2013-09-07 14:55:12

标签: javascript unit-testing angularjs yeoman karma-runner

我有一个angularjs应用程序,我用自己生成的。在karma.conf.js中是对test / mock / ** / * .js的引用。我有麻烦找出来,我如何使用这个文件夹。目前我有一个简单的服务:

'use strict';

angular.module('tvcalApp')
  .factory('Series', function ($resource) {
    return $resource('/search/:search');
  });

和测试

'use strict';

var $httpBackend;

describe('Service: Series', function () {

  // load the service's module
  beforeEach(module('tvcalApp'));

  // instantiate service
  var Series;
  beforeEach(inject(function (_Series_) {
    Series = _Series_;
  }));

  beforeEach(inject(function ($injector) {
      var url_get = '/search/The%20Simpsons';

      var response_get = [{"seriesid": "71663"}];

      $httpBackend = $injector.get('$httpBackend');

      $httpBackend.whenGET(url_get).respond(response_get);

  }));

  it('should return a list if search for The Simpsons', function () {
      var res = Series.query({search: 'The Simpsons'});
      $httpBackend.flush();
        expect(res[0].seriesid === 71663);
      });

});

这很有效。但我想知道如果我可以使用karma.conf.js中的mock文件夹作为模拟函数。是否可以将模拟部分移动到模拟文件夹中并将其用于所有单元测试?

我找不到此文件夹的任何示例或文档。有人可以指点我的示例或文档如何使用模拟文件夹。

2 个答案:

答案 0 :(得分:7)

基本上我做过类似的事情,看看angular-mocks.js:
假设app可以称为ql。我有一个我想模拟的loginService:

mocks / servicesMock.js看起来像这样:

'use strict';

var ql = {};
ql.mock = {};

ql.mock.$loginServiceMockProvider = function() {
  this.$get = function() {
    var $service = {
      login: function() { }
    };
    return $service;
  };
};

angular.module('qlMock', ['ng']).provider({
  $loginServiceMock: ql.mock.$loginServiceMockProvider
});

然后在我的测试中,我可以注入$ loginServiceMock:

'use strict';

describe('LoginController tests', function () {
  // load the controller's module
  beforeEach(module('ql'));
  // load our mocks module
  beforeEach(angular.mock.module('qlMock'));

  var loginController,
    loginServiceMock,
    scope;

  // Initialize the controller and a mock scope
  // $loginSericeMock will be injected from serviceMocks.js file
  beforeEach(inject(function ($controller, $rootScope, $loginServiceMock) {
    scope = $rootScope.$new();
    loginServiceMock =  $loginServiceMock;
    loginController = $controller('LoginController', {
      $scope: scope,
      loginService: loginServiceMock
    });
  }));
});

答案 1 :(得分:3)

@gerasalus的例子很有用,但要回答这个问题:

mocks只是一个文件夹,用于放置代码以保持项目的有序性,并使测试中的代码简洁明了。通过将所有模拟保存在一个地方,在测试中重用它们更容易......从DRY的角度来看,将它们从一个测试复制到另一个测试将是不好的做法。

因此,例如,您可能有一个名为'Foo'的服务

app/service/foo.js

然后你可以创建一个名为'FooMock'

的服务模拟器
test/mocks/service/foo.js

然后你会创建测试并注入你需要的任何模拟,如gerasulus的回答所示。