在yeoman angularjs中使用模擬文件夾進行業力測試

Question

我有一個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文件夾作為模擬函數。 是否可以將模擬部分移動到模擬文件夾中並將其用於所有單元測試？

我找不到此文件夾的任何示例或文檔。 有人可以指點我的示例或文檔如何使用模擬文件夾。

Answer 1

基本上我做了類似的事情看了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
});

然后在我的測試中，我可以injeck $ 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
    });
  }));
});

Answer 2

@gerasalus的例子很有用，但要回答這個問題：

mocks只是一個文件夾，用於放置代碼以保持項目的有序性，並且測試中的代碼簡短而重要。 通過將所有模擬保存在一個地方，在測試中重用它們更容易......從DRY的角度來看，將它們從一個測試復制到另一個測試將是不好的做法。

因此，例如，您可能有一個名為'Foo'的服務

app/service/foo.js

然后你可以創建一個名為'FooMock'的服務的模擬

test/mocks/service/foo.js

然后你會創建測試並注入你需要的任何模擬，如gerasulus的回答所示。