Библиотека тестирования реакции — таймеры с ожиданием/waitForElementToBeRemoved

#reactjs #jestjs #react-testing-library

Вопрос:

В последний раз я обновил библиотеку тестирования/dom с версии 7.29.4 до 8.0.0. После этого тесты, в которых есть jest.useFakeTimers, перестали работать всякий раз, когда используется waitFor/waitForElementToBeRemoved.

 export default function Test() {
const [loaded, setLoaded] = useState(false);

const getDataCallback = useCallback(() => {
    return getData();
}, [])

useEffect(() => {
    getDataCallback().then(data => {
        setLoaded(true)
    });
}, [])


return (
        <>
        {
            loaded ?
            <>
                {new Date().toDateString()} //displays current date
            </>
            : <Loader/>
        }
        </>
)}
 

Тестовый код:

 const mockFunc = jest.spyOn(api, "getData");
const fakeData =  [{ date: "2020-01"}, { date: "2020-02"},];

beforeEach(() => {
    jest.useFakeTimers("modern").setSystemTime(new Date(2020, 2, 3));
    mockFunc.mockResolvedValue(fakeData);
})

it("test", async () => {
    render(<Test />);
    await waitForElementToBeRemoved(screen.queryByTestId("loader"));

    expect(screen.getByText(/tue mar 03 2020/i)).toBeInTheDocument();
})
 

В этом коде это какой-то поддельный вызов api, когда это будет сделано, мы хотим отобразить текущую дату. Если вызов не завершен, то на экране отображается какой-то загрузчик/счетчик. Когда я удаляю состояние загрузчика и waitForElementToBeRemoved() из кода, я высмеиваю дату на экране, и все работает так, как ожидалось, в противном случае отображается реальная дата.