Angular 无法读取属性'；管道'；测试httpclient调用时未定义的

我正在尝试在ionic4应用程序中对我的一些代码进行单元测试。该代码调用端点，并将响应映射到一个对象。它还添加了一个tap，以便我可以将this.faults作为可观察的数据服务返回

fetchFaults(): Observable<Fault[]>
{
return this.http.get<{data: Fault[]}>('https://server/api/faults')
  .pipe(tap((data) => this.faults = data.data) // cache
      , map((data) => data.data)); // return just Fault[] from data.data to the subscriber
}

---

但是我得到一个错误，无法读取undefined的属性'pipe'，是否需要从httpstub返回任何内容？

以下是针对您的服务编写单元测试的正确方法

import { TestBed, fakeAsync, tick, getTestBed } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';

import { FaultService, Fault } from './fault.service';

describe('Program Service Tests', () => {
    let injector: TestBed;
    let service: FaultService;
    let httpMock: HttpTestingController;

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

        injector = getTestBed();
        service = injector.get(FaultService);
        httpMock = injector.get(HttpTestingController);
    });

    afterEach(() => {
        httpMock.verify();
    });

    it('should get the faults', fakeAsync(() => {
        const results = {data: []};

        service.fetchFaults().subscribe(_ => expect(results.data).toBe(_));

        const req = httpMock.expectOne((request: HttpRequest<any>): boolean => {
            expect(request.url).toEqual('https://server/api/faults');
            expect(request.method).toBe('GET');
            return true;
        });
        req.flush(results);
        tick();
    }));
});

从'@angular/core/testing'导入{TestBed，fakeAsync，tick，getTestBed}；
从“@angular/common/http/testing”导入{HttpClientTestingModule，HttpTestingController}；
从“/Fault.service”导入{FaultService，Fault}；
描述（'程序服务测试'，（）=>{
let注射器：试验台；
让服务：完美的服务；
让httpock:HttpTestingController；
在每个之前（（）=>{
TestBed.configureTestingModule({
导入：[HttpClientTestingModule]，
供应商：[
错误服务
]
});
注入器=getTestBed（）；
服务=喷油器.get（故障服务）；
httpMock=injector.get（HttpTestingController）；
});
之后（（）=>{
httpMock.verify（）；
});
它（'should get the faults'，fakeAsync（（）=>{
const results={data:[]}；
service.fetchFaults（）.subscribe（=>expect（results.data）.toBe（））；
const req=httplock.expectOne（（请求：HttpRequest）：布尔=>{
expect（request.url）.toEqual（'https://server/api/faults');
expect（request.method）.toBe（'GET'）；
返回true；
});
要求冲洗（结果）；
勾选（）；
}));
});

---

---

出现该错误的原因是您需要告诉spy调用原始实现。您可以通过链接

和.callThrough（）

来实现这一点。更好、更彻底的测试实现是我上面包含的代码。

下面是针对您的服务编写单元测试的正确方法

import { TestBed, fakeAsync, tick, getTestBed } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';

import { FaultService, Fault } from './fault.service';

describe('Program Service Tests', () => {
    let injector: TestBed;
    let service: FaultService;
    let httpMock: HttpTestingController;

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

        injector = getTestBed();
        service = injector.get(FaultService);
        httpMock = injector.get(HttpTestingController);
    });

    afterEach(() => {
        httpMock.verify();
    });

    it('should get the faults', fakeAsync(() => {
        const results = {data: []};

        service.fetchFaults().subscribe(_ => expect(results.data).toBe(_));

        const req = httpMock.expectOne((request: HttpRequest<any>): boolean => {
            expect(request.url).toEqual('https://server/api/faults');
            expect(request.method).toBe('GET');
            return true;
        });
        req.flush(results);
        tick();
    }));
});

从'@angular/core/testing'导入{TestBed，fakeAsync，tick，getTestBed}；
从“@angular/common/http/testing”导入{HttpClientTestingModule，HttpTestingController}；
从“/Fault.service”导入{FaultService，Fault}；
描述（'程序服务测试'，（）=>{
let注射器：试验台；
让服务：完美的服务；
让httpock:HttpTestingController；
在每个之前（（）=>{
TestBed.configureTestingModule({
导入：[HttpClientTestingModule]，
供应商：[
错误服务
]
});
注入器=getTestBed（）；
服务=喷油器.get（故障服务）；
httpMock=injector.get（HttpTestingController）；
});
之后（（）=>{
httpMock.verify（）；
});
它（'should get the faults'，fakeAsync（（）=>{
const results={data:[]}；
service.fetchFaults（）.subscribe（=>expect（results.data）.toBe（））；
const req=httplock.expectOne（（请求：HttpRequest）：布尔=>{
expect（request.url）.toEqual（'https://server/api/faults');
expect（request.method）.toBe（'GET'）；
返回true；
});
要求冲洗（结果）；
勾选（）；
}));
});

---

---

出现该错误的原因是您需要告诉spy调用原始实现。您可以通过链接

和.callThrough（）

来实现这一点。一个更好、更彻底的测试实现是我上面包含的代码。

为什么不使用HttpClientTestingModule？但是你的测试失败了，因为你的间谍没有返回任何东西，因此出现了错误。为什么不使用HttpClientTestingModule呢？但是你的测试失败了，因为你的间谍没有返回任何东西，因此出现了错误。再次感谢你，实际上我昨晚测试的是你的答案！我觉得自己像个孩子，让爸爸做作业。多谢各位@JaChNo-没问题，很乐意帮忙！再次感谢，事实上，昨晚我试着测试的是你的答案！我觉得自己像个孩子，让爸爸做作业。多谢各位@JaChNo-没问题，很乐意帮忙！