import { render } from '@testing-library/react' import ActionView from 'components/Action/ActionView' import { UserActionState } from 'enums' import React from 'react' import { Provider } from 'react-redux' import { createMockEcolyoStore, mockChallengeState, } from 'tests/__mocks__/store' import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock' 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/ActionChoose/ActionChoose.tsx', () => 'mock-action-choose' ) jest.mock( 'components/Action/ActionOnGoing/ActionOnGoing.tsx', () => 'mock-action-onGoing' ) jest.mock( 'components/Action/ActionDone/ActionDone.tsx', () => 'mock-action-done' ) describe('ActionView component', () => { it('should render match snapshot with "Unstarted" state', () => { const store = createMockEcolyoStore({ challenge: { ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { ...userChallengeData[1].action, state: UserActionState.UNSTARTED, }, }, }, }) const { container } = render( <Provider store={store}> <ActionView /> </Provider> ) expect(container).toMatchSnapshot() }) it('should render match snapshot with "onGoing" state', () => { const store = createMockEcolyoStore({ challenge: { ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { ...userChallengeData[1].action, state: UserActionState.ONGOING, }, }, }, }) const { container } = render( <Provider store={store}> <ActionView /> </Provider> ) expect(container).toMatchSnapshot() }) it('should render match snapshot with "Notification" state', () => { const store = createMockEcolyoStore({ challenge: { ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { ...userChallengeData[1].action, state: UserActionState.NOTIFICATION, }, }, }, }) const { container } = render( <Provider store={store}> <ActionView /> </Provider> ) expect(container).toMatchSnapshot() }) it('should render match snapshot with default case', () => { const store = createMockEcolyoStore({ challenge: { ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { ...userChallengeData[1].action, }, }, }, }) const { container } = render( <Provider store={store}> <ActionView /> </Provider> ) expect(container).toMatchSnapshot() }) })