Question

由于我已经在Angular应用程序的单元测试中启用了CSS样式，因此每次显示RegexValidator的组件都将保留在浏览器中，即使该特定组件的单元测试完成运行之后也是如此。

这使得很难直观地检查其他测试的执行情况和测试结果：

Answer 1

解决方案是确保在每次运行可能显示模态的代码的测试之后，模态都被隐藏：

import { BsModalService } from 'ngx-bootstrap';

// test definitions ...

afterEach(() => {
  const modalService: BsModalService = TestBed.get(BsModalService);
  modalService.hide(1);
});

此技术使用的是BsModalService中的隐藏（级别：数字）方法。

如果您嵌套了模态，则可能需要隐藏更多级别（例如hide(2)，hide(3)等）。

我发现拥有可以在测试中重用的实用程序功能很有用：

export function closeModalsAfterEach(upToLevel: number = 1) {
  afterEach(() => {
    const modalService: BsModalService = TestBed.get(BsModalService);

    for (let level = 1; level <= upToLevel; level++) {
      modalService.hide(1);
    }
  });
}

单元测试后关闭ngx-bootstrap模态

1 个答案: