Блог

Главная - Вопросы по программированию - Шутка: шпионский аксиос в React

Шутка: шпионский аксиос в React

#javascript #reactjs #axios #jestjs #spy

Вопрос:

Я новичок в шутках (и тестировании javascript в целом). У меня есть Register компонент, который в основном представляет собой страницу для регистрации пользователя. Когда форма будет заполнена и нажата кнопка отправить, она будет использоваться axios для отправки POST запроса на сервер.

Я пытаюсь написать тест для этой функции. Для этого мне нужно поиздеваться axios . Я написал следующий тест, но при утверждении, что axios он был вызван, я получаю ошибку:

  expect(jest.fn()).toHaveBeenCalled()

Expected number of calls: >= 1
Received number of calls:    0

Вот мой тест:

 jest.mock('axios')

it('should save value when submitted', async () => {

            render(
                <Register />
            );

            ReactTestUtils.Simulate.change(field('email'), {
                target: { value: 'test@mail.com', name: 'email'}
            })

            ReactTestUtils.Simulate.change(field('first-name'), {
                target: { value: 'test', name: 'first-name'}
            })

            ReactTestUtils.Simulate.change(field('last-name'), {
                target: { value: 'test', name: 'last-name'}
            })

            ReactTestUtils.Simulate.change(field('password'), {
                target: { value: 'test', name: 'password'}
            })

            ReactTestUtils.Simulate.change(field('confirm-password'), {
                target: { value: 'test', name: 'confirm-password'}
            })


            const postSpy = jest.spyOn(axios, 'post')

            ReactTestUtils.Simulate.submit(form('register'));

            expect(postSpy).toHaveBeenCalled();

        });

В основном я заполняю все необходимые поля в своей форме, а затем отправляю ее.

Функция, которая обрабатывает отправку в моем Register компоненте, выглядит следующим образом:

 const onSubmit = data => {
        const res = axios.post("http://localhost/register", data);
    }

Есть идеи, что я упускаю или делаю неправильно?

Спасибо

Комментарии:

1. Откуда берутся функции field() и form() ?

2. Это просто помощники, которых я определил, чтобы получить форму и поле в форме соответственно. Они отлично работают, у меня есть другие тесты, которые их используют

3. Ваш код не вызывает axios.post() , он вызывает axios() , поэтому ваш axios.post шпион никогда не будет вызван

4. О да, я вижу это. Я вызываю axios и определяю метод в переданном объекте, я не вызываю axios.post. Заменит мой код и попробует его снова. Большое спасибо

5. @Phil Я обновил свой код для использования post (код для этого вопроса также был обновлен), но я получаю точно такой же результат

Метки: