fix: Create button is not working on SignUp form (#11152)

This commit is contained in:
Sachin Chaurasiya 2023-04-20 01:20:32 +05:30 committed by GitHub
parent dd754d586e
commit 3cf6442459
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 44 additions and 0 deletions

View File

@ -12,6 +12,7 @@
*/
import { act, fireEvent, render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import React, { ReactNode } from 'react';
import { createUser } from 'rest/userAPI';
import SignUp from '.';
@ -259,4 +260,46 @@ describe('SignUp page', () => {
expect(createUser as jest.Mock).toHaveBeenCalledTimes(0);
});
it('Create Button Should Work Properly and call the form handler', async () => {
(createUser as jest.Mock).mockImplementationOnce(() =>
Promise.resolve(undefined)
);
const { getByTestId } = render(<SignUp />);
const form = getByTestId('create-user-form');
const fullNameInput = getByTestId('full-name-input');
const usernameInput = getByTestId('username-input');
const emailInput = getByTestId('email-input');
expect(form).toBeInTheDocument();
fullNameInput.onchange = mockChangeHandler;
usernameInput.onchange = mockChangeHandler;
emailInput.onchange = mockChangeHandler;
await act(async () => {
fireEvent.change(fullNameInput, {
target: { name: 'displayName', value: 'Fname Mname Lname' },
});
fireEvent.change(usernameInput, {
target: { name: 'displayName', value: 'mockUserName' },
});
fireEvent.change(emailInput, {
target: { name: 'displayName', value: 'sample@sample.com' },
});
expect(mockChangeHandler).toHaveBeenCalledTimes(3);
form.onsubmit = mockSubmitHandler;
const createButton = getByTestId('create-button');
userEvent.click(createButton);
expect(mockSubmitHandler).toHaveBeenCalledTimes(1);
});
});
});

View File

@ -227,6 +227,7 @@ const SignUp = () => {
className="tw-text-white
tw-text-sm tw-py-2 tw-px-4 tw-font-semibold tw-rounded tw-h-10 tw-justify-self-end"
data-testid="create-button"
htmlType="submit"
type="primary">
{t('label.create')}
</Button>