angularjasmine測驗抽象類與其他抽象類

我有這個場景問題：

在 Ionic/Angular 專案（ionic v3/Angular v5）中，我有一個組件SuppliedVanContainerComponent，它擴展了抽象類AbstractLoadingClass，這個類擴展了另一個抽象類AbstractSubscriberClass。

所述AbstractLoadingClass使用LoadingController離子-角服務用于示出微調和它使用的SuppliedVanContainerComponent呼叫showLoading方法時。

問題：當我可以對 jasmine 使用單元測驗時，它會向我顯示這些錯誤：

型別錯誤：無法讀取未定義的屬性（讀取“_getPortal”）

當我用 jasmine.createSpyObj模擬LoadingController時，它顯示了另一個錯誤，是：

型別錯誤：this.loading.present 不是函式

我該如何修復它或者我可以使用抽象類進行測驗？

提供的VanContainer組件

    export class SuppliedVanContainerComponent extends AbstractLoadingClass
      constructor(loadingCtrl: LoadingController) {
            super(loadingCtrl);
        }

      ngOnInit(){
        this.showLoading();
      }

抽象加載類

import {Loading, LoadingController} from 'ionic-angular';
import {LoadingOptions} from 'ionic-angular/umd/components/loading/loading-options';

import {AbstractSubscriberClass} from './abstract-subscriber.class';

export abstract class AbstractLoadingClass extends AbstractSubscriberClass {
  private loading: Loading;
  
  protected constructor(public loadingCtrl: LoadingController) {
    super();
  }
  
  private getCreateLoading(opts?: LoadingOptions) {
    return this.loadingCtrl.create(opts);
  }
  
  showLoading() {
    this.loading = this.getCreateLoading({content: ''});
    this.loading.present();
    this.loading.setContent('');
  }

  hideLoading() {
    this.loading.dismiss();
  }
}

茉莉花測驗有誤

...
  let fakeLoadingController = jasmine.createSpyObj<LoadingController>('LoadingController', {
    create: {content: ''},
  })
...
{provide: LoadingController, useValue: fakeLoadingController},

錯誤：

uj5u.com熱心網友回復：

感謝@AliF50，我有兩個解決方案，我將其發布，第一個解決方案：

....
let fakeLoadingController = jasmine.createSpyObj<LoadingController>('LoadingController', ['create'])
......
providers: [
....
   {provide: LoadingController, useValue: fakeLoadingController},
]
....
beforeEach(() => {
    fixture = TestBed.createComponent(SuppliedVanContainerComponent);
    fakeLoadingController.create.and.returnValue({present: () => null, setContent: () => null, dismiss: () => null});
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

它的作業非常簡單，無需使用 LoaderController 進行間諜或測驗（只是模擬）。

如果您要使用 Loading 和 spy ，請在此模式下設定：

.....
  let fakeLoadingController = jasmine.createSpyObj<LoadingController>('LoadingController', ['create'])
  let fakeLoadingObject = jasmine.createSpyObj<Loading>('Loading', ['present', 'setContent', 'dismiss']);
.....
providers: [
...
        {provide: LoadingController, useValue: fakeLoadingController},
        {provide: Loading, useValue: fakeLoadingObject},
]
....
  beforeEach(() => {
    fixture = TestBed.createComponent(SuppliedVanContainerComponent);
    dailyReportsModel = TestBed.get(DailyReportsModel);
    fakeLoadingController.create.and.returnValue(fakeLoadingObject);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });
  ....
  it('test fakeLoadingObject', () => {
    expect(fakeLoadingObject.present).toHaveBeenCalled();
  })

感謝@AliF50

uj5u.com熱心網友回復：

我認為你嘲笑它是錯誤的，試試這個：

let fakeLoadingController = jasmine.createSpyObj<LoadingController>('LoadingController', ['create']);
...
{provide: LoadingController, useValue: fakeLoadingController},
...
// before fixture = ..., add this line
fakeLoadingController.create.and.returnValue({ present: () => null, setContent: () => null, dismiss: () => null });
// Or if you want spies on present, setContent, dismiss, you could do
let fakeLoadingObject = jasmine.createSpyObj<any>('FakeLoadingObject', ['present', 'setContent', 'dismiss']);
// then the line above becomes
fakeLoadingController.create.and.returnValue(fakeLoadingObject);
// And then you should have a handle of something like this:
expect(fakeLoadingObject.present).toHaveBeenCalled();

標籤：有角的 单元测试 茉莉花 离子3 抽象类

上一篇：如何使用sinonjs/loopbacktestlab從twilio-node模擬messages.create()方法的回傳值？

下一篇：VisualStudio中的SQLServerUnitTesting-DROPDATABASE[MyDb]