Angular 1.5单元测试控制器,需要父组件的控制器

Question

我正在尝试对AngularJS 1.5(带有Webpack)组件的(子)控制器进行单元测试,该组件需要父组件和来自另一个模块的控制器.

子控制器结构:

function ChildController () {
  var vm = this;

  vm.searchText = '';

  vm.submit = function() {
    var data = {};
    data['srch'] = vm.searchText;
    vm.parentCtrl.submitTextSearch(data);
  };
}

module.exports = ChildController;

子组件:

var template = require('./child.html');
var controller = require('./child.controller');

var childComponent = {
  require: {
    parentCtrl: '^parent'
  },
  template: template,
  controller: controller,
  controllerAs: 'vm'
};

module.exports = childComponent;

所以我想要做的是模拟childController的submit() - 函数所需的parentCtrl.我一直无法找到如何实际做到这一点.我已经找到了一些类似的子父指令解决方案并尝试了这些解决方案,例如通过假子HTML元素注入父控制器,如此子父指令示例中所述,基本上相同的stackoverflow解决方案没有结果.我的问题至少在于子控制器和父控制器位于不同的模块中.而且我认为范围技巧并不是Angular 1.5风格的那么多？

我的Jasmine测试的骨架没有我失败的模拟尝试:

describe('child component', function() {
  describe('child controller', function() {
    var controller;
    beforeEach(angular.mock.module('child'));
    beforeEach(inject(function(_$componentController_) {
      controller = _$componentController_('child');
    }))
    it('should work', function() {
      controller.searchText = "test";
      controller.submit();
    })
  })
})

这导致了TypeError: Cannot read property 'submitTextSearch' of undefined.我该怎样做才能模拟父控制器？由于我在Angular的经验有限,我没有想法.

Answer 1

在您的情况下，您将添加parentCtrl为组件的依赖项，因此为了测试它，您还必须模拟父组件并将其分配给控制器。所以你需要做类似的事情：

beforeEach(inject(function(_$componentController_) {
  controller = _$componentController_('child');
  parentCtrl = _$componentController_('parent');
  controller.parentCtrl = parentCtrl;
}))