用catch和_throw误差逻辑测试角4_throw

Question

我让服务使用HttpClient使用POST请求，如果服务器响应并出错，我需要捕获它格式化消息并重新抛出它。我试过测试这个场景，但没有模拟测试。HttpTestingController没有将我的自定义错误消息发回，也没有在服务上捕获它并重新抛出它，那么如何做才是正确的呢？

服务代码：

 login(credentials: LoginPayload): Observable<LoginSuccessPayload> {

      return this.http.post<LoginSuccessPayload>('/api/auth/signin', credentials)
             .map(res => {authUser: res.user})
             .catch((error: HttpErrorResponse) => {
                if (error.message) {
                    return _throw(error);
                }
                return _throw({message: 'Notification.LoginError'});
             });

 }

现在是测试

beforeEach(() => {
    TestBed.configureTestingModule({
        imports: [HttpClientTestingModule],
        providers: [AuthService]
    });

    authService = TestBed.get(AuthService);
    httpMock = TestBed.get(HttpTestingController);
});

it('should format the error message', (done) => {
    const credentials = {userName: 'bob', password: '123'} as LoginPayload;
    const mockErrorResponse = {message: 'failed to login'} ;

    authService.login(credentials).subscribe(() => {}, err => {
        expect(err.message).toEqual(mockErrorResponse.message);
        done();
    });

    const req = httpMock.expectOne('/api/auth/signin');
    req.error(new ErrorEvent(mockErrorResponse.message));

    httpMock.verify();
});

Answer 1

我知道我要迟到了，但我想无论如何我都会回答那些像我一样遇到这种事的人。我发现围绕这个错误情况的完整的缺乏文件在angular.io上是疯狂的。“自己想办法”，我猜？

我采用的Anyway...the方法是完全避免使用.error()，因为它似乎不像使用.flush()那么容易，文档中的状态可以用于成功的和不成功的响应。

下面是我将如何更新您的代码以使用刷新：

it('should format the error message', (done) => {
    const credentials = {userName: 'bob', password: '123'} as LoginPayload;
    const mockErrorResponse = {message: 'failed to login'} ;

    authService.login(credentials).subscribe(() => {}, err => {
        // NOTE: err.error.message
        expect(err.error.message).toEqual(mockErrorResponse.message);
        done();
    });

    const req = httpMock.expectOne('/api/auth/signin');
    req.flush({message: mockErrorResponse.message}, {status: 400, statusText: ''});

    httpMock.verify();
});

与@angular/common/http中的Http (而不是@angular/http中的Http)相比，使用@angular/common/http中的err.error更新的一个令人讨厌的部分是，错误消息现在是subscribe()中err.error的属性，而不是err本身的属性。

因此，如果您和我一样，并且从一个升级到另一个，那么所有对err.message的引用都必须更新为err.error.message。我希望这能帮到你。

Answer 2

我有一些对我有用的建议。

首先，我要替换这个：

authService = TestBed.get(AuthService);
httpMock = TestBed.get(HttpTestingController);

在这方面：

const testBed = getTestBed();
authService = testBed.get(AuthService);
httpMock = testBed.get(HttpTestingController);

我认为这里的要点是，您无法真正访问测试床。

我还想核实一下，您的请求是POST请求，包括以下内容：

expect(req.request.method).toBe("POST");

这些是我第一次想到的东西。

Answer 3

我尝试了链接的角度文档方法，它使用req.error对我起作用。希望这有帮助..。

it('should handle an error', inject([HttpClient, HttpTestingController], (http: HttpClient, httpMock: HttpTestingController) => {

    http.get<any>('http://localhost:4200/api/data').subscribe(
        response => fail('should fail with a 403 error'),
        error => {
            expect(error.status).toBe(403);
        }
    );

    // Mocking rejects with a 403 error
    let mockRequest = httpTestingController.expectOne(req =>  
                        req.url === 'http://localhost:4200/api/data');
    let error = new ErrorEvent('ERROR');
    mockRequest.error(error, { status: 403 ,statusText: 'Invalid access.'});

    mockHttp.verify();
}));