Question

我有一个Angular应用程序，它有一个非常简单的指令，现在叫做animate。我试图检查使用Jasmine是否调用方法slideDown。目前我的指令如下：

animateDirective

var animate = function () {
    return function (scope, element, attrs) {
        scope.$watch(attrs.animate, function () {
            element.slideDown(200);
        })
    }
}

应用

var app = angular.module("app", []);

app.controller("homeController", homeController);
app.directive("animate", animate);

在我的单元测试文件中，我检查了所有引用都是正确的，并且我已经在浏览器中测试了该指令。到目前为止，这是我的单元测试类：

animateDirectiveUnitTests

describe("animateDirective", function () {
    var $compile;
    var $scope;
    var template = "<p animate></p>";
    var isolateScope;

    function createDirective() {
        var directiveElement = angular.element(template);
        $compile(directiveElement)($scope);
        $scope.$digest();

        return directiveElement;
    }

    beforeEach(function () {
        module("app");
        inject(function (_$compile_, _$rootScope_) {
            $compile = _$compile_;
            $scope = _$rootScope_.$new();
        });
    });

    it("should call slideDown", function () {
        var element = createDirective();

        spyOn(element, "slideDown");

        expect(element.slideDown).toHaveBeenCalled();
    })
});

我从测试结果中得到的错误信息是：＆＃34;预期的间谍slideDown已被调用＆＃34;。我也试过改变我的测试来引用jQuery对象，但是我得到了同样的错误：

var element = createDirective();

spyOn($.fn, "slideDown");

expect($.fn.slideDown).toHaveBeenCalled();

我不确定为什么这不会作为通话注册。是否有可能做到这一点？如果是这样的话，我会感谢一些关于让它发挥作用的指导。感谢

Answer 1

您的测试用例的流程似乎有误。

var element = createDirective();

spyOn($.fn, "slideDown");

expect($.fn.slideDown).toHaveBeenCalled();

在这段代码中，在创建间谍和检查期望之间没有任何东西可以执行 - 因此没有任何东西可以调用slideDown。

该怎么称为slideDown？您应首先创建元素，将间谍放在其上，然后然后触发最终调用slideDown的更改 - 完成所有这些后，按此顺序，您应该能够满足这样的期望测试

JavaScript单元测试：无法检查是否调用了jQuery方法

1 个答案: