以$ rootScope和Angularjs单元测试$ httpBackend [英] Angularjs unit test with $rootScope and $httpBackend

问题描述

我有触发一个HTTP请求的服务。这个请求利用了$ rootScope.config对象（有存储在我的基本URL），但由于某些原因，当我使用$ httpBackend，$ rootScope未加载正确的。

I have a service which fires a HTTP request. This request makes use of the $rootScope.config object (there is my base url stored), but for some reason when I use $httpBackend, $rootScope is not loaded correct.

服务：

myAppServices.factory('Auth', function($rootScope, $http, $cookieStore){   
  return {
    logout: function(success, error) {
      $http.get($rootScope.config.apiUrl + '/users/logout').then(function(response){
      }, function(response) {
      });
    }

测试：

describe('services', function() {
  var Auth;
  var $httpBackend;
  var $cookieStore;
  var $rootScope;

  beforeEach(function() {
    module('myApp.services');
  });

  beforeEach(inject(function($injector) {
    $httpBackend = $injector.get('$httpBackend');
    $cookieStore = $injector.get('$cookieStore');
    $rootScope = $injector.get('$rootScope');
    Helper = $injector.get('Helper');
    Auth = $injector.get('Auth');
  }));

  afterEach(function() {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

describe('logout', function() {
  it('should make a request and invoke callback', function() {
    // I try to set $rootScope here, works in my other tests, but not in this test
    $rootScope = { config: { apiUrl: 'foo' } };

    var invoked = false;
    var success = function() {
      invoked = true;
    };
    var error = function() {};

    $httpBackend.expectPOST('/logout').respond();
    Auth.logout(success, error);
    $httpBackend.flush();
    $rootScope = { config: { apiUrl: 'foo' } };
    expect(invoked).toEqual(true);

它通常当我在我的测试设置$ rootScope为一定的价值，但不能在本次测试工作。

It normally works when I set $rootScope in my test to some value, but not in this test.

为什么是它$ rootScope没有在我的服务的配置属性，使用$当httpBackend？

Why is it that $rootScope does not have the config attribute in my service, when using $httpBackend?

推荐答案

有同名的两个不同的事情，引起混乱：

The problem:

There are two different things with the same name that cause confusion:

• 还有就是 $ rootScope （实际 $ rootScope 这是所有作用域的祖先，并通过注入角的依赖注入）。


• 还有一个名为一个局部变量 $ rootScope 您在测试套件的声明。

• There is the $rootScope (the actual $rootScope that is the ancestor of all Scopes and is injected through Angular's Dependency Injection).
• And there is a local variable named $rootScope that you declare in your test-suite.

为了清楚起见，我将把后者作为 $ rootScope {VAR} 。

For the sake of clarity, I will refer to the latter as $rootScope{var}.

下面是发生了什么：

1. 在某些时候， $ rootScope 将被注入到你的服务的构造（被制作时，在以后的使用了 $ HTTP 要求）。

1. At some point $rootScope will be injected into your service's constructor (to be used later on when making the $http request).

$ rootScope {VAR} 被初始化为 $ injector.get（'$ rootScope'）返回的值; 。结果
此时 $ rootScope 和 $ rootScope {VAR} 是在相同对象。

$rootScope{var} is initialized to the value returned by $injector.get('$rootScope');.
At this point $rootScope and $rootScope{var} are the same object.

这行： $ rootScope = {配置：{apiUrl：'富'}}; 创建一个新对象和受让人为 $ rootScope的值{VAR} 。结果
此时 $ rootScope 和 $ rootScope {VAR} 是不会同一个对象的任何更多。

This line: $rootScope = { config: { apiUrl: 'foo' } }; creates a new object and assigns it as the value of $rootScope{var}.
At this point $rootScope and $rootScope{var} are not the same object any more.

$ rootScope {VAR} 确实有一个配置属性，但您的服务将使用 $ rootScope ，它什么都不知道关于配置。

$rootScope{var} does have a config property, but your service is going to use $rootScope, which knows nothing about config.

为了给配置属性添加到实际的 $ rootScope 更改code是这样的：

---

The solution:

In order to add the config property to the actual $rootScope change your code like this:

$rootScope.config = { apiUrl: 'foo' };

这篇关于以$ rootScope和Angularjs单元测试$ httpBackend的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！