Question

我有一个带有以下代码片段的角度指令，我将如何对其进行单元测试？

 link: function($scope, iElm) {

            $(iElm).on('paste', function(){
                $timeout(function(){
                        $scope.lastScan = Date.now();
                    });
                }); 
            }

Answer 1

您需要使用$timeout.flush()，它会立即调用您定义的任何$timeout回调，因此它实际上会将其转换为同步代码以用于测试目的。

试试这个：

What is a plain English explanation of "Big O" notation?

<强> app.js

app.directive('myDirective', function($timeout){

  return function($scope, iElm) {

    // no need to use jQuery
    iElm.bind('paste', function(){
      console.log('**paste**')
      $timeout(function(){
        console.log('timeout')
        $scope.lastScan = Date.now();
      });
    }); 

    // $(iElm).on('paste', function(){
    //   $timeout(function(){
    //           $scope.lastScan = Date.now();
    //       });
    //   }); 

  }

});

<强> appSpec.js

describe("My directive", function() {

    var element,
        $timeout, $compile, $scope;


    // load the module that has your directive
    beforeEach(module('plunker'));

    beforeEach(inject(function(_$timeout_, _$compile_, _$rootScope_) {
        $timeout = _$timeout_;
        $compile = _$compile_;
        $scope   = _$rootScope_.$new();
    }));

    function compileElement(){

        // use $compile service to create an instance of the directive
        // that we can test against
        element = $compile('<my-directive></my-directive>')($scope);

        // manually update scope
        $scope.$digest(); 
    }


    it("defines a 'lastScan' property", function() {

        compileElement();

        // trigger paste event
        element.triggerHandler('paste');

        // angular doesn't know about paste event so need
        // to manually update scope
        $scope.$digest();

        // immediately call $timeout callback
        // thus removing any asynchronous awkwardness
        $timeout.flush();

        // assert that directive has added property to the scope
        expect($scope.lastScan).toBeDefined();
    });
});

AngularJs单元测试超时

1 个答案: