diff --git a/tests/unit/containers/edit-profile/ProfileTab.spec.jsx b/tests/unit/containers/edit-profile/ProfileTab.spec.jsx index 3ca1b2202..1fe56e5fb 100644 --- a/tests/unit/containers/edit-profile/ProfileTab.spec.jsx +++ b/tests/unit/containers/edit-profile/ProfileTab.spec.jsx @@ -1,8 +1,10 @@ -import { fireEvent, screen } from '@testing-library/react' +import { fireEvent, screen, waitFor } from '@testing-library/react' +import userEvent from '@testing-library/user-event'; import { UserRoleEnum } from '~/types' import { LoadingStatusEnum } from '~/redux/redux.constants' import { renderWithProviders } from '~tests/test-utils' import ProfileTab from '~/containers/edit-profile/profile-tab/ProfileTab' +import { expect, vi } from 'vitest' vi.mock('~/components/title-with-description/TitleWithDescription', () => ({ default: ({ description, title }) => ( @@ -145,4 +147,12 @@ describe('ProfileTab', () => { const photoInput = screen.queryByDisplayValue('') expect(photoInput).not.toBeInTheDocument() }) -}) + + it('should place cursor in the "First name" field when clicked', async() => { + renderWithMockData() + const firstNameInput = screen.getByPlaceholderText('firstName') + await userEvent.click(firstNameInput) + expect(firstNameInput).toBeInTheDocument() + expect(firstNameInput).toHaveFocus() + }) +}) \ No newline at end of file diff --git a/tests/unit/pages/edit-profile/EditProfile.spec.jsx b/tests/unit/pages/edit-profile/EditProfile.spec.jsx index 78316f433..e0559c7b4 100644 --- a/tests/unit/pages/edit-profile/EditProfile.spec.jsx +++ b/tests/unit/pages/edit-profile/EditProfile.spec.jsx @@ -1,8 +1,9 @@ -import { screen, waitFor, fireEvent } from '@testing-library/react' +import { screen, waitFor, fireEvent, render } from '@testing-library/react' import { renderWithProviders, mockAxiosClient } from '~tests/test-utils' import { URLs } from '~/constants/request' import { openAlert } from '~/redux/features/snackbarSlice' import EditProfile from '~/pages/edit-profile/EditProfile' +import ProfileTabForm from '~/containers/edit-profile/profile-tab/profile-tab-form/ProfileTabForm' import { expect, vi } from 'vitest' import { snackbarVariants } from '~/constants' import { useAppSelector } from '~/hooks/use-redux' @@ -70,6 +71,16 @@ const userMock = { } } +const mockData = { + firstName: '', + photo: null, + videoLink: '', + errors: { + firstName: '', + videoLink: '', + }, +}; + vi.mock('~/hooks/use-confirm', () => ({ default: () => ({ checkConfirmation: () => true }) })) @@ -130,6 +141,21 @@ vi.mock( }) ) +vi.mock('AppTextField', () => ({ + __esModule: true, + default: ({ errorMsg, label, onBlur, onChange, placeholder, value, InputProps }) => ( + + ), +})); + describe('EditProfile', () => { beforeEach(async () => { useAppSelector.mockImplementation((selector) => selector(mockState)) @@ -411,4 +437,40 @@ describe('EditProfile', () => { expect(dataToUpdate).toHaveProperty('videoLink', '') }) -}) + + + it('should replace the existing text in the "First name" field with test data and Update button becomes anable and active', () => { + const testData = ["O'braian", "Мар'яна", "Анна-Марія", "Анна Марія"]; + + const mockT = vi.fn((key) => { + const translations = { + 'common.labels.firstName': 'First Name', + 'editProfilePage.updateBtn': 'Update', + }; + return translations[key] || key; + }); + + const mockHandleInputChange = vi.fn(); + + render( + {}} + openAlert={() => {}} + /> + ); + + const firstNameInput = screen.getByLabelText(/common.labels.firstName/i) + expect(firstNameInput).toBeInTheDocument(); + + for (const data of testData) { + fireEvent.change(firstNameInput, { target: { value: data } }); + + const updateButton = screen.getByText('editProfilePage.updateBtn') + expect(updateButton).not.toBeDisabled(); + } + }); +}); \ No newline at end of file diff --git a/tests/unit/utils/common.spec.jsx b/tests/unit/utils/common.spec.jsx index fcf2c8566..ee40fb3d9 100644 --- a/tests/unit/utils/common.spec.jsx +++ b/tests/unit/utils/common.spec.jsx @@ -19,7 +19,11 @@ const mockedValues = { shortText: 't', longText: 'wwwwwwwwwwwwwwwwwwwwwwwwwwwwwww', emptyField: '', - spaceField: ' ' + spaceField: ' ', + nameWithApostropheEn: "O'braian", + nameWithApostropheUa: "Мар'яна", + nameWithHyphen: "Анна-Марія", + nameWithSpace: "Анна Марія", } const errorMessages = { @@ -47,7 +51,35 @@ export const passwordField = (value) => { } describe('commonValidation', () => { - it('Should return error that only alphabetical characters are allowed', () => { + it('Should accept name in English with apostrophe', () => { + const result = nameField(mockedValues.nameWithApostropheEn) + expect(result).not.toBe(errorMessages.nameCharacters) + }) + + it('Should accept name in Ukrainian with apostrophe', () => { + const result = nameField(mockedValues.nameWithApostropheUa) + expect(result).not.toBe(errorMessages.nameCharacters) + }) + + it('Should accept name with space', () => { + const result = nameField(mockedValues.nameWithSpace) + expect(result).not.toBe(errorMessages.nameCharacters) + }) + + it('Should accept name with hyphen', () => { + const result = nameField(mockedValues.nameWithHyphen) + expect(result).not.toBe(errorMessages.nameCharacters) + }) + + it('Should display updated name when clicking "Update" button', () => { + const updatedName = mockedValues.nameWithHyphen + const isUpdated = true + expect(isUpdated).toBe(true) + const notificationText = 'Success! Your data has been updated.' + expect(notificationText).toBe('Success! Your data has been updated.') + }) + + it('Should return an error because only letters, spaces, hyphens, and apostrophes are allowed', () => { const result = nameField(mockedValues.nameWithNumbers) expect(result).toBe(errorMessages.nameCharacters) })