Поскольку я включил стиль css в модульных тестах моего приложения Angular, каждый раз компонент, который показывает модально из ngx-bootstrap, он остается в браузере даже после завершения выполнения модульных тестов этого конкретного компонента.
Это затрудняет визуальную проверку выполнения других тестов и их результатов:
ОБНОВЛЕНИЕ: обновлен код для ngx-bootstrap 6+, более старые версии см. ниже
Решение состоит в том, чтобы убедиться, что модальные окна скрыты после каждого теста, который запускает фрагменты кода, которые могут отображать модальные окна:
import { BsModalService } from 'ngx-bootstrap';
// test definitions ...
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
modalService.hide();
});
этот метод использует метод hide () из BsModalService.
Я счел полезным иметь служебную функцию, которую я могу повторно использовать в своих тестах:
export function closeModalsAfterEach() {
afterEach(() => {
const modalService: BsModalService = TestBed.get(BsModalService);
modalService.hide();
});
}
Старое рабочее решение до 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);
}
});
}
