Написание тестовых случаев для сервиса Http в угловых - PullRequest
Новая
       38

Написание тестовых случаев для сервиса Http в угловых

0 голосов
/ 03 июля 2018

Привет. Я пытался написать контрольные примеры для моей службы регистрации. У него есть URL, который он отправляет 4 значения. услуга выглядит следующим образом: 

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http'



interface registerResponse {
  success: boolean,
  message: string
}

@Injectable()
export class AuthService {

private _regurl ="http://localhost:3000/api/register"
  constructor(private http: HttpClient) { }



  registerUser(username,email,date,  password) {
   
    return this.http.post<registerResponse>(this._regurl, {
      username,
      email,
      date,
      password
      
     
    })
  }

}

Я все еще учусь писать тестовые случаи, пытаюсь заставить registerResponse работать.

вот что я написал до сих пор 

import { TestBed, async, inject } from '@angular/core/testing';
import {
  HttpModule,
  Http,
  Response,
  ResponseOptions,
  XHRBackend
} from '@angular/http';
import { MockBackend } from '@angular/http/testing';
import { AuthService } from './auth.service';
import { HttpClient } from '@angular/common/http'


describe('RegisterService', () => {

  beforeEach(() => {

    TestBed.configureTestingModule({
      imports: [HttpModule],
      providers: [
        { provide: HttpClient, useValue: 'http://localhost:3000/api/register' },
        AuthService,
        { provide: XHRBackend, useClass: MockBackend },
      ]
    });
  });

Я знаю, что это немного, но я определил только mockbackend, но любая помощь будет оценена.

Спасибо

1 Ответ

0 голосов
/ 03 июля 2018

Чтобы начать тестирование вызовов на HttpClient, импортируйте HttpClientTestingModule и контроллер-макет HttpTestingController вместе с другими символами, необходимыми для ваших тестов. 

import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';

Затем добавьте HttpClientTestingModule к TestBed и продолжите настройку тестируемой службы. 

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

describe('RegisterService', () => {

  let service: AuthService;
  let httpMock: HttpTestingController;

  beforeEach(() => {

    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      providers: [AuthService]
    });

    service = TestBed.get(AuthService);
    httpMock = TestBed.get(HttpTestingController);
  });

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

  describe('#registerUser tests', () => {
    it('Should return registerResponse by making a POST request to the given url', () => {

      const username = 'username';
      const email = 'email';
      const date = 'date';
      const password = 'password';

      const mockResponse: RegisterResponse = {
        success: true,
        message: 'Successfull'
      };
      service.registerUser(username, email, date, password).subscribe((res) => {
        expect(res).toBe(mockResponse);
      });

      const req = httpMock.expectOne('http://localhost:3000/api/register');
      expect(req.request.method).toBe('POST');
      req.flush(mockResponse);
    });
  });
});

Теперь запросы, сделанные в ваших тестах, попадут на тестовый бэкэнд вместо нормального бэкэнда .

Эта установка также вызывает TestBed.get() для ввода контроллера-макета, чтобы на него можно было ссылаться во время испытаний.

Следующий expectOne() будет соответствовать URL-адресу запроса. Если ни один запрос или несколько запросов не совпали, URL-адрес expectOne() будет выдан. 

const req = httpMock.expectOne('http://localhost:3000/api/register');

Подробнее о тестировании угловых сервисов, использующих HttpClient и тестировании Http-запросов, в официальной угловой документации .

К вашим услугам. Экспорт интерфейса. 

export interface RegisterResponse {
  success: boolean,
  message: string
}

Но я рекомендую вам перенести модели данных в другой каталог или файл.

Затем импортируйте интерфейс в файл tes следующим образом. 

import { RegisterResponse } from 'path-to-interface';
...