单元测试$ watch需要自己的指令

时间:2016-03-31 21:06:14

标签: angularjs unit-testing

我在对我的指令的监视方法进行单元测试时遇到了一些麻烦。该指令需要它自己的direcitive所以 ctrl 包含一个主要方法updateHeight

在我的控制器中我有一个方法

 this.updateHeight = function (clientHeight) {
    $rootScope.haGlobalAlerts.clientHeight = clientHeight;
};

在我的链接功能中,我称之为

 ctrl.updateHeight(el.clientHeight);

我有一个查看更改的$ watch方法

  $scope.$watch(function () {
    return el.clientHeight;
  },
    function (newHeight, oldHeight) {
        if (first || (newHeight !== oldHeight)) {
           first = false;
           ctrl.updateHeight(newHeight);
         }
    });

确定如何测试和模拟更改真的让我很困惑。在我的指令中,我创建了这样的范围......

 html = angular.element("<div global alerts> </div>")
 element = $compile(html)($rootScope);

 $rootScope = $rootScope.$new()

 // added this to get update height

 controller = element.controller('GlobalAlerts')

 //setting controller gives me access to controller.updateHeight().

 scope = element.scope();

范围无权访问此内容。我不知道如何打电话。

如果我打电话

controller.updateHeight() //It is not changing the value.

在我的测试中,我在范围

上调用 $ apply

范围。$ apply()

这是我的完整测试

 it("should update client Height", function () {

        expect(element[0].clientHeight).to.equal(0);
        var newHeight = 20;
        controller.updateHeight(newHeight);
        scope.$apply();
        expect(element[0].clientHeight).to.equal(20);
    });

0 个答案:

没有答案