diff --git a/src/components/Ecogesture/EcogestureCard/EcogestureCard.spec.tsx b/src/components/Ecogesture/EcogestureCard/EcogestureCard.spec.tsx
index 4bb4deaf40cd412c0305cb3c6510d41c9d042b26..7bf0a567e00af787773164dc4b57a4b2adf090bc 100644
--- a/src/components/Ecogesture/EcogestureCard/EcogestureCard.spec.tsx
+++ b/src/components/Ecogesture/EcogestureCard/EcogestureCard.spec.tsx
@@ -1,10 +1,8 @@
import { render, waitFor } from '@testing-library/react'
import EcogestureCard from 'components/Ecogesture/EcogestureCard/EcogestureCard'
-import { mount } from 'enzyme'
import React from 'react'
import { BrowserRouter } from 'react-router-dom'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
-import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
describe('EcogestureCard component', () => {
it('should be rendered correctly', async () => {
@@ -17,12 +15,12 @@ describe('EcogestureCard component', () => {
expect(container).toMatchSnapshot()
})
it('should be with default icon', async () => {
- const wrapper = mount(
+ const { container } = render(
<BrowserRouter>
<EcogestureCard ecogesture={mockedEcogesturesData[0]} />
</BrowserRouter>
)
- await waitForComponentToPaint(wrapper)
- expect(wrapper.find('.Icon').exists()).toBeTruthy()
+ await waitFor(() => null, { container })
+ expect(container.getElementsByClassName('Icon').length).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
index 650084258d585c8cee9829dc983aff1a3fca2e4c..700c11a8efa8c5877468079223efc666210373b4 100644
--- a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
@@ -1,6 +1,5 @@
-import Button from '@material-ui/core/Button'
-import { render } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render, screen } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureEmptyList from './EcogestureEmptyList'
@@ -24,8 +23,8 @@ describe('EcogestureEmptyList component', () => {
)
expect(container).toMatchSnapshot()
})
- it('should return to all ecogestures', () => {
- const wrapper = mount(
+ it('should return to all ecogestures', async () => {
+ render(
<EcogestureEmptyList
setTab={mockChangeTab}
isObjective={false}
@@ -33,11 +32,11 @@ describe('EcogestureEmptyList component', () => {
handleReinitClick={mockHandleClick}
/>
)
- wrapper.find(Button).first().simulate('click')
+ await userEvent.click(screen.getAllByRole('button')[0])
expect(mockChangeTab).toHaveBeenCalledTimes(1)
})
- it('should launch ecogesture form', () => {
- const wrapper = mount(
+ it('should launch ecogesture form', async () => {
+ render(
<EcogestureEmptyList
setTab={mockChangeTab}
isObjective={false}
@@ -45,11 +44,11 @@ describe('EcogestureEmptyList component', () => {
handleReinitClick={mockHandleClick}
/>
)
- wrapper.find(Button).at(1).simulate('click')
+ await userEvent.click(screen.getAllByRole('button')[1])
expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-form')
})
it('should render doing text with empty list on completed selection', () => {
- const wrapper = mount(
+ render(
<EcogestureEmptyList
setTab={mockChangeTab}
isObjective={false}
@@ -57,12 +56,12 @@ describe('EcogestureEmptyList component', () => {
handleReinitClick={mockHandleClick}
/>
)
- expect(wrapper.find('.text-16-normal').first().text()).toBe(
- 'ecogesture.emptyList.doing1_done'
- )
+ expect(
+ screen.getByText('ecogesture.emptyList.doing1_done')
+ ).toBeInTheDocument()
})
it('should render objective text with empty list on completed selection', () => {
- const wrapper = mount(
+ render(
<EcogestureEmptyList
setTab={mockChangeTab}
isObjective={true}
@@ -70,8 +69,8 @@ describe('EcogestureEmptyList component', () => {
handleReinitClick={mockHandleClick}
/>
)
- expect(wrapper.find('.text-16-normal').first().text()).toBe(
- 'ecogesture.emptyList.obj1_done'
- )
+ expect(
+ screen.getByText('ecogesture.emptyList.obj1_done')
+ ).toBeInTheDocument()
})
})
diff --git a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
index dde721578578d724cae9afc64681a0aab0e85ddc..bca146d8c915dad2fc87fdc2b59cd5cfe2528fb7 100644
--- a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
@@ -1,6 +1,5 @@
-import { Button } from '@material-ui/core'
-import { render } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render, screen } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureInitModal from './EcogestureInitModal'
@@ -17,26 +16,26 @@ describe('EcogestureInitModal component', () => {
)
expect(baseElement).toMatchSnapshot()
})
- it('should close modal', () => {
- const wrapper = mount(
+ it('should close modal', async () => {
+ render(
<EcogestureInitModal
open={true}
handleCloseClick={mockHandleClose}
handleLaunchForm={mockHandleLaunchForm}
/>
)
- wrapper.find(Button).first().simulate('click')
+ await userEvent.click(screen.getAllByRole('button')[1])
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
it('should close modal and launch form', async () => {
- const wrapper = mount(
+ render(
<EcogestureInitModal
open={true}
handleCloseClick={mockHandleClose}
handleLaunchForm={mockHandleLaunchForm}
/>
)
- wrapper.find(Button).at(1).simulate('click')
+ await userEvent.click(screen.getAllByRole('button')[2])
expect(mockHandleLaunchForm).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx b/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
index c6be11ce126c2999165f23cce9ad8169473c78d8..b230d0fd10a2a02fddb498042d9b629af2034c81 100644
--- a/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
@@ -1,15 +1,19 @@
-import { Button, MenuItem } from '@material-ui/core'
-import { render } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render, screen, waitFor } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
import * as storeHooks from 'store/hooks'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
import EcogestureList from './EcogestureList'
+const mockedNavigate = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useNavigate: () => mockedNavigate,
+}))
+
jest.mock(
'components/Ecogesture/EcogestureCard/EcogestureCard',
() => 'mock-ecogesturecard'
@@ -44,7 +48,7 @@ describe('EcogesturesList component', () => {
})
it('should open the filter menu and select all ecogesture', async () => {
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<BrowserRouter>
<EcogestureList
@@ -56,16 +60,14 @@ describe('EcogesturesList component', () => {
</BrowserRouter>
</Provider>
)
- await waitForComponentToPaint(wrapper)
- wrapper.find('.btnFilter').first().simulate('click')
- wrapper.find(Button).first().simulate('click')
- expect(wrapper.find('.filter-menu').exists()).toBeTruthy()
- wrapper.find(MenuItem).at(1).simulate('click')
+ await waitFor(() => null, { container })
+ await userEvent.click(screen.getAllByRole('button')[0])
+ await userEvent.click(screen.getAllByRole('menuitem')[1])
expect(updateEcogestureFilter).toHaveBeenCalledTimes(1)
})
- it('should display the selection section', async () => {
- const wrapper = mount(
+ it('should go to "/ecogesture-selection"', async () => {
+ const { container } = render(
<Provider store={store}>
<BrowserRouter>
<EcogestureList
@@ -77,7 +79,8 @@ describe('EcogesturesList component', () => {
</BrowserRouter>
</Provider>
)
- await waitForComponentToPaint(wrapper)
- expect(wrapper.find('.selection').exists()).toBeTruthy()
+ await waitFor(() => null, { container })
+ await userEvent.click(screen.getAllByRole('button')[1])
+ expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-selection')
})
})
diff --git a/src/components/Ecogesture/EcogestureModal/EcogestureModal.spec.tsx b/src/components/Ecogesture/EcogestureModal/EcogestureModal.spec.tsx
index 8cfd17faf6db498327f1a08d2520afb395bdd7c4..c1b52cc4ae8a501cf334847c1a5706b1f74ab65b 100644
--- a/src/components/Ecogesture/EcogestureModal/EcogestureModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureModal/EcogestureModal.spec.tsx
@@ -1,15 +1,14 @@
+import { render, screen, waitFor } from '@testing-library/react'
import EcogestureModal from 'components/Ecogesture/EcogestureModal/EcogestureModal'
-import { mount } from 'enzyme'
import React from 'react'
import { Provider } from 'react-redux'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
describe('EcogestureModal component', () => {
it('should be rendered correctly', async () => {
const store = createMockEcolyoStore()
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<EcogestureModal
open={true}
@@ -19,9 +18,9 @@ describe('EcogestureModal component', () => {
/>
</Provider>
)
- await waitForComponentToPaint(wrapper)
- expect(wrapper.find('.em-title').text()).toEqual(
- mockedEcogesturesData[0].shortName
- )
+ await waitFor(() => null, { container })
+ expect(
+ screen.getByText(mockedEcogesturesData[0].shortName)
+ ).toBeInTheDocument()
})
})
diff --git a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
index 60e0cfa1fac12399a020142ee9496d870dd7c837..28d77f7ca042e4cd09c9c22769d48655913f13cc 100644
--- a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
+++ b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
@@ -1,6 +1,5 @@
-import { Button } from '@material-ui/core'
-import { render } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render, screen } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureNotFound from './EcogestureNotFound'
@@ -21,11 +20,9 @@ describe('EcogestureNotFound component', () => {
)
expect(container).toMatchSnapshot()
})
- it('should click on button and be redirected', () => {
- const wrapper = mount(
- <EcogestureNotFound text="test" returnPage="ecogestures" />
- )
- wrapper.find(Button).simulate('click')
+ it('should click on button and be redirected', async () => {
+ render(<EcogestureNotFound text="test" returnPage="ecogestures" />)
+ await userEvent.click(screen.getByRole('button'))
expect(mockedNavigate).toHaveBeenCalledWith('/ecogestures')
})
})
diff --git a/src/components/Ecogesture/EcogestureTabsView.spec.tsx b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
index e0b184d524c1f7ee70872291c75a57b33f828434..4d68fe4730ab8f3043b23408ae75f214b1a41623 100644
--- a/src/components/Ecogesture/EcogestureTabsView.spec.tsx
+++ b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
@@ -1,15 +1,11 @@
-import { IconButton, Tab } from '@material-ui/core'
import { render, screen, waitFor } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import EcogestureTabsView from 'components/Ecogesture/EcogestureTabsView'
-import { mount } from 'enzyme'
import React from 'react'
import { Provider } from 'react-redux'
import * as profileActions from 'store/profile/profile.slice'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
-import EcogestureEmptyList from './EcogestureEmptyList/EcogestureEmptyList'
-import EcogestureInitModal from './EcogestureInitModal/EcogestureInitModal'
const mockGetAllEcogestures = jest.fn()
jest.mock('services/ecogesture.service', () => {
@@ -59,46 +55,43 @@ describe('EcogestureView component', () => {
it('should render ecogesture init modal', async () => {
const updateProfileSpy = jest.spyOn(profileActions, 'updateProfile')
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
-
- expect(wrapper.find(EcogestureInitModal).exists()).toBeTruthy()
- wrapper.find(IconButton).first().simulate('click')
- await waitForComponentToPaint(wrapper)
-
+ await waitFor(() => null, { container })
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ await userEvent.click(screen.getAllByRole('button')[0])
expect(updateProfileSpy).toHaveBeenCalledWith({
haveSeenEcogestureModal: true,
})
})
it('should render empty list', async () => {
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
-
- expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
+ await waitFor(() => null, { container })
+ expect(
+ container.getElementsByClassName('ec-empty-container').length
+ ).toBeTruthy()
})
it('should change tab', async () => {
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
-
- wrapper.find(Tab).first().simulate('click')
+ await waitFor(() => null, { container })
+ await userEvent.click(screen.getAllByRole('button')[1])
mockGetAllEcogestures.mockResolvedValueOnce([])
-
- await waitForComponentToPaint(wrapper)
-
- expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
+ await waitFor(() => null, { container })
+ expect(
+ container.getElementsByClassName('ec-empty-container').length
+ ).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/SingleEcogestureView.spec.tsx b/src/components/Ecogesture/SingleEcogestureView.spec.tsx
index a2ec8525df0ca5410f63b68d8e0ec084b25277c6..5f89c46a40f1459f52cfd96a25921a9cfa704b22 100644
--- a/src/components/Ecogesture/SingleEcogestureView.spec.tsx
+++ b/src/components/Ecogesture/SingleEcogestureView.spec.tsx
@@ -1,10 +1,9 @@
-import { render, waitFor } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render, screen, waitFor } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
import SingleEcogestureView from './SingleEcogestureView'
jest.mock(
@@ -37,52 +36,49 @@ describe('SingleEcogesture component', () => {
expect(container).toMatchSnapshot()
})
- it('should change doing status', async () => {
+ it('should be able to show more details and change status', async () => {
mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
-
- const updatedEcogesture = { ...mockedEcogesturesData[0], doing: true }
+ const updatedEcogesture = { ...mockedEcogesturesData[0], objective: true }
mockUpdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
- const wrapper = mount(
+
+ const { container } = render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
- wrapper.find('.doing-btn').first().simulate('click')
- await waitForComponentToPaint(wrapper)
+ await waitFor(() => null, { container })
+ const [, objective] = screen.getAllByRole('button')
+ await userEvent.click(objective)
expect(mockUpdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
- it('should change objective status', async () => {
- mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
- const updatedEcogesture = { ...mockedEcogesturesData[0], objective: true }
+ it('should change doing status', async () => {
+ mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
+ const updatedEcogesture = { ...mockedEcogesturesData[0], doing: true }
mockUpdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
- wrapper.find('.objective-btn').first().simulate('click')
- await waitForComponentToPaint(wrapper)
+ await waitFor(() => null, { container })
+ const [, , doing] = screen.getAllByRole('button')
+ await userEvent.click(doing)
expect(mockUpdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
+
it('should toggle more details', async () => {
mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
- const wrapper = mount(
+ const { container } = render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitForComponentToPaint(wrapper)
-
- wrapper.find('.showMore').first().simulate('click')
- await waitForComponentToPaint(wrapper)
-
- expect(wrapper.find('.showMore').first().text()).toBe(
- 'ecogesture_modal.show_less'
- )
+ await waitFor(() => null, { container })
+ const [showMore] = screen.getAllByRole('button')
+ await userEvent.click(showMore)
+ expect(screen.getByText('ecogesture_modal.show_less')).toBeInTheDocument()
})
})