ActionView.spec.tsx

import ActionView from 'components/Action/ActionView'
import { UserActionState } from 'enums'
import { mount } from 'enzyme'
import toJson from 'enzyme-to-json'
import React from 'react'
import { Provider } from 'react-redux'
import { createMockEcolyoStore } from '../../../tests/__mocks__/store'
import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
import { userChallengeData } from '../../../tests/__mocks__/userChallengeData.mock'
import ActionChoose from './ActionChoose'
import ActionDone from './ActionDone'
import ActionOnGoing from './ActionOnGoing'

jest.mock('cozy-ui/transpiled/react/I18n', () => ({
  useI18n: jest.fn(() => ({
    t: (str: string) => str,
  })),
}))
const mockedNavigate = jest.fn()
jest.mock('react-router-dom', () => ({
  ...jest.requireActual('react-router-dom'),
  useNavigate: () => mockedNavigate,
}))
jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
jest.mock('components/Header/Header', () => 'mock-header')
jest.mock('components/Content/Content', () => 'mock-content')
jest.mock('components/Action/ActionBegin', () => 'mock-action-begin')

describe('ActionView component', () => {
  it('should render ActionChoose component', async () => {
    const store = createMockEcolyoStore({
      challenge: {
        currentChallenge: {
          ...userChallengeData[1],
          action: {
            ...userChallengeData[1].action,
            state: UserActionState.UNSTARTED,
          },
        },
      },
    })
    const wrapper = mount(
      <Provider store={store}>
        <ActionView />
      </Provider>
    )
    expect(wrapper.find(ActionChoose).exists()).toBeTruthy()
    await waitForComponentToPaint(wrapper)
    expect(toJson(wrapper)).toMatchSnapshot()
  })
  it('should render ActionDone component', () => {
    const store = createMockEcolyoStore({
      challenge: {
        currentChallenge: {
          ...userChallengeData[1],
          action: {
            ...userChallengeData[1].action,
            state: UserActionState.NOTIFICATION,
          },
        },
      },
    })
    const wrapper = mount(
      <Provider store={store}>
        <ActionView />
      </Provider>
    )
    expect(wrapper.find(ActionDone).exists()).toBeTruthy()
  })
  it('should render ActionOnGoing component', () => {
    const store = createMockEcolyoStore({
      challenge: {
        currentChallenge: {
          ...userChallengeData[1],
          action: {
            ...userChallengeData[1].action,
            state: UserActionState.ONGOING,
          },
        },
      },
    })
    const wrapper = mount(
      <Provider store={store}>
        <ActionView />
      </Provider>
    )
    expect(wrapper.find(ActionOnGoing).exists()).toBeTruthy()
  })
})