Я пытаюсь написать тест для веб-приложения, которое я создаю, используя jquery. У меня есть некоторые функции, которые затухают некоторые элементы в out, и я хотел бы убедиться, что эти элементы отображаются как ожидалось. Я использую jest для тестирования, но я не выяснил, как определить, вызывается ли $(...).fadeIn()
или $(...).fadeOut()
для определенных c элементов. Вот пример
Допустим, это DOM
<div>
<span id="show-this" style="display: none"></span>
<span id="hide-this"></span>
</div>
, и это функция, которую я хочу проверить
function showAndHide() {
$('#show-this').fadeIn();
$('#hide-this').fadeOut();
}
на данный момент лучший тест, который я был в состоянии сделать это, шпионить за fadeIn
и fadeOut
и посмотреть, если они были вызваны.
it('should display the element', () => {
const spyFadeIn = jest.spyOn($.fn, 'fadeIn');
showAndHide();
expect(spyFadeIn).toHaveBeenCalled();
});
it('should hide the element', () => {
const spyFadeOut = jest.spyOn($.fn, 'fadeOut');
showAndHide();
expect(spyFadeOut).toHaveBeenCalled();
});
Это хороший обходной путь, но в подобных ситуациях он не сработает, потому что тесты пройдут, если я fadeOut #show-this
и fadeIn #hide-this
, которые я вызову sh, чтобы вызвать тест не пройден. Я попытался проверить аргументы функции, так как я знаю, что под сценой эта функция получает элемент в качестве аргумента, но шутка этого не видит. Какие-нибудь мысли? Из-за этого я застрял на модульном тестировании.