Angular 8 карма игнорирует запрос на обслуживание - PullRequest
Новая
       22

Angular 8 карма игнорирует запрос на обслуживание

0 голосов
/ 11 февраля 2020

Я застрял в этом простом модульном тесте.

У меня есть службы с одним запросом http get, и у меня есть компонент со списком объектов. Я пытался проверить результат этого запроса.

При выполнении теста я всегда получал пустой массив, потому что каким-то образом службы не работают, вы можете видеть, что только у компонента есть результат журнала.

Я использую json -сервер для REST API.

Спасибо.

Это мой консольный результат: 

10 02 2020 16:47:39.159:INFO [karma-server]: Karma v4.1.0 server started at http://0.0.0.0:9876/
10 02 2020 16:47:39.160:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
 30% building 17/17 modules 0 active10 02 2020 16:47:39.314:INFO [launcher]: Starting browser Chrome
10 02 2020 16:47:44.928:WARN [karma]: No captured browser, open http://localhost:9876/
10 02 2020 16:47:45.016:INFO [Chrome 80.0.3987 (Windows 10.0.0)]: Connected on socket **** with id **
LOG: 'component'
Chrome 80.0.3987 (Windows 10.0.0): Executed 0 of 1 SUCCESS (0 secs / 0 secs)
LOG: 'component'
Chrome 80.0.3987 (Windows 10.0.0): Executed 0 of 1 SUCCESS (0 secs / 0 secs)
Chrome 80.0.3987 (Windows 10.0.0): Executed 1 of 1 SUCCESS (0.102 secs / 0.077 secs)
TOTAL: 1 SUCCESS

Это мой сервис: 

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

@Injectable({
  providedIn: 'root'
})
export class ServicesTestService {

  constructor(private http: HttpClient) { }

  getAllMovies() {
    console.log('services');
    return this.http.get("http://localhost:3000/movies");
  }
}

Это мой компонент: 

import { Component, OnInit } from '@angular/core';
import { ServicesTestService } from '../../services/services-test.service';

@Component({
  selector: 'app-list',
  templateUrl: './list.component.html',
  styleUrls: ['./list.component.css']
})
export class ListComponent implements OnInit {

  constructor(private service: ServicesTestService){}

  movies: any = [];

  ngOnInit() {
    this.getMovies();
  }

  getMovies() {
    this.service.getAllMovies().subscribe(res => {
      console.log('component');
      this.movies = res;
    });
  }

}

И мой файл spe c: 

import { TestBed, ComponentFixture, inject, async, fakeAsync } from '@angular/core/testing';
import { ListComponent } from './list.component';
import { of } from 'rxjs';
import { ServicesTestService } from 'src/app/services/services-test.service';
import { HttpClientModule } from '@angular/common/http';

let component: ListComponent;
let fixture: ComponentFixture<ListComponent>;
let servicesTestService: ServicesTestService;

describe("ListComponent", () => {

    beforeEach(async(() => {
      TestBed.configureTestingModule({
        declarations: [
            ListComponent
        ],
        providers: [
            ServicesTestService
        ],
        imports: [HttpClientModule]
      }).compileComponents();
    }));

    beforeEach(inject([ServicesTestService], s => {
        servicesTestService = s;
      fixture = TestBed.createComponent(ListComponent);
      component = fixture.componentInstance;
    }));

    it("should call getMovies and return list of movies", fakeAsync(() => {

      let response = [];

      spyOn(servicesTestService, 'getAllMovies').and.returnValue(of(response))

      component.getMovies();

      fixture.detectChanges();

        expect(component.movies).toEqual(response);
    }));
  });

1 Ответ

0 голосов
/ 11 февраля 2020

Здесь это не работает, потому что 

spyOn(servicesTestService, 'getAllMovies').and.returnValue(of(response))

Это имитирует ваш вызов API и возвращается []. В любом случае, не рекомендуется называть фактический API в модульных тестах. Вы можете использовать httpclienttestingmodule для модульного тестирования http-вызовов.

Для модульного тестирования getMovies вы можете изменить ответ с [] на любой ответ, который вы ожидаете получить в component.movies.

FYI- модульное тестирование http звонков

...