Как в Jest проверить состояние блока, после его обновления при помощи анимации?
У меня проблема: грубо говоря, есть state
const [foo, setFoo] = useState('foo');
и есть кнопка, которая обновляет это сотояние с двумя задержками: по таймауту + по анимации:
const Component = () => {
const [foo, setFoo] = useState(123');
const handleAnimation = (callback, start, end, duration) => {
// здесь логика анимации с использованием requestAnimationFrame
window.requestAnimationFrame();
}
const handleClick = () => {
setTimeout(() => {
handleAnimation(setFoo, foo, 567);
}, 2000);
}
return (
<div testId="testing-id">{foo}</div>
<button onClick={handleClick}>Click</button>
)
}
Проблема заключается в том, что findByTestId всегда возвращает самое первое значение и не может получить новое значение (то, которое формируется после просчета анимации. Если убрать вызов анимации и просто менять стейт, то всё работает хорошо. Интересует путь решения проблемы: например, заглушить requestAnimationFrame или setTimeout, либо программно дождаться выполнения анимации, но мне это не помогло. Прошу о помощи, спасибо.