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/ActionChoose'
import ActionDone from './ActionDone/ActionDone'
import ActionOnGoing from './ActionOnGoing/ActionOnGoing'

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/ActionBegin.tsx',
  () => '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()
  })
})