$httpBackend.flush() 激活路由答案

【问题标题】：$httpBackend.flush() activates routing$httpBackend.flush() 激活路由
【发布时间】：2016-06-20 06:07:16
【问题描述】：

我想测试以下服务：

"use strict";

const BASE_API = APP_CONF.baseApi;

export default function() {
  "ngInject";

class API {

constructor() {
  this.loading = false;
}

logout() {
  this.loading = true;

  return $http.post(`${BASE_API}/logout`)
    .then(res => {
      this.loading = false;

      return res.data;
    }, err => {
      this.loading = false;

      throw err;
    });
}
}

return new API();

};

我的测试：

"use strict";

let baseApi = APP_CONF.baseApi;

describe("Auth service", function() {
 let Auth;

 beforeEach(angular.mock.module("app"));

 beforeEach(angular.mock.inject(function(_Auth_) {
   Auth = _Auth_;
 }));

 context("method LOGOUT", function() {
   let $httpBackend;

 beforeEach(angular.mock.inject(function(_$httpBackend_) {
   $httpBackend = _$httpBackend_;
   $httpBackend.whenPOST(`${baseApi}/logout`).respond(200, { data: "ok"});
 }));

 it("should change 'loading' flag", function() {
  Auth.logout();
  assert.isTrue(Auth.loading);
  $httpBackend.flush();
  assert.isFalse(Auth.loading);
 });

 });
});

但我的测试失败并出现以下错误：

Chrome 51.0.2704 (Linux 0.0.0) Auth service method LOGOUT should change 'loading' flag FAILED
    Error: Unexpected request: GET http://localhost:3000/api/mailboxes
    No more request expected

这个请求在路由被解析后被调用：

"use strict";

export function config($locationProvider, $stateProvider, $urlRouterProvider) {
  "ngInject";

  $urlRouterProvider.otherwise("404");
  $locationProvider.html5Mode(true);

  $stateProvider
   .state("404", {
     url: "/404",
     template: `<view-404 class="v-404" />`
    })
    .state("home", {
      url: "/",
      template: `<view-home class="v-home" />`,
      resolve: {
      mailboxes: function(MailboxesApi, MailboxesStore, $state) {
        "ngInject";

      return MailboxesApi.getAll() // THIS LINE ACTIVATES UNEXPECTED REQUEST
        .then(mailboxes => {
          MailboxesStore.set(mailboxes);

          let inbox = MailboxesStore.getByName("inbox");

          if (inbox) {
            $state.go("cabinet.mailbox", { mailboxid: inbox._id });
          } else {
            $state.go("cabinet.mailbox", { mailboxid: MailboxesStore.getByIndex(0)._id });
          }
        });
      }
     }
    });

  };

  export function run($transitions) {
    "ngInject";

    $transitions.onError({ to: "*" }, (ErrorHandler, $error$) => {
     "ngInject";

     ErrorHandler.handle($error$);
    });

   };

我注意到在我的测试中调用 $httpBackend.flush() 后，状态“home”被激活。为什么会这样？

我的依赖：

角度模拟 1.5.7
角1.5.6
angular-ui-router 1.0.0-alpha.5
业力 0.13.22
摩卡2.5.3
柴3.5.0

【问题讨论】：

标签： angularjs angular-ui-router karma-runner karma-mocha angular-mock

【解决方案1】：

在查看错误详细信息后，这似乎是正常的执行流程。在刷新 (/logout/) 之后，它会根据您的项目路由逻辑重定向到主视图。但是，当它到达家中时，它与邮箱 API 以及它期待更多的 httpbackend ( GET ) 模拟有关。

我认为您应该在测试用例中再添加一行，如下所示

$httpBackend.whenGET('url').respond(200, { data: "ok"});

【讨论】：