Angular 4 单元测试模拟后端创建未定义的答案

Question

我正在尝试使用角度测试此服务

export class LoginService implements OnInit {
private authUrl = 'http://localhost:8080/login';
private headers = new Headers({'Content-Type': 'application/json'});
constructor(private http: Http) {}
ngOnInit() {
}
login(username: string, password: string) {
let _sub = this.http.post(this.authUrl, JSON.stringify({username: username, password: password}))
.map((response: Response) => {
let token = response.json()['Token'];
let role = response.json()['Role'];
if (token) {
localStorage.setItem('currentUser', JSON.stringify({username: username, token: token, role: role}));
return true;
} else {
return false;
}
}).catch((error: any) => Observable.throw(error.json().error || 'Server error'));
return _sub;
}
getToken(): String {
let currentUser = JSON.parse(localStorage.getItem('currentUser'));
let token = currentUser && currentUser.token;
return token ? token : '';
}
logout(): void {
localStorage.removeItem('currentUser');
}
isLoggedIn(): boolean {
let token: String = this.getToken();
return token && token.length > 0;
}

我创建了一个应该是 JSON 的模拟后端响应，但响应未定义

describe('LoginService', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [HttpModule],
providers: [
MockBackend,
BaseRequestOptions,
{ provide: XHRBackend, useClass: MockBackend },
LoginService,
]
});
});

it('should set the token,user and role', inject([LoginService,XHRBackend], (service,mockBackend)=>{
const mockResponse= {
role:'mockRole',
user:'mockUser',
token:'mockToken'
};
mockBackend.connections.subscribe((connection)=>{
connection.mockRespond(new Response(new ResponseOptions({
status:200,
body:JSON.stringify(mockResponse)
})));
}); 
console.log(mockBackend);
service.login('mockuser','mockpassword').subscribe((response)=>
{console.log(response.json);}
);
expect(service.isLoggedIn()).toEqual(true);
}));

据我从日志中可以看出，模拟后端已正确注入登录服务并注册了响应

Answer 1

您的login方法放置了一个更改boolean响应的map运算符，您唯一能够从可观察login()中获得的就是true或false。

话虽如此，boolean.json不能成为财产，所以你会得到undefined，尝试console.log(response)而不是console.log(response.json)，你可能会有true或false。