Question

在我的组件中，我将其作为构造函数：

constructor(private es: NgxEchartsService, private sessionService: SessionService, private sorting: SortingService) { }

而且，我在onInit()上的第一行是： this.es.registerMap('world', worldJson); 有关世界地图的图表。它可以完美运行，但是可以使用此.spec.ts：

import { async, ComponentFixture, TestBed, getTestBed } from '@angular/core/testing';

import { HttpClientTestingModule } from '@angular/common/http/testing';
import { UsersViewComponent } from './users-view.component';
import { FormsModule, ReactiveFormsModule } from '../../../node_modules/@angular/forms';
import { MyDateRangePickerModule } from '../../../node_modules/mydaterangepicker';
import { NgxEchartsModule, NgxEchartsService } from '../../../node_modules/ngx-echarts';
import { Observable } from '../../../node_modules/rxjs';
import { SessionService } from '../Services/session.service';
import { SortingService } from '../sorting.service';

describe('UsersViewComponent', () => {
  let component: UsersViewComponent;
  let fixture: ComponentFixture<UsersViewComponent>;



  function fireEvent(id,event){
    const nativeElement = fixture.nativeElement;
    const button = nativeElement.querySelector('#'+id);
    button.dispatchEvent(new Event(event));
  }

  beforeEach(() => {

    // Create a fake TwainService object with a `getQuote()` spy
    const sessionService = jasmine.createSpyObj('sessionService', ['getSessions']);
    // Make the spy return a synchronous Observable with the test data
    var getSessionSpy = sessionService.getSessions.and.returnValue(Observable.of({}));;


    TestBed.configureTestingModule({
      imports: [FormsModule, ReactiveFormsModule, MyDateRangePickerModule, NgxEchartsModule, HttpClientTestingModule],
      declarations: [UsersViewComponent],
      providers: [
        { provide: NgxEchartsService},
        { provide: SessionService, useValue: sessionService },
        { provide: SortingService }
      ]
    })
      .compileComponents();

    fixture = TestBed.createComponent(UsersViewComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    fireEvent("worldMapChart","chartInit");

    fixture.whenStable().then(() => {
      expect(component).toBeTruthy();
    });
  });
});

它给我：无法读取未定义的属性'registerMap'，这意味着未正确将服务传递给组件。有任何线索吗？

Answer 1

如果您不模拟任何service (providers)，则只需在providers数组的根部指定它们即可。

providers: [
        NgxEchartsService,
        { provide: SessionService, useValue: sessionService },
        SortingService
      ]

将ECharts Service与Karma Testing结合使用

1 个答案: