Angular 2：MockBackend 返回“未定义”响应

Question

我正在尝试使用 MockBackend 为我的服务编写单元测试，并且每次收到未定义的响应。任何帮助，将不胜感激。 我已经检查了以下所有这些解决方案，与我的相比，我真的看不出有什么不同。

• Test Angular2 service with mock backend
• How to use MockBackend in Angular2

这是我的服务：

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { SomeObject } from './someObject';

@Injectable()
export class SomeService {

    private serviceUrl: string = 'http://localhost:8080/getObjects';  

    constructor( private http: Http ) { }

    getObjects() {
        return this.http.get( this.serviceUrl )
            .map(( response ) => response.json().content as SomeObject[])
    }
}

这是我的测试：

import { Http, BaseRequestOptions, Response, ResponseOptions } from '@angular/http';
import { TestBed, tick, fakeAsync, inject } from '@angular/core/testing';
import { MockBackend } from '@angular/http/testing';
import { SomeService } from './some.service';
import { SomeObject } from './someObject';

describe( 'SomeServiceTest', () => {

    let stubData: SomeObject[] = [
        new SomeObject( 1, "Title" )
    ];

    beforeEach(() => {
        TestBed.configureTestingModule( {
            providers: [
                SomeService,
                MockBackend,
                BaseRequestOptions,
                {
                    provide: Http,
                    useFactory: ( backend: MockBackend, options: BaseRequestOptions ) => {
                        return new Http( backend, options );
                    },
                    deps: [MockBackend, BaseRequestOptions]
                }
            ]
        });
    });

    it( 'should fetch data', inject( [SomeService, MockBackend], fakeAsync(( service: SomeService, mockBackend: MockBackend ) => {
        let res: SomeObject[];
        mockBackend.connections.subscribe( c => {
            expect( c.request.url ).toBe( 'http://localhost:8080/getObjects' );
            c.mockRespond( new Response( new ResponseOptions( {
                body: JSON.stringify( stubData )
            }) ) );
        });

        service.getObjects().subscribe(( response ) => {
            console.log( "response :: " + JSON.stringify( response ) ); // this is where I am seeing undefined
            res = response;
        });

        tick();

        expect( res[0].name ).toBe( 'Title' ); // this returns an exception TypeError: Cannot read property '0' of undefined
    }) ) );
});

Answer 1

我可能是错的，但我相信您的问题首先是您从您的服务返回response.json().content as Object[]。content 属性很可能未定义。我建议将您的响应映​​射到一个 json 对象并让您的组件处理它。

getObjects() {
    return this.http.get( this.dealsUrl )
        .map(( response ) => response.json());
}

然后

service.getSomeObjectsUsingObservable().subscribe(( response ) => {
    console.log( "response :: " + JSON.stringify( response ) );
    if (response.content){
        res = response as SomeObject[];
    }
    else {
        //- fail test
    }
});
tick();
expect( res[0].name ).toBe( 'Title' );

希望对你有帮助