当使用 sinon 进行单元测试时，我怎么知道我的控制器被调用了？

Question

Angular 单元测试的新手。我已经阅读了大量有关间谍、存根和模拟的内容，但在执行基础知识时遇到了很多麻烦：

• 我的控制器是否正确接收我传递给构造函数的服务？
• 是否在实例化时调用initializePage？
  

---

Controller.spec（很确定以下是必需的）

    'use strict';
    describe('Controller: MainController', function() {

      // load the controller's module
      beforeEach(module('myApp'));

      var MainController, scope;

      // Initialize the controller and a mock scope
      beforeEach(inject(function($controller, $rootScope) {
        scope = $rootScope.$new();
        MainController = $controller('MainController', { $scope: scope });
      }));

规范的其余部分：

it('should have called initializePage', function() {
        var spyInstance = sinon.spy(MainController, "initializePage");
        assert(spyInstance.called, "initializePage() was not called once");
      });
    });

我一直认为间谍就足够了，但我不确定MainController 是否正在被处决。目前spyInstance 抛出错误。 这里需要存根吗？为什么？

控制器

class MainController {
  constructor($scope, $http, $state, Session) {
    this.$scope = $scope;
    this.$state = $state;
    this.Session = Session;
    this.initializePage();
}

initializePage() {
//blah blah
}

谢谢。

---

修订： main.controller.spec.js

describe('Controller: MainController', function() {

  // load the controller's module
  beforeEach(module('scriybApp'));

  var mainControllerInstance, scope;

  // Initialize the controller and a mock scope
  beforeEach(inject(function($controller, $rootScope) {
    scope = $rootScope.$new();
    mainControllerInstance = $controller('MainController', { $scope: scope });
  }));

  it('should test the controller is in order', function() {
    assert.isFunction(mainControllerInstance.$onInit, "$onInit() has not been defined");

    sinon.spy(mainControllerInstance, "$onInit");
    assert(mainControllerInstance.$onInit.called, "$onInit() called = false");
  });




});

Answer 1

控制器测试在 Angular 中存在一些缺陷。主要是因为不可能监视只能作为类实例使用的类的构造函数（$controller(...) 的结果是）。当$controller(...) 被调用时，没有什么可窥探的，构造函数已经被调用，故事结束。

为此，除了 Angular 模块外，还应使用 ES6/CommonJS 模块来公开控制器类并监视原型方法。由于 ES6 已经在项目中使用，所以是

export class MainController { ... }

和

import { MainController } from '...';
...
scope = $rootScope.$new();
sinon.spy(MainController.prototype, 'initializePage');
mainControllerInstance = $controller('MainController', { $scope: scope });
assert(MainController.prototype.initializePage.called);
assert.strictEqual(mainControllerInstance.$scope, $scope);
...

但更重要的是，initializePage 重新发明了轮子。它的工作已经由 Angular 1.5 及更高版本中的 $onInit 生命周期钩子处理。它在指令编译时自动调用，可以作为预链接函数的替代。

$onInit 不会在控制器实例化时调用，但可以安全地假定它将在指令中，因此无需对其进行监视。它对测试更友好，测试变得

class MainController {
  constructor($scope, $http, $state, Session) {
    this.$scope = $scope;
    this.$state = $state;
    this.Session = Session;
  }

  $onInit() {
    //blah blah
  }
}

和

scope = $rootScope.$new();
mainControllerInstance = $controller('MainController', { $scope: scope });
assert.isFunction(mainControllerInstance.$onInit);
assert.strictEqual(mainControllerInstance.$scope, $scope);
...