Mit ngMock zu simulieren, $http calls im service unit-tests

Habe ich diese für Stunden. Ich habe versucht, Beispiel nach. Ich kann einfach nicht scheinen, um diese zu arbeiten. Bitte helfen =)

Ich Tue all dies auf einer sauberen Klon des angular-seed-repo (git://github.com/angular/angular-seed.git). Ich habe keine änderungen gemacht, außer die unten aufgeführten.

Problem:

Wenn ich den folgenden, der test funktioniert. Beachten Sie, dass in dieser version, der Dienst gibt einen Wert zurück, bevor Sie irgendeine Art von $http-Aufruf.

./app/js/services/services.js

'use strict';
angular.module('myApp.services', [])
  .factory("exampleService", function ($http) {
    return {value:"goodValue"};

    $http.get("/exampleUrl")
      .success(function () {
        return {value:"goodValue"};
      })
      .error(function () {
        return {value:"badValue"};
      })
  });

./test/unit/servicesSpec.js

'use strict';
describe('service', function() {
  var $httpBackend;

  beforeEach(module('myApp.services'));

  beforeEach(inject(function ($injector) {
    $httpBackend = $injector.get("$httpBackend");
    $httpBackend.when("GET", "/exampleUrl")
      .respond({value:"goodValue"});
  }));

  afterEach(function () {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

  describe('exampleService', function () {
    it('.value should be "goodValue"', inject(function (exampleService) {
      expect(exampleService.value).toEqual("goodValue");
    }));
  });
});

Ergebnisse

info (watcher): Changed file "/home/username/mocktest/test/unit/servicesSpec.js".
Chrome 26.0: Executed 5 of 5 SUCCESS (0.136 secs / 0.035 secs)

Wenn ich die Zeile entfernen return {value:"goodValue"}; und tatsächlich laufen lassen $http.get(), das ganze bricht mit der folgenden Fehler:

info (watcher): Changed file "/home/username/mocktest/app/js/services.js".
Chrome 26.0 service exampleService .value should be "goodValue" FAILED
  TypeError: Cannot read property 'value' of undefined
      at null.<anonymous> (/home/username/mocktest/test/unit/servicesSpec.js:22:28)
      at Object.invoke (/home/username/mocktest/app/lib/angular/angular.js:2864:28)
      at workFn (/home/username/mocktest/test/lib/angular/angular-mocks.js:1758:20)
  Error: Declaration Location
      at window.jasmine.window.inject.angular.mock.inject (/home/username/mocktest/test/lib/angular/angular-mocks.js:1744:25)
      at null.<anonymous> (/home/username/mocktest/test/unit/servicesSpec.js:21:40)
      at null.<anonymous> (/home/username/mocktest/test/unit/servicesSpec.js:20:3)
      at /home/username/mocktest/test/unit/servicesSpec.js:4:1
  Error: Unflushed requests: 1
      at Error (<anonymous>)
      at Function.$httpBackend.verifyNoOutstandingRequest (/home/username/mocktest/test/lib/angular/angular-mocks.js:1225:13)
      at null.<anonymous> (/home/username/mocktest/test/unit/servicesSpec.js:17:18)
Chrome 26.0: Executed 5 of 5 (1 FAILED) (0.14 secs / 0.043 secs)

Gedanken

Ich vermuten muss ich tun, irgendeine Art der Rückkehr von einem promise-Objekt in der service löst diese dann hinterher, aber ich habe keine Ahnung, was das sein würde. Jede Hilfe zu schätzen.

docs.angularjs.org/api/ngMock.$httpBackend Sie nicht, Spülen Sie die $httpBackend, so dass der $http-Aufruf eigentlich nie passiert.

InformationsquelleAutor | 2013-04-10

Ihre vermutete Lösung auf dem richtigen Weg war - Versprechungen wurden die-Taste, um den Fehler zu beheben/fehlgeschlagene tests.

Mit Ihrer ursprünglichen $http service bedingt Gegenzug den factory-Objekt hat nicht funktioniert, weil Sie waren effektiv, Rücksendung nichts von Ihrem factory-Funktion (durch die asynchrone Versprechen Auflösung von $http).

Als ich gerade dabei return vor Ihrem ursprünglichen $http.get() nennen. Das ist aber nicht das gewünschte Verhalten, da die AngularJS .factory Methode zurückgeben soll ein service-Objekt, das Sie definieren, nicht ein bloßes Versprechen zurück durch den Aufruf $http.

Die Lösung ist setzen Sie die Methode für Ihre exampleService Objekt genannt werden kann, die von Ihrer app. Dass getData() Methode gibt ein Versprechen (über $http), die Ihre app/test umgehen kann asynchron mit .success() oder .error()

./app/js/services/services.js

'use strict';
angular.module('myApp.services', [])
    .factory("exampleService", function ($http) {
        return {
            getData: function () {
                return $http.get("/exampleUrl");
            }
        }
  });

./test/unit/servicesSpec.js

'use strict';
describe('service', function() {
  var $httpBackend;

  beforeEach(module('myApp.services'));

  beforeEach(inject(function ($injector) {
    $httpBackend = $injector.get("$httpBackend");
    $httpBackend.when("GET", "/exampleUrl")
        .respond(200, {value:"goodValue"});
  }));

  afterEach(function () {
    $httpBackend.flush()
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

  describe('exampleService successful http request', function () {
    it('.value should be "goodValue"', inject(function (exampleService) {

        exampleService.getData().success(function(response) {
          expect(response.value).toEqual("goodValue");
        }).error( function(response) {
          //should not error with $httpBackend interceptor 200 status
          expect(false).toEqual(true);
        });

    }));
  });


});

Beachten Sie, dass Destron Kommentar über $httpBackend.flush() war auch wichtig, um das mock-backend abfangen $http.get() Anfrage von Ihrem service.

Hoffe, das hilft.

InformationsquelleAutor hardy101

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.