angular - 单元测试后关闭 ngx-bootstrap 模式
问题描述
由于我在 Angular 应用程序的单元测试中启用了 css 样式,因此每次显示来自 ngx-bootstrap 的模态的组件时,即使在该特定组件的单元测试完成运行后,它仍保留在浏览器中。
这使得很难直观地检查其他测试的执行情况和测试结果:
解决方案
更新:为 ngx-bootstrap 6+ 更新代码,旧版本见下文
解决方案是确保在每次运行可能显示模态的代码的测试之后隐藏模态:
import { BsModalService } from 'ngx-bootstrap';
// test definitions ...
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
modalService.hide();
});
该技术使用BsModalService中的hide()方法。
我发现拥有一个可以在测试中重用的实用程序函数很有用:
export function closeModalsAfterEach() {
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
modalService.hide();
});
}
旧代码(适用于 ngx-bootstrap 6 之前的版本)
ngx-bootstrap 5 之前的旧工作解决方案
import { BsModalService } from 'ngx-bootstrap';
// test definitions ...
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
modalService.hide(1);
});
export function closeModalsAfterEach(upToLevel: number = 1) {
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
for (let level = 1; level <= upToLevel; level++) {
modalService.hide(level);
}
});
}
推荐阅读
- assembly - 创建进程时出错 C:\Masm32\bin\ML.EXE /c /Cp /nologo /I"C:\Masm32\Include" "Hello.asm"
- python - 如何编辑我的代码以使输出是下一个大于 3 的数字?
- r - r:通过 dplyr 的 group_by 函数传递列列表
- python - ValueError:基于位置的索引只能有[标签(必须在索引中)
- matplotlib - matplotlib.pyplot 包不存在
- tensorflow - 相当于 `tensorflow_probability.edward2` 中的 `ed.copy`
- python - 将 YAML 加载为嵌套对象而不是 Python 中的字典
- cakephp - 如何在cakephp3中添加条件
- javascript - 如何遍历 Apify 上的数组?
- regex - 如何匹配以字母数字字符开头且只有三个特殊字符的文件。_ -?