Question

我是茉莉花测试的新手。如何在watch功能中测试函数调用？

以下是我的代码。我对茉莉花中间谍的使用感到困惑，我如何在观察者中处理函数调用。

我是否需要在watch中暂停fetch（）。请建议如何提高我的测试技能。

var app = angular.module('instantsearch',[]);
    app.controller('instantSearchCtrl',function($scope,$http,$sce){
    $scope.$sce=$sce;
    $scope.$watch('search', function() {
      fetch();
    });
    $scope.search = "How create an array";
    var result = {};
     function fetch() {
        $http.get("https://api.stackexchange.com/2.2/search?page=1&pagesize=10&order=desc&sort=activity&intitle="+$scope.search+"&site=stackoverflow&filter=!4*Zo7ZC5C2H6BJxWq&key=DIoPmtUvEkXKjWdZB*d1nw((")
        .then(function(response) {
           $scope.items = response.data.items;
           $scope.answers={};
            angular.forEach($scope.items, function(value, key) {
                var ques = value.question_id;
                $http.get("https://api.stackexchange.com/2.2/questions/"+value.question_id+"/answers?page=1&pagesize=10&order=desc&sort=activity&intitle="+$scope.search+"&site=stackoverflow&filter=!9YdnSMKKT&key=DIoPmtUvEkXKjWdZB*d1nw((").then(function(response2) {                                                                                                                                                   
                    $scope.answers[ques]=response2.data.items;  
                    //console.log(JSON.stringify($scope.answers));
                });
            });
        });                                                                                                                                                                                                                                             
     }
});

我的测试用例：

describe('instantSearchCtrl', function() {
  beforeEach(module('instantsearch'));

 var $scope, ctrl;

 beforeEach( inject(function($rootScope, $controller) {
      // create a scope object for us to use.
      $scope = $rootScope.$new();


      ctrl = $controller('instantSearchCtrl', {
        $scope: $scope
      });

  }));

      /*var $scope = {};
      var controller = $controller('instantSearchCtrl', { $scope: $scope });
       expect($scope.search).toEqual('How create an array');
      //expect($scope.strength).toEqual('strong');*/
 it('should update baz when bar is changed', function (){

    //$apply the change to trigger the $watch.
    $scope.$apply();
    //fetch().toHaveBeenCalled();

    fetch();
  it(" http ", function(){
  //scope = $rootScope.$new();
        var httpBackend;
            httpBackend = $httpBackend;
            httpBackend.when("GET", "https://api.stackexchange.com/2.2/search?page=1&pagesize=10&order=desc&sort=activity&intitle="+$scope.search+"&site=stackoverflow&filter=!4*Zo7ZC5C2H6BJxWq&key=DIoPmtUvEkXKjWdZB*d1nw((").respond([{}, {}, {}]);
    });
});
});

Answer 1

首先你应该触发手表。为此，您应该更改搜索值，然后手动运行：$scope.$digest()或$scope.$apply()

为了完全测试fetch函数，你还应该模拟对第二个请求的响应（如果你想测试迭代，则模拟所有第二级请求的模拟）。

之后你应该添加一些expect语句。对于控制器代码，它们应该是：

expect($scope.items).toEqual(mockResponseToFirstRequest);
expect($scope.answers).toEqual(mockResponseCombinedForSecondLevelRequests);

至于在karma-jasmine测试中使用间谍，那些限制了测试代码的数量。在这种情况下，间谍的合理用途是将httpBackend.when替换为spyOn($http, 'get').and.callFake(function () {})

以下是使用间谍https://jasmine.github.io/2.0/introduction.html#section-Spies

的文档

茉莉花测试函数调用

1 个答案: