Question

我有使用bootstrap的popover的指令。当设置变量时它变为弹出：

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

如何使用业力/茉莉花测试进行间谍测试？

我试过了：

    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

使用bootstrap popover的测试指令

1 个答案: