test: replace getByRole methods

src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx

@@ -35,9 +35,12 @@ describe('MaxConsumptionCard component', () => {
       </Provider>
     )
     await waitFor(() => null, { container })
-    const [prevButton, nextButton] = screen.getAllByRole('button')
-    expect(prevButton).toBeDisabled()
-    expect(nextButton).toBeDisabled()
+    expect(
+      screen.getByLabelText('consumption.accessibility.button_previous_value')
+    ).toBeDisabled()
+    expect(
+      screen.getByLabelText('consumption.accessibility.button_next_value')
+    ).toBeDisabled()
   })
   it('should be rendered with several fluids and click navigate between fluid', async () => {
     const { container } = render(

src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx

@@ -65,10 +65,8 @@ describe('ChallengeCardDone component', () => {
           <ChallengeCardDone userChallenge={userChallengeData[0]} />
         </Provider>
       )
-      const resetButton = screen.getByRole('button', {
-        name: 'challenge.card_done.reset_defi',
-      })
-      expect(resetButton).toHaveProperty('disabled')
+      const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+      expect(resetBtn).toHaveProperty('disabled')
       expect(mockDispatch).toHaveBeenCalledTimes(0)
       expect(mockUpdateUserChallenge).toHaveBeenCalledTimes(0)
     })
@@ -78,10 +76,8 @@ describe('ChallengeCardDone component', () => {
           <ChallengeCardDone userChallenge={userChallengeData[1]} />
         </Provider>
       )
-      const resetButton = screen.getByRole('button', {
-        name: 'challenge.card_done.reset_defi',
-      })
-      expect(resetButton).toHaveClass('btnPrimaryNegative')
+      const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+      expect(resetBtn).toHaveClass('btnPrimaryNegative')
     })
     it('should be secondary button is challenge is won', async () => {
       render(
@@ -89,10 +85,8 @@ describe('ChallengeCardDone component', () => {
           <ChallengeCardDone userChallenge={userChallengeData[0]} />
         </Provider>
       )
-      const resetButton = screen.getByRole('button', {
-        name: 'challenge.card_done.reset_defi',
-      })
-      expect(resetButton).toHaveClass('btnSecondary')
+      const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+      expect(resetBtn).toHaveClass('btnSecondary')
     })
   })
 })

src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx

@@ -84,7 +84,9 @@ describe('ChallengeCardUnlocked component', () => {
         <ChallengeCardUnlocked userChallenge={userChallengeData[0]} />
       </Provider>
     )
-    const resetButton = screen.getByRole('button')
-    expect(resetButton).toHaveAttribute('disabled')
+    const launchBtn = screen.getByLabelText(
+      'challenge.accessibility.button_launch'
+    )
+    expect(launchBtn).toHaveAttribute('disabled')
   })
 })

src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx

@@ -15,13 +15,14 @@ describe('FormNavigation component', () => {
         disablePrevButton={false}
       />
     )
-    const [prevButton, nextButton] = screen.getAllByRole('button')
     await act(async () => {
-      await userEvent.click(prevButton)
+      await userEvent.click(
+        screen.getByText('profile_type.form.button_previous')
+      )
     })
     expect(mockHandlePrevious).toHaveBeenCalled()
     await act(async () => {
-      await userEvent.click(nextButton)
+      await userEvent.click(screen.getByText('profile_type.form.button_next'))
     })
     expect(mockHandleNext).toHaveBeenCalled()
   })

src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx

@@ -46,9 +46,7 @@ describe('ExpiredConsentModal component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(
-        screen.getByRole('button', { name: 'consent_outdated.go' })
-      )
+      await userEvent.click(screen.getByText('consent_outdated.go'))
     })
     expect(mockAppDispatch).toHaveBeenCalledTimes(1)
     expect(mockedNavigate).toHaveBeenCalledTimes(1)
@@ -68,9 +66,7 @@ describe('ExpiredConsentModal component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(
-        screen.getByRole('button', { name: 'consent_outdated.go' })
-      )
+      await userEvent.click(screen.getByText('consent_outdated.yes'))
     })
     expect(mockAppDispatch).toHaveBeenCalledTimes(1)
     expect(mockedNavigate).toHaveBeenCalledTimes(1)
