使用引导弹出窗口的测试指令

Question

我有使用引导程序弹出框的指令。设置变量时会弹出：

if (newValue.show === true) {
     element.popover('show');
}

如何使用 karma/jasmine 测试进行间谍测试？

我试过了：

    spyOn(element, 'popover');



    it('should call bootstrap method popover', function () {
    $scope.$apply(function() {
        $scope.value.show = true;
    });
    expect(element.popover).toHaveBeenCalled()
});

但我得到错误：

    Expected spy popover to have been called.
    Error: Expected spy popover to have been called.

Answer 1

我不相信这是最好的方法，但我能够通过将元素存储在范围内并以这种方式监视它来使其工作。

在你的指令中

scope.element = element;
if (newValue.show === true) {
 scope.element.popover('show');
}

在你的规范中

spyOn(scope.element, 'popover')

...

it('should call bootstrap method popover', function () {
  $scope.value.show = true;
  $scope.$digest();//Or use your $scope.$apply 

  expect(scope.element.popover).toHaveBeenCalledWith('show');
});

希望对您有所帮助。

更新

popover 是一个附加到$.fn 的 jQuery 插件，因此我们可以监视它。 https://gist.github.com/danmillar/1930277#file-bootstrap-popover-js-L160

it('should call bootstrap method popover', function () {
  spyOn($.fn, 'popover');
  $scope.value.show = true;
  $scope.$digest();//Or use your $scope.$apply
  expect($.fn.popover).toHaveBeenCalledWith('hide');
});

这是一个很好的解释为什么你不能听元素 https://stackoverflow.com/a/6198122/3403178