Блог

Главная - Вопросы по программированию - Библиотека тестирования реакции — насмешка над функцией

Библиотека тестирования реакции — насмешка над функцией

#reactjs #function #jestjs #mocking #react-testing-library

Вопрос:

Я пытаюсь проверить, вызывается ли функция

 import React from 'react';
import { render, cleanup, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom';
import MyForm from './MyForm';

afterEach(cleanup);
const testFunction = jest.fn();
test('my form', () => {
  const { getByTestId } = render(<MyForm />);
  const myButton = getByTestId('submit-button');
  expect(myButton.tagName).toBe('BUTTON');
  fireEvent.click(myButton)
  expect(testFunction).toHaveBeenCalledTimes(1)
});

Проблема, с которой я сталкиваюсь, заключается в том, что она, похоже, не привязана к фиктивной функции, но она вызывает функцию в компоненте.

 import React from 'react';

export default function myForm() {
  function testFunction() {
    console.log('hello from inside');
  }
  return (
    <div>
      <form onSubmit={testFunction}>
        <input type="text" />
        <button type="submit" data-testid="submit-button">submit</button>
      </form>
    </div>
  );
}

Как мне вызвать фиктивную функцию, а не «реальную» функцию.

 expect(jest.fn()).toHaveBeenCalledTimes(1)
    
    Expected mock function to have been called one time, but it was called zero times.

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

1. Должен ли вы testFunction быть (скрыт) внутри компонента myForm? Если бы это была подставка, вы могли бы пройти ее в своем тесте, а затем была бы вызвана функция mock.

2. Я видел, как это делалось — почти в каждом примере. Я бы изменил свой код, чтобы он соответствовал тесту. Я мог бы, но мне это кажется неправильным.

Ответ №1:

Вы не можете вызывать внутренние функции myForm . Вы можете протестировать поведение и конечный ощутимый результат, но не личную функциональность компонента.

И это тоже имеет смысл. Модульный тест должен касаться результата, а не того, вызывается ли конкретная функция, внутренняя для этого компонента.

Да, вы всегда можете проверить поведение. Например, вы можете проверить, что console.log называется тем, что видно внешнему миру с точки зрения осязаемой вещи.

Аналогично, если testFuntion вы делаете что-то еще, что вы можете утверждать, вы также можете это проверить.

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

Метки: