时间戳

首页 > 解决方案 > 由于打字，角度单元测试的模拟 Http 获取服务请求失败

angular - 由于打字，角度单元测试的模拟 Http 获取服务请求失败

问题描述

我再次尝试为 http get 请求编写测试，但由于数据类型而失败（至少这是我怀疑的）。

我要测试的请求有效，看起来像这样

  getTypeFilter(): Observable<Typefilter[]> {
    const url = this.endpoint.getEndpoint() + 'testdata/types?language=' + this.language;
    return new Observable<Typefilter[]>(observer => {
      this.httpc.get<any[]>(url).subscribe(
        (data) => {
          const resultData: Typefilter[] = [];
          for (const item of data) {
            resultData.push(new Typefilter(item.id, item.name));
          }
          observer.next(resultData);
          observer.complete();
        },
      );
    });
  }

我的测试文件的摘录看起来像这样

import { TestBed } from '@angular/core/testing';
import { DataService } from './data.service';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { UrlService } from 'src/app/_services/url.service';
import { Typefilter } from '../_classes/typefilter';

describe('DataService', () => {
  let httpMock: HttpTestingController;
  let service: DataService;
  let urlService: UrlService;
  let mockType: Typefilter;

  mockType = {id: 1, name: 'News'};

  beforeEach(() => {

    TestBed.configureTestingModule({
      imports: [ HttpClientTestingModule]
    });
    httpMock = TestBed.inject(HttpTestingController);
    service = TestBed.inject(DataService);
    urlService = TestBed.inject(UrlService);
    urlService.getEndpoint = () => ('http://someaddress/');
  });

  it('getTypeFilter - should return TypeFilter', () => {
    service.getTypeFilter().subscribe((data) => {
      expect(data).toEqual([mockType]);
    });
    const reqMock = httpMock.expectOne((req) => req.method === 'GET' && req.url === urlService.getEndpoint() + 'testdata/types?language=' + 'de');
    expect(reqMock.request.method).toBe('GET');
    reqMock.flush(mockType);
  });
});

但它因 “TypeError：msgtypefilterkriterium is not iterable”而失败——我确实理解这一点，因为我在请求中收到的数据是一个对象数组，而我的模拟数据只是一个对象。但是当我将这些数据模拟为一个数组时，我确实得到了错误：'预期 $[0] 是一种对象，但类型过滤器（{ id：1，名称：'News'}）。 谁能帮我解决这个问题？

标签： angularunit-testingtypeerror

解决方案

mockType是一个对象，而getTypeFilter迭代响应for (const item of data)。因此reqMock.flush也应该使用数组。

尝试reqMock.flush([mockType]);

关于类型问题，可以这样修复：

service.getTypeFilter().subscribe((data) => {
  expect(data).toEqual([new Typefilter(mockType.id, mockType.name)]);
});

推荐阅读