angular - 无法以角度运行 toast 消息的单元测试用例
问题描述
嗨,我正在以 Angular 5 开发 Web 应用程序。我正在使用 toast 消息来显示消息。我正在使用来自https://www.npmjs.com/package/angular2-toaster的 toast 消息。实施是正确的并且工作正常。我在编写单元测试用例时遇到问题。下面是我在组件中的实现。我在组件中添加了下面的代码行。
import { ToasterModule, ToasterService } from 'angular2-toaster';
我在构造函数中添加了以下代码。
private toasterService: ToasterService
我正在显示如下敬酒消息。
this.toasterService.pop('success', 'Args Title', 'Args Body');
我在 HTML 文件中添加了以下代码。
<toaster-container></toaster-container>
此实现工作正常。我正在编写单元测试用例,如下所示。
describe('Component: TenantEditorComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
HttpClientModule,
RouterTestingModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: TranslateLanguageLoader
}
}),
NgxDatatableModule,
FormsModule,
UiSwitchModule,
TooltipModule.forRoot(),
ModalModule.forRoot(),
ToasterModule
],
providers: [ ToasterService ]
}).compileComponents();
fixture = TestBed.createComponent(TenantEditorComponent);
component = fixture.componentInstance;
submitEl = fixture.debugElement;
fixture.detectChanges();
}));
这给了我错误
没有 Toaster 容器被初始化来接收 toast。
我在下面添加了屏幕截图。
有人可以帮我解决这个问题吗?任何帮助,将不胜感激。谢谢
解决方案
创建间谍以检查烤面包机服务。
describe('Component: TenantEditorComponent', () => {
let toasterServiceSpy: jasmine.Spy;
const toasterSetvices = jasmine.createSpyObj('toasterSetvices', ['pop']);
toasterServiceSpy = toasterSetvices.pop.and.returnValue(of(''));
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
HttpClientModule,
RouterTestingModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: TranslateLanguageLoader
}
}),
NgxDatatableModule,
FormsModule,
UiSwitchModule,
TooltipModule.forRoot(),
ModalModule.forRoot(),
ToasterModule
],
providers: [ {provide: ToasterService, useValue: toasterSetvices } ]
}).compileComponents();
fixture = TestBed.createComponent(TenantEditorComponent);
component = fixture.componentInstance;
submitEl = fixture.debugElement;
fixture.detectChanges();
}));
it('Hit the Login Button', () => {
const fixtureInstance = TestBed.createComponent<LoginComponent>
(LoginComponent);
const toasterServiceInstance =
fixtureInstance.componentInstance.toasterService;
fixtureInstance.detectChanges();
component.submit();
expect(toasterServiceSpy.calls.any()).toBe(true);
});
推荐阅读
- python - 适合生成器功能的 Keras 始终在主线程中执行
- json - 如何快速创建模型并将 Json 响应添加到模型?
- javascript - 使用 Google App Script 查找行中唯一的单元格值(包括重复的单元格值)
- android - 尝试通过 Bitrise 运行 appium 测试时出错
- python-3.x - 如何在这个不完整的向量解决方案中避免循环
- c# - LINQ 查询以递归方式获取对象以在 C# 中准备对象集合
- javascript - ElectronJS:将文件拖放到 Windows 任务栏上的电子应用程序图标上
- php - Windows 上的 PHPPGAdmin 给出“虚拟类 -- 无法实例化”错误
- devops - ClearML 从记录的值中获取最大值
- html - 为什么我的某些元素边框比其他元素边框更暗?