generated from openedx/frontend-template-application
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
24 changed files
with
494 additions
and
224 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,195 @@ | ||
| import React from 'react'; | ||
| import { | ||
| screen, act, fireEvent, waitFor, | ||
| } from '@testing-library/react'; | ||
| import { useDecision } from '@optimizely/react-sdk'; | ||
| import { render as renderComponent } from '../../utils/utils.test'; | ||
| import { initialState } from '../../data/slice'; | ||
| import { OPTIMIZELY_PROMPT_EXPERIMENT_VARIATION_KEYS } from '../../data/optimizely'; | ||
| import { | ||
| acknowledgeDisclosure, | ||
| addChatMessage, | ||
| getChatResponse, | ||
| updateCurrentMessage, | ||
| } from '../../data/thunks'; | ||
|
|
||
| import MessageForm from '.'; | ||
|
|
||
| jest.mock('../../utils/surveyMonkey', () => ({ | ||
| showControlSurvey: jest.fn(), | ||
| showVariationSurvey: jest.fn(), | ||
| })); | ||
|
|
||
| jest.mock('@edx/frontend-platform/analytics', () => ({ | ||
| sendTrackEvent: jest.fn(), | ||
| })); | ||
|
|
||
| const mockedAuthenticatedUser = { userId: 123 }; | ||
| jest.mock('@edx/frontend-platform/auth', () => ({ | ||
| getAuthenticatedUser: () => mockedAuthenticatedUser, | ||
| })); | ||
|
|
||
| jest.mock('@edx/frontend-platform/analytics', () => ({ | ||
| sendTrackEvent: jest.fn(), | ||
| })); | ||
|
|
||
| const mockDispatch = jest.fn(); | ||
| jest.mock('react-redux', () => ({ | ||
| ...jest.requireActual('react-redux'), | ||
| useDispatch: () => mockDispatch, | ||
| })); | ||
|
|
||
| jest.mock('@optimizely/react-sdk', () => ({ | ||
| useDecision: jest.fn(), | ||
| })); | ||
|
|
||
| jest.mock('../../data/thunks', () => ({ | ||
| acknowledgeDisclosure: jest.fn(), | ||
| addChatMessage: jest.fn(), | ||
| getChatResponse: jest.fn(), | ||
| updateCurrentMessage: jest.fn(), | ||
| })); | ||
|
|
||
| const defaultProps = { | ||
| courseId: 'some-course-id', | ||
| isOpen: true, | ||
| setIsOpen: jest.fn(), | ||
| unitId: 'some-unit-id', | ||
| }; | ||
|
|
||
| const render = async (props = {}, sliceState = {}) => { | ||
| const componentProps = { | ||
| ...defaultProps, | ||
| ...props, | ||
| }; | ||
|
|
||
| const initState = { | ||
| preloadedState: { | ||
| learningAssistant: { | ||
| ...initialState, | ||
| ...sliceState, | ||
| }, | ||
| }, | ||
| }; | ||
| return act(async () => renderComponent( | ||
| <MessageForm {...componentProps} />, | ||
| initState, | ||
| )); | ||
| }; | ||
|
|
||
| describe('<MessageForm />', () => { | ||
| beforeEach(() => { | ||
| jest.resetAllMocks(); | ||
| useDecision.mockReturnValue([]); | ||
| }); | ||
|
|
||
| describe('when rendered', () => { | ||
| it('should focus if shouldAutofocus is enabled', () => { | ||
| const currentMessage = 'How much wood'; | ||
| const sliceState = { | ||
| apiIsLoading: false, | ||
| currentMessage, | ||
| apiError: false, | ||
| }; | ||
|
|
||
| render({ shouldAutofocus: true }, sliceState); | ||
|
|
||
| waitFor(() => { | ||
| expect(screen.getByDisplayValue(currentMessage)).toHaveFocus(); | ||
| }); | ||
|
|
||
| expect(screen.queryByTestId('message-form')).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('should dispatch updateCurrentMessage() when updating the form control', () => { | ||
| const currentMessage = 'How much wood'; | ||
| const updatedMessage = 'How much wood coud a woodchuck chuck'; | ||
| const sliceState = { | ||
| apiIsLoading: false, | ||
| currentMessage, | ||
| apiError: false, | ||
| }; | ||
|
|
||
| render(undefined, sliceState); | ||
|
|
||
| act(() => { | ||
| const input = screen.getByDisplayValue(currentMessage); | ||
| fireEvent.change(input, { target: { value: updatedMessage } }); | ||
| }); | ||
|
|
||
| expect(updateCurrentMessage).toHaveBeenCalledWith(updatedMessage); | ||
| expect(mockDispatch).toHaveBeenCalledTimes(1); | ||
| }); | ||
|
|
||
| it('should dispatch message on submit as expected', () => { | ||
| const currentMessage = 'How much wood could a woodchuck chuck if a woodchuck could chuck wood?'; | ||
| const sliceState = { | ||
| apiIsLoading: false, | ||
| currentMessage, | ||
| apiError: false, | ||
| }; | ||
|
|
||
| render(undefined, sliceState); | ||
|
|
||
| act(() => { | ||
| screen.queryByTestId('message-form-submit').click(); | ||
| }); | ||
|
|
||
| expect(acknowledgeDisclosure).toHaveBeenCalledWith(true); | ||
| expect(addChatMessage).toHaveBeenCalledWith('user', currentMessage, defaultProps.courseId, undefined); | ||
| expect(getChatResponse).toHaveBeenCalledWith(defaultProps.courseId, defaultProps.unitId, undefined); | ||
| expect(mockDispatch).toHaveBeenCalledTimes(3); | ||
| }); | ||
|
|
||
| it('should not dispatch on submit if there\'s no message', () => { | ||
| render(); | ||
|
|
||
| act(() => { | ||
| screen.queryByTestId('message-form-submit').click(); | ||
| }); | ||
|
|
||
| expect(acknowledgeDisclosure).not.toHaveBeenCalled(); | ||
| expect(addChatMessage).not.toHaveBeenCalled(); | ||
| expect(getChatResponse).not.toHaveBeenCalled(); | ||
| expect(mockDispatch).not.toHaveBeenCalled(); | ||
| }); | ||
| }); | ||
|
|
||
| describe('prmpt experiment', () => { | ||
| beforeEach(() => { | ||
| useDecision.mockReturnValue([{ | ||
| active: true, | ||
| variationKey: OPTIMIZELY_PROMPT_EXPERIMENT_VARIATION_KEYS.UPDATED_PROMPT, | ||
| }]); | ||
| }); | ||
|
|
||
| it('should include experiment data on submit', () => { | ||
| const currentMessage = 'How much wood could a woodchuck chuck if a woodchuck could chuck wood?'; | ||
| const sliceState = { | ||
| apiIsLoading: false, | ||
| currentMessage, | ||
| apiError: false, | ||
| }; | ||
|
|
||
| render(undefined, sliceState); | ||
|
|
||
| act(() => { | ||
| screen.queryByTestId('message-form-submit').click(); | ||
| }); | ||
|
|
||
| expect(acknowledgeDisclosure).toHaveBeenCalledWith(true); | ||
| expect(addChatMessage).toHaveBeenCalledWith( | ||
| 'user', | ||
| currentMessage, | ||
| defaultProps.courseId, | ||
| OPTIMIZELY_PROMPT_EXPERIMENT_VARIATION_KEYS.UPDATED_PROMPT, | ||
| ); | ||
| expect(getChatResponse).toHaveBeenCalledWith( | ||
| defaultProps.courseId, | ||
| defaultProps.unitId, | ||
| OPTIMIZELY_PROMPT_EXPERIMENT_VARIATION_KEYS.UPDATED_PROMPT, | ||
| ); | ||
| expect(mockDispatch).toHaveBeenCalledTimes(3); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.