angular - 使用 ECharts 服务和 Karma 测试
问题描述
在我的组件中,我将其作为构造函数:
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”,这意味着服务未正确传递给组件。有什么线索吗?
解决方案
如果您没有模拟任何,那么您可以简单地在数组service (providers)
的根目录中指定它们。providers
providers: [
NgxEchartsService,
{ provide: SessionService, useValue: sessionService },
SortingService
]
推荐阅读
- android - 即使在 kill-server 之后模拟器运行时,adb 也会重新生成
- javascript - 如何从范围滑块添加两个值以形成单个值
- ruby-on-rails - 为什么我的 Rails 应用程序在推送到 Heroku 时无法工作:“ActionView::Template::Error (undefined method `toilet_available' for nil:NilClass)”?
- php - 使用 IF 语句映射 Woocommerce 订单状态
- android - 忽略 json 中的元信息
- javascript - 如何根据当前悬停的元素隐藏和显示元素?
- java - 如何将变量声明为常量数组的元素?
- postgresql - 修复损坏的表
- java - 将受保护的“卡片”数组元素从子类传递到子类
- django - Django - 检查用户是否对每个 url 进行了身份验证