diff --git a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx index efaf28189242e8be1aaa2611bf7560d58c607686..402a3a0bffeea34b3b24e2479491759dbadf4bb7 100644 --- a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx +++ b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx @@ -1,5 +1,5 @@ -import { Button } from '@material-ui/core' -import { mount } from 'enzyme' +import { render, screen } from '@testing-library/react' +import userEvent from '@testing-library/user-event' import React from 'react' import { Provider } from 'react-redux' import UsageEventService from 'services/usageEvent.service' @@ -16,40 +16,36 @@ jest.mock('react-router-dom', () => ({ useNavigate: () => mockedNavigate, })) -const mockAddEvent = jest.fn() jest.mock('services/usageEvent.service') -UsageEventService.addEvent = mockAddEvent +UsageEventService.addEvent = jest.fn() -const mockGetAllProfileTypes = jest.fn() -const mockDeleteProfileTypes = jest.fn() jest.mock('services/profileTypeEntity.service', () => { return jest.fn(() => ({ - getAllProfileTypes: mockGetAllProfileTypes, - deleteProfileTypes: mockDeleteProfileTypes, + getAllProfileTypes: jest.fn(), + deleteProfileTypes: jest.fn(), })) }) describe('ProfileTypeFinished component', () => { const store = createMockEcolyoStore() - beforeEach(() => { - jest.clearAllMocks() - }) it('should be rendered correctly', async () => { - const wrapper = mount( + const { container } = render( <Provider store={store}> <ProfileTypeFinished profileType={mockProfileType} /> </Provider> ) - expect(wrapper.find('profile-type-finished-card')).toBeTruthy() + expect( + container.getElementsByClassName('profile-type-finished-card')[0] + ).toBeInTheDocument() }) - it('should go to ecogesture selection', () => { - const wrapper = mount( + it('should go to ecogesture selection', async () => { + render( <Provider store={store}> <ProfileTypeFinished profileType={mockProfileType} /> </Provider> ) - wrapper.find(Button).first().simulate('click') + await userEvent.click(screen.getAllByRole('button')[0]) expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-selection') }) }) diff --git a/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.spec.tsx b/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.spec.tsx index 4abad2652cce93fb255da34448fda9a142e631cc..7d2c179af80c9a3e24c075bb41856509d69a1b3d 100644 --- a/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.spec.tsx +++ b/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.spec.tsx @@ -1,5 +1,5 @@ +import { render, screen } from '@testing-library/react' import { ProfileTypeStepForm } from 'enums' -import { mount } from 'enzyme' import React from 'react' import { Provider } from 'react-redux' import { @@ -9,25 +9,22 @@ import { import { createMockEcolyoStore } from 'tests/__mocks__/store' import ProfileTypeFormMultiChoice from './ProfileTypeFormMultiChoice' -const mockHandlePrevious = jest.fn() -const mockHandleNext = jest.fn() - describe('ProfileTypeFormMultiChoice component', () => { const store = createMockEcolyoStore() it('should be rendered correctly', () => { - const wrapper = mount( + render( <Provider store={store}> <ProfileTypeFormMultiChoice step={ProfileTypeStepForm.COOKING_FLUID} viewedStep={ProfileTypeStepForm.AREA} currentProfileType={mockProfileType} - answerType={mockProfileTypeAnswers[1]} - setNextStep={mockHandlePrevious} - setPreviousStep={mockHandleNext} + answerType={mockProfileTypeAnswers[8]} + setNextStep={jest.fn()} + setPreviousStep={jest.fn()} /> </Provider> ) - expect(wrapper.find('input')).toBeTruthy() + expect(screen.getAllByRole('checkbox').length).toBeTruthy() }) }) diff --git a/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.spec.tsx b/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.spec.tsx index f272691bbd6efd2744606f5d494b34c4a50c4b7f..a53dad4bab43fa7a9819ba182a99c793b9dd8301 100644 --- a/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.spec.tsx +++ b/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.spec.tsx @@ -1,5 +1,5 @@ +import { render, screen } from '@testing-library/react' import { ProfileTypeStepForm } from 'enums' -import { mount } from 'enzyme' import React from 'react' import { Provider } from 'react-redux' import { @@ -9,25 +9,22 @@ import { import { createMockEcolyoStore } from 'tests/__mocks__/store' import ProfileTypeFormNumber from './ProfileTypeFormNumber' -const mockHandlePrevious = jest.fn() -const mockHandleNext = jest.fn() - describe('ProfileTypeFormNumber component', () => { const store = createMockEcolyoStore() it('should be rendered correctly', () => { - const wrapper = mount( + render( <Provider store={store}> <ProfileTypeFormNumber step={ProfileTypeStepForm.COOKING_FLUID} viewedStep={ProfileTypeStepForm.AREA} currentProfileType={mockProfileType} answerType={mockProfileTypeAnswers[1]} - setNextStep={mockHandlePrevious} - setPreviousStep={mockHandleNext} + setNextStep={jest.fn()} + setPreviousStep={jest.fn()} /> </Provider> ) - expect(wrapper.find('input')).toBeTruthy() + expect(screen.getByRole('spinbutton')).toBeInTheDocument() }) }) diff --git a/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.spec.tsx b/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.spec.tsx index c575f170dfc097af77f0f2df3bf6ade0f059bc4e..0b4d386c5eb7da75cddb76107b5d482f6cbd7844 100644 --- a/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.spec.tsx +++ b/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.spec.tsx @@ -1,5 +1,5 @@ +import { render } from '@testing-library/react' import { ProfileTypeStepForm } from 'enums' -import { mount } from 'enzyme' import React from 'react' import { Provider } from 'react-redux' import { @@ -9,25 +9,22 @@ import { import { createMockEcolyoStore } from 'tests/__mocks__/store' import ProfileTypeFormNumberSelection from './ProfileTypeFormNumberSelection' -const mockHandlePrevious = jest.fn() -const mockHandleNext = jest.fn() - describe('ProfileTypeFormNumberSelection component', () => { const store = createMockEcolyoStore() - it('should be rendered correctly', () => { - const wrapper = mount( + it('should be rendered correctly', async () => { + const { container } = render( <Provider store={store}> <ProfileTypeFormNumberSelection step={ProfileTypeStepForm.COOKING_FLUID} viewedStep={ProfileTypeStepForm.AREA} currentProfileType={mockProfileType} answerType={mockProfileTypeAnswers[3]} - setNextStep={mockHandleNext} - setPreviousStep={mockHandlePrevious} + setNextStep={jest.fn()} + setPreviousStep={jest.fn()} /> </Provider> ) - expect(wrapper.find('input')).toBeTruthy() + expect(container.getElementsByTagName('input')[0]).toBeInTheDocument() }) }) diff --git a/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.spec.tsx b/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.spec.tsx index 5ee630d394f4889819d8870ea47a778ba2e02c28..d0b4859c2d33d1493a5537ec5195bd37fe0958ef 100644 --- a/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.spec.tsx +++ b/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.spec.tsx @@ -1,5 +1,5 @@ +import { render, screen } from '@testing-library/react' import { ProfileTypeStepForm } from 'enums' -import { mount } from 'enzyme' import React from 'react' import { Provider } from 'react-redux' import { @@ -9,25 +9,22 @@ import { import { createMockEcolyoStore } from 'tests/__mocks__/store' import ProfileTypeFormSingleChoice from './ProfileTypeFormSingleChoice' -const mockHandlePrevious = jest.fn() -const mockHandleNext = jest.fn() - describe('ProfileTypeFormSingleChoice component', () => { const store = createMockEcolyoStore() it('should be rendered correctly', () => { - const wrapper = mount( + render( <Provider store={store}> <ProfileTypeFormSingleChoice step={ProfileTypeStepForm.COOKING_FLUID} viewedStep={ProfileTypeStepForm.AREA} currentProfileType={mockProfileType} - answerType={mockProfileTypeAnswers[1]} - setNextStep={mockHandleNext} - setPreviousStep={mockHandlePrevious} + answerType={mockProfileTypeAnswers[3]} + setNextStep={jest.fn()} + setPreviousStep={jest.fn()} /> </Provider> ) - expect(wrapper.find('input')).toBeTruthy() + expect(screen.getAllByRole('radio').length).toBeTruthy() }) }) diff --git a/src/components/ProfileType/ProfileTypeView.spec.tsx b/src/components/ProfileType/ProfileTypeView.spec.tsx index a2192fa8995f0b01af52e76805d20169ff381f28..c9bc054f90caf1450ffe2f3b6d9bdea50cd6be8a 100644 --- a/src/components/ProfileType/ProfileTypeView.spec.tsx +++ b/src/components/ProfileType/ProfileTypeView.spec.tsx @@ -1,5 +1,5 @@ +import { render } from '@testing-library/react' import ProfileTypeView from 'components/ProfileType/ProfileTypeView' -import { mount } from 'enzyme' import React from 'react' import { Provider } from 'react-redux' import { createMockEcolyoStore } from 'tests/__mocks__/store' @@ -12,14 +12,20 @@ describe('ProfileTypeView component', () => { const store = createMockEcolyoStore() it('should be rendered correctly', () => { - const wrapper = mount( + const { container } = render( <Provider store={store}> <ProfileTypeView /> </Provider> ) - expect(wrapper.find('mock-cozybar').exists()).toBeTruthy() - expect(wrapper.find('mock-header').exists()).toBeTruthy() - expect(wrapper.find('mock-content').exists()).toBeTruthy() - expect(wrapper.find('.profile-type-container').exists()).toBeTruthy() + expect( + container.getElementsByTagName('mock-cozybar')[0] + ).toBeInTheDocument() + expect(container.getElementsByTagName('mock-header')[0]).toBeInTheDocument() + expect( + container.getElementsByTagName('mock-content')[0] + ).toBeInTheDocument() + expect( + container.getElementsByClassName('profile-type-container')[0] + ).toBeInTheDocument() }) })