@@ -87,9 +83,7 @@ describe('ExpiredConsentModal component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(
-        screen.getByRole('button', { name: 'consent_outdated.later' })
-      )
+      await userEvent.click(screen.getByText('consent_outdated.no'))
     })
     expect(mockHandleCloseClick).toHaveBeenCalled()
   })

src/components/Connection/SGEConnect/SgeConnectView.spec.tsx

@@ -45,12 +45,12 @@ describe('SgeConnectView component', () => {
       screen.getByText('auth.enedissgegrandlyon.identityTitle')
     ).toBeInTheDocument()
 
-    const prevButton = screen.getByRole('button', {
-      name: 'profile_type.accessibility.button_previous',
-    })
-    const nextButton = screen.getByRole('button', {
-      name: 'profile_type.accessibility.button_next',
-    })
+    const prevButton = screen.getByLabelText(
+      'profile_type.accessibility.button_previous'
+    )
+    const nextButton = screen.getByLabelText(
+      'profile_type.accessibility.button_next'
+    )
     expect(prevButton).toBeDisabled()
     expect(nextButton).toBeDisabled()
   })

src/components/Connection/SGEConnect/SgeInit.spec.tsx

@@ -28,7 +28,7 @@ describe('SgeInit component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[0])
+      await userEvent.click(screen.getByText('auth.enedissgegrandlyon.connect'))
     })
     expect(mockedNavigate).toHaveBeenCalled()
   })

src/components/Connection/SGEConnect/StepConsent.spec.tsx

@@ -24,15 +24,15 @@ describe('StepConsent component', () => {
         onChange={mockHandleChange}
       />
     )
-    const consentCheckbox = screen.getByRole('checkbox', {
-      name: 'auth.enedissgegrandlyon.consentCheck1',
-    })
+    const consentCheckbox = screen.getByLabelText(
+      'auth.enedissgegrandlyon.consentCheck1'
+    )
     await userEvent.click(consentCheckbox)
     expect(mockHandleChange).toHaveBeenCalledWith('dataConsent', true)
 
-    const pdlCheckbox = screen.getByRole('checkbox', {
-      name: 'auth.enedissgegrandlyon.consentCheck2',
-    })
+    const pdlCheckbox = screen.getByLabelText(
+      'auth.enedissgegrandlyon.consentCheck2'
+    )
     await userEvent.click(pdlCheckbox)
     expect(mockHandleChange).toHaveBeenCalledWith('pdlConfirm', true)
   })

src/components/Connection/SGEConnect/StepIdentityAndPdl.spec.tsx

@@ -56,11 +56,10 @@ describe('StepIdentityAndPdl component', () => {
         onChange={mockHandleChange}
       />
     )
-    const pdlModalButton = screen.getByRole('button', {
-      name: 'auth.enedissgegrandlyon.pdlModal.title',
-    })
     await act(async () => {
-      await userEvent.click(pdlModalButton)
+      await userEvent.click(
+        screen.getByText('auth.enedissgegrandlyon.pdlModal.title')
+      )
     })
     expect(screen.getByRole('dialog')).toBeInTheDocument()
   })

src/components/ConsumptionVisualizer/DataloadNoValue.spec.tsx

