Testowanie jednostki Sterownik AngularJS z $ httpBackend

Question

Dla mojego życia nie mogę uzyskać $ httpBackend do pracy na kontrolerze, który wykonuje żądanie HTTP. Próbowałem już wiele godzin =)

Sprowadziłem to do najprostszej formy, jaką mogę poniżej. Test przechodzi gdybym

• zakomentuj $ http.get() wniosek w kontrolerze
• komentarz formularz "httpMock.flush()" w teście
• i zmiana "świnia" i " pies "pasuje do

Oznacza to, że jest to ważny, działający test i aplikacja.

Jeśli włożę go ponownie, pojawia się błąd pokazany na dole.

---

APP/js/app.js

// Declare a module which depends on filters and services. 
var myApp = angular 
    .module('myApp', ['ngRoute', 'myApp.filters', 'myApp.services', 
           'myApp.directives']) 
    .config(['$routeProvider' , function($routeProvider) { 

    $routeProvider 
     .when("/dashboard", { 
     templateUrl: "partials/dashboard.html", 
     controller: cDashboard 
     }) 

     .otherwise({redirectTo: "/dashboard"}); 
    }]); 

// Pre-define our main namespace modules. 
angular.module('myApp.directives' , []); 
angular.module('myApp.filters' , []); 
angular.module('myApp.services' , []); 
angular.module('myApp.controllers', []); 

APP/js/controller.js

function cDashboard ($scope, $http) { 
    $scope.data = "dog"; 

    // Fetch the actual data. 
    $http.get("/data") 
    .success(function (data) { $scope.data = data }) 
    .error(function() {}); 
} 

cDashboard.$inject = [ '$scope', '$http' ]; 

test/jednostka/controllerSpec.js

describe('cDashboard', function(){ 
    var scope, ctrl, httpMock; 

    beforeEach(inject(function ($rootScope, $controller, $http, $httpBackend) { 
    scope = $rootScope.$new(); 
    ctrl = $controller('cDashboard', {$scope: scope}); 

    httpMock = $httpBackend; 
    httpMock.when("GET", "/data").respond("pig"); 
    })); 

    it("should get 'pig' from '/data'", function() { 
    httpMock.expectGET("/data").respond("pig"); 
    expect(scope.data).toBe("pig"); 
    }); 

}); 

A to błąd pojawia się w powłoce:

INFO [watcher]: Changed file "/home/myApp/test/unit/controller/cDashboard.js". 
Chrome 26.0 (Linux) cDashboard should get 'pig' from '/data' FAILED 
    Error: No pending request to flush ! 
     at Error (<anonymous>) 
     at Function.$httpBackend.flush (/home/myApp/test/lib/angular/angular-mocks.js:1171:34) 
     at null.<anonymous> (/home/myApp/test/unit/controller/cDashboard.js:15:18) 
Chrome 26.0 (Linux): Executed 1 of 1 (1 FAILED) (0.326 secs/0.008 secs) 

Answer 1

Istnieje kilka problemów w kodzie testowym:

1. Regulator jest tworzone przedhttpMock jest skonfigurowane do odpowiedzieć pig. Wywołanie expectGet powinno nastąpić przed utworzeniem kontrolera.
2. W httpMock potrzeby opróżnić zażądania
3. httMock.when jest konieczne tak długo, jak masz expectGet

przykład robocza: http://plnkr.co/edit/lUkDMrsy1KJNai3ndtng?p=preview

describe('cDashboard', function(){ 
    var scope, controllerService, httpMock; 

    beforeEach(inject(function ($rootScope, $controller, $httpBackend) { 
    scope = $rootScope.$new(); 
    controllerService = $controller; 
    httpMock = $httpBackend; 
    })); 

    it("should get 'pig' from '/data'", function() { 
    httpMock.expectGET("/data").respond("pig"); 
    ctrl = controllerService('cDashboard', {$scope: scope}); 
    httpMock.flush(); 
    expect(scope.data).toBe("pig"); 
    }); 
});