我使用茉莉花与羯磨测试我的应用程序建立在角度。
我必须测试一个加载用户数据的服务，我使用$ httpBackend来模拟响应。
但是，当我运行测试时，我有两个错误：
>错误：无待处理的请求冲洗！
>错误：不满意的请求：GET https://api.github.com/users/wilk
模块：
'use strict';
app.service ('UserService',['$resource','$q','GITHUB_API_URL',function ($resource,$q,GITHUB_API_URL) {
var userResource = $resource (GITHUB_API_URL + '/users/:user',{user: '@user'}),userModel = {};
return {
data: function () {
return userModel;
},populate: function (user) {
var deferred = $q.defer (),userRequest = userResource.get ({user: user});
$q
.when (userRequest.$promise)
.then (function (data) {
userModel = data;
deferred.resolve (data);
});
return deferred.promise;
}
};
}]);
测试：
'use strict';
describe ('Service: UserService',function () {
beforeEach (module ('myApp'));
var $appInjector = angular.injector (['myApp']),UserService = $appInjector.get ('UserService'),GITHUB_API_URL = $appInjector.get ('GITHUB_API_URL'),GITHUB_USER = $appInjector.get ('GITHUB_USER'),$httpBackend;
beforeEach (inject (function ($injector) {
$httpBackend = $injector.get ('$httpBackend');
$httpBackend
.when ('GET',GITHUB_API_URL + '/users/' + GITHUB_USER)
.respond ({
login: GITHUB_USER,id: 618009
});
}));
afterEach (function () {
$httpBackend.verifyNoOutstandingExpectation ();
$httpBackend.verifyNoOutstandingRequest ();
});
describe ('when populate method is called',function () {
it ('should returns user data',function () {
$httpBackend.expectGET (GITHUB_API_URL + '/users/' + GITHUB_USER);
UserService.populate (GITHUB_USER);
$httpBackend.flush ();
expect(UserService.data ()).toEqual ({
login: GITHUB_USER,id: 618009
});
});
});
});
我们假设GITHUB_API_URL等于’https://api.github.com/‘，GITHUB_USER等于’wilk’。
我正在使用Karma-Jasmine 0.1.5和AngularJS 1.2.6进行测试(使用角度模式和场景1.2.6)。
这段代码有什么问题？
我们分别讨论每个错误：
错误：无待处理的请求冲洗！
这是因为没有通过$ httpBackend的请求，所以没有什么可以刷新。这是因为您在$ httpBackend之前实例化UserService，所以Angular不知道应该使用它而不是真正的$ http。如果您查看控制台，您将看到正在发送一个真实请求。
错误：不满意的请求：GET https://api.github.com/users/wilk
与上述相同的原因。由于$ httpBackend不被服务使用，所以您创建的期望从未满足。
考虑到以上所有之后，这是您的规格重构：
describe ('Service: UserService',function () {
var UserService,GITHUB_API_URL,GITHUB_USER,$httpBackend;
beforeEach(function() {
module('plunker');
inject(function( _$httpBackend_,_UserService_,_GITHUB_API_URL_,_GITHUB_USER_) {
$httpBackend = _$httpBackend_;
UserService = _UserService_;
GITHUB_API_URL = _GITHUB_API_URL_;
GITHUB_USER = _GITHUB_USER_;
});
});
afterEach (function () {
$httpBackend.verifyNoOutstandingExpectation ();
$httpBackend.verifyNoOutstandingRequest ();
});
describe ('when populate method is called',function () {
$httpBackend
.whenGET(GITHUB_API_URL + '/users/' + GITHUB_USER)
.respond ({
login: GITHUB_USER,id: 618009
});
UserService.populate(GITHUB_USER);
$httpBackend.flush();
expect(UserService.data().login).toBe(GITHUB_USER);
expect(UserService.data().id).toBe(618009);
});
});
});
注意：我已经改变了注入的方式，但是你所做的一切都很好，只要在其他任何事物之前创建$ httpBackend。