@@ -122,7 +122,9 @@ describe('DataloadNoValue component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getByRole('button'))
+      await userEvent.click(
+        screen.getByText('consumption_visualizer.missing_data')
+      )
     })
     expect(mockDispatch).toHaveBeenCalledWith({
       type: 'chart/setShowConnectionDetails',

src/components/ConsumptionVisualizer/DataloadSectionValue.spec.tsx

@@ -89,7 +89,9 @@ describe('DataloadSectionValue component', () => {
         />
       )
       await act(async () => {
-        await userEvent.click(screen.getByRole('button'))
+        await userEvent.click(
+          screen.getByText('consumption_visualizer.estimated')
+        )
       })
       expect(mockToggleEstimationModal).toHaveBeenCalled()
     })

src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.spec.tsx

@@ -189,7 +189,7 @@ describe('InfoDataConsumptionVisualizer component', () => {
   })
 
   it('should click on last valid data date and move to it', async () => {
-    const mockDataLoad = { ...baseDataLoad, state: DataloadState.EMPTY }
+    const mockDataLoad = { ...baseDataLoad, state: DataloadState.UPCOMING }
     render(
       <Provider store={store}>
         <InfoDataConsumptionVisualizer
@@ -200,9 +200,11 @@ describe('InfoDataConsumptionVisualizer component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getByRole('button'))
+      await userEvent.click(
+        screen.getByText('consumption_visualizer.last_available_data')
+      )
     })
-    expect(screen.getByRole('dialog')).toBeInTheDocument()
+    expect(mockAppDispatch).toHaveBeenCalled()
   })
 
   it('should click to display NoDataModal', async () => {
@@ -217,8 +219,10 @@ describe('InfoDataConsumptionVisualizer component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getByRole('button'))
+      await userEvent.click(
+        screen.getByText('consumption_visualizer.why_no_data')
+      )
     })
-    expect(mockAppDispatch).toHaveBeenCalled()
+    expect(screen.getByRole('dialog')).toBeInTheDocument()
   })
 })

src/components/DateNavigator/DateNavigator.spec.tsx

@@ -44,13 +44,16 @@ describe('DateNavigator component', () => {
         timeStep={TimeStep.MONTH}
       />
     )
-    const [prevIcon, nextIcon] = screen.getAllByRole('button')
     await act(async () => {
-      await userEvent.click(prevIcon)
+      await userEvent.click(
+        screen.getByLabelText('consumption.accessibility.button_previous_value')
+      )
     })
     expect(mockHandlePrevDate).toHaveBeenCalledTimes(1)
     await act(async () => {
-      await userEvent.click(nextIcon)
+      await userEvent.click(
+        screen.getByLabelText('consumption.accessibility.button_next_value')
+      )
     })
     expect(mockHandleNextDate).toHaveBeenCalledTimes(1)
   })
@@ -66,8 +69,13 @@ describe('DateNavigator component', () => {
         timeStep={TimeStep.MONTH}
       />
     )
-    const [prevIcon, nextButton] = screen.getAllByRole('button')
-    expect(prevIcon).toBeDisabled()
-    expect(nextButton).toBeDisabled()
+    const prev = screen.queryByLabelText(
+      'consumption.accessibility.button_previous_value'
+    )
+    const next = screen.queryByLabelText(
+      'consumption.accessibility.button_next_value'
+    )
+    expect(prev).toBeDisabled()
+    expect(next).toBeDisabled()
   })
 })

src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx

@@ -32,7 +32,7 @@ describe('EcogestureEmptyList component', () => {
       />
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[0])
+      await userEvent.click(screen.getByLabelText('ecogesture.emptyList.btn1'))
     })
     expect(mockChangeTab).toHaveBeenCalledTimes(1)
   })
@@ -46,7 +46,7 @@ describe('EcogestureEmptyList component', () => {
       />
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[1])
+      await userEvent.click(screen.getByLabelText('ecogesture.emptyList.btn2'))
     })
     expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-form')
   })

src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx

@@ -25,7 +25,7 @@ describe('EcogestureInitModal component', () => {
       />
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[2])
+      await userEvent.click(screen.getByText('ecogesture.initModal.btn1'))
     })
     expect(mockHandleClose).toHaveBeenCalledTimes(1)
   })
@@ -38,7 +38,7 @@ describe('EcogestureInitModal component', () => {
       />
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[1])
+      await userEvent.click(screen.getByText('ecogesture.initModal.btn2'))
     })
     expect(mockHandleLaunchForm).toHaveBeenCalledTimes(1)
   })

src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx

