Думайте о классе провайдера, чтобы получить ответ и справиться с обещанием - модульное тестирование с Jasmine и Karma с Ionic 3 - PullRequest
Новая
       11

Думайте о классе провайдера, чтобы получить ответ и справиться с обещанием - модульное тестирование с Jasmine и Karma с Ionic 3

0 голосов
/ 11 октября 2018

Я новичок в модульном тестировании.Я начал писать модульное тестирование для своего приложения Ionic 3, используя Karma и Jasmine.Я проследил за блогами, чтобы установить настройки, и успешно протестировал инициализацию компонента App.Я также использую ionic-mock , чтобы получить макеты.

На моей первой странице есть вызов службы http, который вызывает провайдера.Ниже приведен звонок. 

this.portalList.getListInformation().then(data => {
   this.infolist = data;
});

А у провайдера: 

return new Promise((resolve,reject) => {
  this.http.get(url).subscribe(
    data => {
      const response: any = data;
      resolve(response);
    },
    (error) => {
      reject(error);
    })
});

И мой .spec.ts здесь. 

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By }           from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { Portal } from './portal';
import { IonicModule, Platform, NavController, NavParams} from 'ionic-angular/index';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { PortalList } from '../../providers/PortalList/PortalList';
import { HttpClient, HttpHandler } from '@angular/common/http';

import {
  PlatformMock,
  AppsMock,
  NavParamsMock,
  NavMock,
  PortalListMock
} from '../../../test-config/mocks-ionic';

describe(' Portal Page', () => {
  let de: DebugElement;
  let comp: Portal;
  let fixture: ComponentFixture<Portal>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [Portal],
      imports: [
        IonicModule.forRoot(Portal)
      ],
      providers: [
        Config,HttpClient, HttpHandler
        { provide: App, useClass: AppsMock},
        { provide: Platform, useClass: PlatformMock},
        { provide: NavParams, useClass: NavParamsMock},
        { provide: NavController, useClass: NavMock},
        { provide: PortalList, useClass: PortalListMock}
      ]
    });
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(Portal);
    comp = fixture.componentInstance;
    de = fixture.debugElement.query(By.css('label'));
  });

  it('should create component', () => expect(comp).toBeDefined());

});

Я предоставил макет дляпровайдер.

export class PortalListMock {
  public infoList = [{name: "MAC", region: "West"}];

  public _getPortal(): any { return {} };
  public getListInformation() { return this.infoList; }

  return;
}

При выполнении **npm test** выдает ошибку, подобную **this.portalList.getListInformation().then is not a function**.

Как смоделировать обещание http-запроса провайдера.или как побороть из этого вопроса.

1 Ответ

0 голосов
/ 12 октября 2018

Я полагаю, это связано с тем, что вы возвращаете массив, а не Promise.

Я бы предложил следующее изменение в поставщике макетов:

this:

public getListInformation() { return this.infoList; }

, чтобы стать таким:

public getListInformation() { return Promise.resolve(this.infoList); }

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

return new Promise((resolve,reject) => {

, но разрешено возвращать разрешенное Обещание всегда, включая статические данные.

...