import React from 'react'; import { render, screen, act, waitFor } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import { useForm } from 'react-hook-form'; import { createWrapper } from '__tests__/wrapper'; import { en } from 'ui/messages'; import { ForgotPasswordSubmit } from 'ports/auth/forgotPasswordSubmit'; import { ForgotPassword } from 'ports/auth/forgotPassword'; import Recovery from '../Recovery'; import { Values } from '../types'; const setup = () => { const onForgotPassword = jest.fn(); const onForgotPasswordSubmit = jest.fn(); const Provider: React.FC = () => { const formProps = useForm<Values>(); return ( <Recovery formProps={formProps} submitting={false} onForgotPassword={onForgotPassword} onForgotPasswordSubmit={onForgotPasswordSubmit} /> ); }; const wrapper = createWrapper({ messages: en, inject(jpex) { jpex.constant<ForgotPassword>(onForgotPassword); jpex.constant<ForgotPasswordSubmit>(onForgotPasswordSubmit); }, render: () => { return <Provider />; }, }); return { wrapper, onForgotPassword, onForgotPasswordSubmit }; }; describe('testing password recovery page', () => { it('should run useForgotPassword on submit of RESET step', async () => { const { wrapper, onForgotPassword } = setup(); await act(async () => { render(<div />, { wrapper }); await userEvent.type( screen.getByLabelText('Email Address'), 'user@email.com' ); await userEvent.click(screen.getByText('Next')); }); // expect(onForgotPassword).toBeCalledWith('user@email.com'); expect(onForgotPassword).toHaveBeenCalled(); }); });