@@ -61,7 +61,7 @@ describe('EcogesturesList component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[0])
+      await userEvent.click(screen.getByText('ecogesture.MENU_TITLE'))
     })
     await act(async () => {
       await userEvent.click(screen.getAllByRole('menuitem')[1])
@@ -83,7 +83,7 @@ describe('EcogesturesList component', () => {
       </Provider>
     )
     await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[1])
+      await userEvent.click(screen.getByText('ecogesture.button_selection'))
     })
     expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-selection')
   })

src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx

@@ -23,7 +23,7 @@ describe('EcogestureNotFound component', () => {
   it('should click on button and be redirected', async () => {
     render(<EcogestureNotFound text="test" returnPage="ecogestures" />)
     await act(async () => {
-      await userEvent.click(screen.getByRole('button'))
+      await userEvent.click(screen.getByText('error_page.back'))
     })
     expect(mockedNavigate).toHaveBeenCalledWith('/ecogestures')
   })

src/components/Ecogesture/EcogestureTabsView.spec.tsx

-import { act, render, screen, waitFor } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
 import { userEvent } from '@testing-library/user-event'
 import EcogestureTabsView from 'components/Ecogesture/EcogestureTabsView'
 import { Ecogesture } from 'models'
@@ -77,8 +77,10 @@ describe('EcogestureView component', () => {
     )
     expect(screen.getByRole('dialog')).toBeInTheDocument()
 
-    await act(async () => {
-      await userEvent.click(screen.getAllByRole('button')[0])
+    await waitFor(async () => {
+      await userEvent.click(
+        screen.getByLabelText('feedback.accessibility.button_close')
+      )
     })
     expect(updateProfileSpy).toHaveBeenCalledWith({
       haveSeenEcogestureModal: true,

src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.spec.tsx

@@ -49,9 +49,10 @@ describe('EcogestureFormSingleChoice component', () => {
       </Provider>
     )
     await userEvent.click(screen.getAllByRole('radio')[0])
-    const [, next] = screen.getAllByRole('button')
     await act(async () => {
-      await userEvent.click(next)
+      await userEvent.click(
+        screen.getByLabelText('profile_type.accessibility.button_next')
+      )
     })
     expect(mockHandleNextStep).toHaveBeenCalledTimes(1)
   })
@@ -68,9 +69,10 @@ describe('EcogestureFormSingleChoice component', () => {
         />
       </Provider>
     )
-    const [prev] = screen.getAllByRole('button')
     await act(async () => {
-      await userEvent.click(prev)
+      await userEvent.click(
+        screen.getByLabelText('profile_type.accessibility.button_previous')
+      )
     })
     expect(mockHandlePreviousStep).toHaveBeenCalledTimes(1)
   })

src/components/EcogestureForm/EcogestureFormView.spec.tsx

@@ -71,29 +71,14 @@ describe('EcogestureFormView component', () => {
     )
     await act(async () => {
       await userEvent.click(screen.getAllByRole('radio')[0])
-      await userEvent.click(screen.getAllByRole('button')[1])
+      await userEvent.click(
+        screen.getByLabelText('profile_type.accessibility.button_next')
+      )
     })
     expect(
       container.getElementsByClassName('ecogesture-form-single').length
     ).toBeTruthy()
   })
-  it('should go to previous step', async () => {
-    const { container } = render(
-      <Provider store={store}>
-        <EcogestureFormView />
-      </Provider>
-    )
-
-    const [, next] = screen.getAllByRole('button')
-    await act(async () => {
-      await userEvent.click(screen.getAllByRole('radio')[0])
-      await userEvent.click(next)
-    })
-
-    expect(
-      container.getElementsByClassName('ecogesture-form-single').length
-    ).toBeTruthy()
-  })
 
   it('should handle form end', async () => {
     mockAppDispatch.mockReturnValue(jest.fn())
@@ -115,7 +100,8 @@ describe('EcogestureFormView component', () => {
         <EcogestureFormView />
       </Provider>
     )
-    const [prev] = screen.getAllByRole('button')
-    expect(prev).toBeDisabled()
+    expect(
+      screen.getByLabelText('profile_type.accessibility.button_previous')
+    ).toBeDisabled()
   })
 })