Question

我正在尝试为我的代码编写单元测试。组件

import {Component, Input, OnInit} from '@angular/core';
import {MainStorageService} from '@globals/storage/services/main-storage.service';
import {getSystemState, getWebcastState} from '@globals/store/main-reducer';
import {WebcastHelper} from '@webcast/webcast.helper';
import {DeviceInfoService} from '@core/services/device-info.service';


@Component({
    selector: 'app-presentation',
    templateUrl: 'presentation.component.html',
    styleUrls: ['presentation.component.scss']
})
export class PresentationComponent implements OnInit {

    assetPath: string;
    fileName: string;
    @Input() footerIsHigh: boolean;

    constructor(private store: MainStorageService,
                private device: DeviceInfoService) {
    }

    ngOnInit() {
        this.device.initInstance();
        this.device.destroyInstance();
        this.store.get(getSystemState).subscribe(appState => {
            this.fileName = appState.activeSlide.filename;
        });
        this.store.get(getWebcastState).subscribe(webcastData => {
            this.assetPath = WebcastHelper.generateAssetPathForSlides(webcastData);
        });
    }
}

规格

import { async, ComponentFixture, TestBed, fakeAsync } from '@angular/core/testing';
import { PresentationComponent } from './presentation.component';
import { MainStorageService } from '@globals/storage/services/main-storage.service';
import { DeviceInfoService } from '@core/services/device-info.service';
import { of } from 'rxjs';

const mockStore = {
  get() {
    return of({})
  }
}
const mockdevice = {
  initInstance() {},
  destroyInstance() {}
}
describe('PresentationComponent', () => {
  let component: PresentationComponent;
  let fixture: ComponentFixture<PresentationComponent>;
  let store: MainStorageService;
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ PresentationComponent ],
      providers: [ { provide: MainStorageService, useValue: mockStore}, {provide: DeviceInfoService, useValue: mockdevice}]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(PresentationComponent);
    component = fixture.componentInstance;
     store = TestBed.get(MainStorageService);
    // fixture.detectChanges();
  });


  it('should get file name and asset path', fakeAsync(() => {
    const mockWebcastData: any = {webcast: {company_id: 900, id: 300}, language: 'en', assetsDomain: 'https://testDomain.com'};
    const mockSystemData: any = {activeSlide: {fileName: 'logo.png'}};
    spyOn(store, 'get').and.returnValues(of(mockSystemData),of(mockWebcastData));
    component.ngOnInit();
    fixture.detectChanges();
    expect(component.fileName).toEqual('logo.png');
  }));
});

在上面的代码中，我需要编写单元测试以检查组件中的fileName变量应等于我的虚拟数据。但这不起作用。但是，当我运行测试时，它显示以下错误。我不知道这个问题。

   TypeError: Cannot read property 'subscribe' of undefined
            at PresentationComponent../src/app/shared/desktop-presentation-area/components/presentation/presentation.component.ts.PresentationComponent.ngOnInit (src/app/shared/desktop-presentation-area/components/presentation/presentation.component.ts:26:39)

角单元测试：无法读取未定义问题的属性“订阅”

0 个答案: