Модульный тест не выполнен, поскольку fest.fn() не запускает функцию openConfirmationModal ⇐ Javascript

[Anonymous]

Код: Выделить всё

it('text field', async () => {
const props = {
openConfirmationModal: jest.fn()
}

const { queryByTestId, findByTestId } = render(

);

const input = queryByTestId('input-component-amount') as HTMLInputElement;
expect(input).toBeInTheDocument();

fireEvent.change(input, { target: { value: 123 } });

const textArea = queryByTestId('textarea-component-textfield') as HTMLTextAreaElement;
expect(textArea).toBeInTheDocument();
fireEvent.change(textArea, { target: { value: 'This is some text!' } });

const submitButton = queryByTestId('button') as HTMLButtonElement;
expect(submitButton).toBeInTheDocument();
expect(submitButton).toBeEnabled();

fireEvent.click(submitButton);

expect(props.openConfirmationModal).toHaveBeenCalledTimes(1);

const submitModalButton = queryByTestId('confirmation-modal-submit-button') as HTMLButtonElement;
expect(submitModalButton).toBeInTheDocument();
});

Код: Выделить всё

import React, { useState } from 'react';

interface FormInputsProps {
openConfirmationModal: () => void;
}

const FormInputs: React.FC = ({ openConfirmationModal }) => {
const [amount, setAmount] = useState('');
const [reason, setReason] = useState('');
const [isModalOpen, setIsModalOpen] = useState(false);

const handleSubmit = () => {
if (amount && reason) {
openConfirmationModal();
setIsModalOpen(true);
}
};

const handleModalSubmit = () => {
Calling API....
setIsModalOpen(false); // Close modal on confirmation
};

return (

 setAmount(e.target.value)}
/>
 setReason(e.target.value)}
/>

Submit

{isModalOpen && (

Are you sure you want to submit?

Confirm


)}

);
};

export default FormInputs;

После ожидаемого(props.openConfirmationModal).toHaveBeenCalledTimes(1) невозможно увидеть модальное окно и получить ошибку "невозможно найти элемент" для const submitModalButton = queryByTestId('confirmation-modal-submit-button') как HTMLButtonElement.

Подробнее здесь: https://stackoverflow.com/questions/793 ... l-function