问题描述
我想对显示项目列表的角度分量ListViewComponent
进行单元测试。在某些情况下,它会显示一个用于编辑特定项目的编辑按钮,并提供一个用于添加新项目的添加按钮。
编辑和添加是通过显示ItemFormComponent
的模式完成的。该组件具有注入的依存关系ItemService
,可将后端的更改持久化。对话框的结果是新的或已编辑的项目,因此ListViewComponent
可能会在必要时更新其内容。
在测试ListViewComponent
时,我在模拟MatDialog部分时遇到了问题。
我的第一个想法是为ItemService
提供一个模拟,但是测试启动失败了,因为它无法在真实的ItemService
中找到由环境变量提供的参数,因此该模拟未提供给ItemFormComponent
。
这是我的代码:
describe("ListViewComponent",() => {
let component: ListViewComponent;
let fixture: ComponentFixture<ListViewComponent>;
let itemServiceSpy: jasmine.SpyObj<ItemService>;
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ListViewComponent],providers: [
{provide: ItemService,useValue: itemServiceSpy}
]
})
.compileComponents();
itemServiceSpy = TestBed.inject(ItemService) as jasmine.SpyObj<ItemService>;
fixture = TestBed.createComponent(ListViewComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it("should create",() => {
expect(component).toBeTruthy();
});
});
对话框的实例通过
完成 this.dialogRef = this.matDialog.open<ItemFormComponent>(ItemFormComponent,{
data: {
item: item
}
});
我认为更好的方法是完全模拟MatDialog部分,以便我可以伪造对话框结果并检查ListViewComponent
的行为。
但是我不知道如何解决这个问题。
欢迎您提出任何提示或解决方案,谢谢!
亲切的问候, 安德烈亚斯(Andreas)
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)