Angular 2:MockBackend 返回“未定义"响应 [英] Angular 2 : MockBackend returning 'undefined' response

问题描述

我正在尝试使用 MockBackend 为我的服务编写单元测试，每次我收到未定义的响应时.任何帮助，将不胜感激.我已经检查了下面的所有这些解决方案，与我的相比，我真的没有看到太大的差异.

I am trying to write up a unit test for my service using MockBackend and each time I get a response as undefined. Any help would be appreciated. I have checked all these solutions below and compared to mine I really don't see much differences.

• 使用模拟后端测试 Angular2 服务
• 如何在 Angular2 中使用 MockBackend

这是我的服务:

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
    }) ) );
});

推荐答案

我可能错了，但我相信您的问题是，首先，您将 response.json().content 作为 Object[] 来自您的服务.content 属性很可能是未定义的.我建议只将您的响应映​​射到 json 对象并让您的组件处理它.

I might be wrong, but I believe your issue is, first, that you are returning response.json().content as Object[] from your from your service.the content property is most likely undefined. I would suggest just mapping your response to a json object and having your component handle it.

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' );

希望能帮到你

这篇关于Angular 2:MockBackend 返回“未定义"响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！