通过 watch 测试一个指令函数

Question

我在 angular 指令中有一个函数可以在手表上触发。我如何测试函数 scroll 的基于超时的滚动 activity 因为它不在范围内？

scope.$watch('elementId', function(value) {
    //How do i test scroll function contents?
    scroll(element, value);
});

function scroll (pE, element) {
   console.log('Here');
   $timeout(function afterTimeout () {
     var scrollTo = $('#' + element);
     var container = $(pE);
     container.animate({scrollTop : scrollTo[0].offsetTop - container[0].offsetTop - 10}, 'slow');
   }, 250);
}

详细代码在这里 http://jsfiddle.net/QGmCF/68/

Answer 1

我有一些建议来清理您的代码。首先要意识到的是，您应该将模拟 $timeout 对象注入到您的测试中并调用 $timeout.flush(251) 以确保您的代码运行。

像这样：

it('test watch', inject(function($compile, $rootScope, $timeout) {
    // as before
    $timeout.flush(251);
    // test that your code has run
}));

另一个建议：不要使用 jQuery 的 $ 对象，而是使用 $window.document 或 $document[0] 来访问浏览器的本机组件。有了这个，你可以这样写：

var scrollTo = $document[0].getElementById(element);

然后您不再需要使用 [0].

访问您的 scrollTo 元素

通过 watch 测试一个指令函数

Test a directive function through watch

jasmine

angularjs

angular-mock