Я пытаюсь проверить кнопку удаления в моем приложении. Когда приложение инициализируется, оно делает аксиос запрос к серверу, чтобы получить список преимуществ. Когда нажата кнопка удаления, делается другой запрос. По какой-то причине мой тест просто не перехватывает второй запрос axios.
Я попытался заглушить начальный запрос, но у меня все еще возникает та же проблема.
Первоначальный запрос
useEffect(() => {
axios.get('/api/v1/benefits')
.then(response => {
setBenefits(response.data)
})
}, [])
Функция, вызываемая при нажатии кнопки:
const deleteBenefit = benefit => {
const id = benefit.id
axios.delete(`/api/v1/benefits/${id}`)
.then(response => {
setBenefits(benefits.filter(benefit => benefit.id !== id))
warning('Benefit Deleted')
})
.catch(error => {
warning('Benefit could not be deleted. Please try again')
})
}
Тест записывается как
it('deletes the selected benefit', async () => {
const { getByTestId, debug } = render(<Benefits />)
moxios.wait(() => {
const request = moxios.requests.mostRecent()
request.respondWith({
status: 200,
response: benefits
})
})
const deleteButton = await waitForElement(() => getByTestId('deleteButton1'))
fireEvent.click(deleteButton)
moxios.wait(() => {
const request = moxios.requests.mostRecent()
request.respondWith({
status: 204,
}).then(() => {
expect(document.querySelectorAll('tbody > tr').length).toBe(3)
done()
})
})
})
Я ожидаю, что второй файл moxios.wait перехватит запрос на удаление. Сам код работает, и при нажатии кнопки он отправляет запрос на удаление на сервер через запрос axios.
Я также подтвердил, что сам тест действительно вызывает функцию, потому что для его проверки я создал фиктивный элемент и обновил его, который обновляет тест.
Мне интересно, работает ли moxios.wait таким образом, но я не могу найти ничего, что могло бы подсказать, как я это делаю, было бы проблемой.