Angularjs配置为使用嘲笑 [英] Angularjs configure to use mocks

问题描述

如何配置的角度应用到一台服务器上使用存根服务和真正的另一个？我想主办我的应用程序一个超级便宜的PHP Web服务器上demoing到利益相关者。我可以存根外其余的服务，但我没有写了多年的PHP和真的不想要。我想preFER使用可以也可用于端到端测试存根角度的服务。我想与配置做到这一点，而不是改变任何code ...

How can I configure an angular app to use stub services on one server and real on another? I want to host my app on a super cheap php web server for demoing to a stakeholder. I could stub the external rest services but I haven't written any php for years and don't really want to. I would prefer to use stub angular services that can also be used for end to end tests. I want to do this with config rather than changing any code...

推荐答案

您可以使用 $ provide.value（...）在配置（...）块来实现：

You can use $provide.value(...) in your config(...) block to achieve this:

angular.module('stub', []). // <- module that holds mock service
  factory('appServiceMock', function() { // <- mock for appService that will be defined in app module
    return {
      getName: function() {
        return 'Mock Service';
      }
    }
  });

angular.module('app', ['stub']). // <- define app module depends on stub module
  factory('appService', function() {
    return {
      getName: function() {
        return 'Real Service';
      }
    }
  }).
  config(function($provide, appServiceMockProvider) { // <- only providers and constants may be injected to config block. appServiceMockProvider - is created by Angular automatically when you define factory('appServiceMock', ...).
    $provide.value('appService', appServiceMockProvider.$get()); // <- get mock service from provider
  }).
  controller('appController', function($scope, appService) { // <- no changes in controller definition 
    $scope.name = appService.getName(); // <- will return 'Mock Service'
  });

Plunker： http://plnkr.co/edit/b3vIh6aCGNami2m0Bgrz?p=preVIEW

有关你的测试，你可以做同样的事情（的注意：你应该包括角mocks.js 来可以使用模块（...）和注入（...）在测试的）：

For your tests you can do the same thing (NOTE: you should include angular-mocks.js to be able to use module(...) and inject(...) in your tests):

describe('Test Scope', function() {

    beforeEach(function(){
        module('app', function($provide) {
            $provide.value('appService', {
                name: 'Mock Service'
            });
        });
    });

    it('should do something', inject(function(appService) {
        expect(appService.name).toBeDefined();
    }));
});

此外它AngularJS提供了很多嘲笑为它服务的。你只需要包括角mocks.js ，它会覆盖一些棱角内置IT服务，并会增加一些其他有用的东西。例如，如果你使用 $ HTTP 来访问远程REST服务比你可以使用 $ httpBackend 来嘲笑他们：

Besides of it AngularJS provides a lot of mocks for its services. You just need to include angular-mocks.js and it will override some angular built-it services and will add some other useful stuff. For example, if you use $http to access remote REST services than you can utilize $httpBackend to mock them:

it('should check REST service', inject(function($httpBackend, appServiceThatUseHttp) {
    var response;
    $httpBackend.resetExpectations();
    $httpBackend.expect('GET', 'http://www.test.com/v1/things').respond({things: ['thing 1', 'thing 2']});
    response = appServiceThatUseHttp.getThings(); // <- Assume that service puts parsed response body into it's property named data
    $httpBackend.flush();
    expect(response.data.things.length).toBe(2);
}));

这篇关于Angularjs配置为使用嘲笑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！