Question

我想模仿angular.element。我希望确保angular.element被调用了一定次数并且anguler.element.attr也被调用了。

我有以下代码：

var things = $scope.getThings();

for (var i = 0; i < things.length; i++) {
  if (things[i].type == "xyz") {
    angular.element("#thing-" + things[i].id)
      .attr("foo", things[i].bar);
  };
};

在我的测试中，我有：

var things = [
  {
    id: 1,
    type: "xyz",
    bar: 10
  },
  {
    id: 2,
    type: "abc",
    bar: 33
  }
];

spyOn($rootScope, "getThings").and.returnValue(things);
spyOn(angular, "element").and.returnValue();

$rootScope.doThings(); // call controller method

expect(angular.element.calls.count()).toBe(1);

但它会出现以下错误：

TypeError：undefined不是对象（评估 'angular.element（“＃thing-”+ things [i] .id）.attr'）

我也希望我的测试有类似的东西：

expect(angular.element.attr.calls.count()).toBe(1);
expect(angular.element.attr).tohaveBeenCalledWith("foo", things[0].bar);

Answer 1

尝试添加此代码：

var spy;

beforeEach(function() {
    spy = spyOn(angular, 'element').....
});

afterEach(function() {
    spy.andCallThrough();
});

您可以在Jasmin docs

中找到更多信息

Answer 2

链接方法应该被监视或嘲弄的方式完全取决于它们在间谍对象上的定义方式。

对于Angular jqLite，或者在您的情况下，jQuery（两者都通过angular.element facade透明地提供）链接方法在构造函数原型上定义，它在工厂函数中公开为angular.element.prototype或jQuery.prototype（加载jQuery时angular.element === jQuery）。

为了监视angular.element和angular.element(...).attr，它应该是：

spyOn(angular, 'element').and.callThrough();
spyOn(angular.element.prototype, 'attr').and.callThrough();
...
expect(angular.element).toHaveBeenCalled();
expect(angular.element.prototype.attr).toHaveBeenCalled();

在这种情况下，

callThrough很重要，否则整个链应该手动存根。

茉莉模拟链式方法与Karma和Angular

2 个答案: