Question

如何在angularjs中单元测试指令的$ destroy事件？

我的指令中有代码：

scope.$on('$destroy', function () {
    //clean something
});

我的测试代码：

it('on destroy',function(){
    scope.$destroy();
    scope.$digest();

    //expect everything done?
});

任何建议！

Answer 1

您应该测试在$destroy事件中执行的代码。这是一个使用控制器的人为例子：

<强>测试

it('sets destroyed to true when the scope is destroyed', function() {
  // Arrange
  $scope.destroyed = false;

  // Act
  $scope.$destroy();

  // Assert
  expect($scope.destroyed).toBe(true);
});

<强>控制器

app.controller('MainCtrl', function($scope) {
  $scope.$on('$destroy', function() {
    $scope.destroyed = true;
  });
});

Plunker here。

Answer 2

您可以从指令的模板中选择DOM并获取其范围，然后运行$ destroy（）。

前：

你的tpl：

"<div id='tuna'></div>"

你的考试：

it('test on destroy', function(){
  var isolateScope = $(element).find('#tuna').eq(0).scope();
  isolateScope.$destroy();
})

希望能帮到你！

Answer 3

Angular的isolateScope比使用jQuery更可取。您可能已经在测试之上的beforeEach中编译了元素，如下所示：

myEl = '<div my-el>MY EL</div>';
scope = $rootScope.$new();
directiveElement = $compile(myEl)(scope);
scope.$digest();

现在，在测试中，您可以访问isolateScope并致电$destroy：

var isolated = directiveElement.isolateScope();
isolated.$destroy();

Answer 4

以下是我的工作：

var destroyed = spyOn(scope, '$destroy').and.callThrough();
scope.$destroy();
expect(destroyed).toHaveBeenCalled();

与其他答案不同，我不必创建只对测试有意义的 flag 变量，而且，使用Jasmine spyOn和callThrough检查函数是否更有意义$ destry正在成功调用。

如何测试破坏范围

4 个答案: