Question

尝试测试我的一项服务时出现错误。

该服务具有一种方法，该方法在服务器上发出POST请求，然后返回数据，是的，我知道为什么是POST而不是GET。

我需要说我不能使用身份验证服务，因为使用登录名然后从服务器获取令牌。由于我无法登录以获取令牌，因此所有请求均无效。

仅使用模拟服务器响应的本地数据，如何在不向服务器发出请求的情况下对HTTP调用进行单元测试。

我的服务就是这个。

inventory.service.ts

  /**
   * GETS THE INVENTORY DATA.
   * @returns Observable of inventory data from the server.
   */
  getInventoryData<T>() {

    const options = { headers: this.getHeaders() };
    const body: AdditionFiltersEntity = this.shared.getAdditionFilters({});
    const url = `${this.shared.baseUrl}/inventory`;

    return this.http.post(url, body, options).pipe(
      tap(val => console.log(`BEFORE MAP: ${val}`)),
      map(res => res.json()),
      catchError(e => this.shared.handleError(e))
    );

  }

问题是因为我有catchError(e => this.shared.handleError(e)) 这将检查响应是否在我的情况下有错误，我的状态信息为“ UNAUTHORIZED”

就我而言，在所有HTTP测试中，我一直都遇到这种类型的错误。

状态：401，确定：否，状态文本：“未经授权” 但这没关系，因为我正在单元测试中，我无法通过授权部分。

我的单元测试文件是这个。

inventory.service.spec.ts

import { TestBed, async, inject } from '@angular/core/testing';

// Modules
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HttpModule } from '@angular/http';
import { MatSnackBarModule } from '@angular/material';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { HttpClientModule } from '@angular/common/http';
import { RouterTestingModule } from '@angular/router/testing';

// Services
import { InventoryService } from './inventory.service';
import { HelpersService } from '@app-services/helpers/helpers.service';
import { MediatorService } from '@app-services/mediator/mediator.service';
import { AuthService } from '@app-services/auth/auth.service';
import { StorageService } from '@app-services/storage/storage.service';

// Models
import { InventoryEntity } from '@app-models/inventory';



describe('InventoryService', () => {

  // let service: InventoryService;
  let httpMock: HttpTestingController;
  let auth: AuthService;
  // let user: User;

  beforeEach(() => {

    TestBed.configureTestingModule({
      imports: [ HttpModule, MatSnackBarModule, RouterTestingModule, HttpClientModule,
      HttpClientTestingModule, BrowserAnimationsModule
    ],
      providers: [
        InventoryService, AuthService, HelpersService, MediatorService, StorageService
      ]
    });


    httpMock  = TestBed.get(HttpTestingController);
    auth      = TestBed.get(AuthService);
    localStorage.setItem('store_ids', JSON.stringify([1])); // just set a test id so we gonna get some kind data.

  });


  beforeEach(async(() => {
    TestBed.compileComponents().catch(error => console.error(error));
  }));

  it('should be created', inject([InventoryService], (service: InventoryService) => {
    expect(service).toBeTruthy();
  }));

  // This is where I get the errors
  fit('Should get inventory data', inject([InventoryService], async (service: InventoryService) => {

    await service.getInventoryData().subscribe( (res: InventoryEntity[]) => {

      // get array first element keys.
      const evaluationKeys = ['brand', 'color_code', 'color_tag', 'family', 'frame_size', 'gender', 'provider', 'quantity', 'tag'];
      const keys = Object.keys(res[0]);

      expect(keys).toEqual(evaluationKeys);

    });

  }));


});

有人可以向我解释如何对像这样的HTTP调用进行单元测试 service.getInventoryData().subscribe
以及如何处理身份验证部分。身份验证是我所有测试失败的地方。
如果我需要使用模拟数据，该如何做，有人可以给我看个例子吗？

响应应该给我这些数据。

[
  {
    'brand': 'brand-1',
    'color_code': '593',
    'color_tag': 'SILVER',
    'family': 'SOL',
    'frame_size': '54x16x140',
    'gender': 'Unisexe',
    'provider': 'hgg',
    'quantity': 82,
    'tag': '44554'
  }, {
    'brand': 'brand-2',
    'color_code': 'MAU1O1',
    'color_tag': 'BLACK',
    'family': 'SOL',
    'frame_size': '54x17x140',
    'gender': 'Unisexe',
    'provider': 'hgg',
    'quantity': 98,
    'tag': '45445'
  }
]

Answer 1

如注释中所建议，在单元测试时，您不必担心http调用。我希望在服务器端分别测试API响应。在测试服务时，我的任务是正确，假设响应可用，以验证我的服务是否应执行的工作。如果不是，则可以测试您的服务是否正确处理了错误响应。您可以在jasmine docs

上了解更多信息

因此，在这种情况下，我通常会嘲笑我的回答。您可以使用茉莉花spy来监视服务调用，例如spy.On(service, 'getInventoryData').and.returnValues(of({your json});。

或者，如果您觉得自己的json很大，请将其存储在本地资源文件夹中，例如：app / test / resources / response1.json`，然后按照以下说明将其导入：

const response: any = require('../test/resources/response1.json');

HTTP服务错误进行角度6单元测试

inventory.service.ts

inventory.service.spec.ts

响应应该给我这些数据。

1 个答案: