109 lines
3.5 KiB
JavaScript
109 lines
3.5 KiB
JavaScript
import CourseAuthoringRoutes from './CourseAuthoringRoutes';
|
|
import { executeThunk } from './utils';
|
|
import { getApiWaffleFlagsUrl } from './data/api';
|
|
import { fetchWaffleFlags } from './data/thunks';
|
|
import {
|
|
screen, initializeMocks, render, waitFor,
|
|
} from './testUtils';
|
|
|
|
const courseId = 'course-v1:edX+TestX+Test_Course';
|
|
const pagesAndResourcesMockText = 'Pages And Resources';
|
|
const editorContainerMockText = 'Editor Container';
|
|
const videoSelectorContainerMockText = 'Video Selector Container';
|
|
const customPagesMockText = 'Custom Pages';
|
|
let store;
|
|
const mockComponentFn = jest.fn();
|
|
|
|
jest.mock('react-router-dom', () => ({
|
|
...jest.requireActual('react-router-dom'),
|
|
useParams: () => ({
|
|
courseId,
|
|
}),
|
|
}));
|
|
|
|
// Mock the TinyMceWidget
|
|
jest.mock('./editors/sharedComponents/TinyMceWidget', () => ({
|
|
__esModule: true, // Required to mock a default export
|
|
default: () => <div>Widget</div>,
|
|
Footer: () => <div>Footer</div>,
|
|
prepareEditorRef: jest.fn(() => ({
|
|
refReady: true,
|
|
setEditorRef: jest.fn().mockName('prepareEditorRef.setEditorRef'),
|
|
})),
|
|
}));
|
|
|
|
jest.mock('./pages-and-resources/PagesAndResources', () => (props) => {
|
|
mockComponentFn(props);
|
|
return pagesAndResourcesMockText;
|
|
});
|
|
jest.mock('./editors/EditorContainer', () => (props) => {
|
|
mockComponentFn(props);
|
|
return editorContainerMockText;
|
|
});
|
|
jest.mock('./selectors/VideoSelectorContainer', () => (props) => {
|
|
mockComponentFn(props);
|
|
return videoSelectorContainerMockText;
|
|
});
|
|
jest.mock('./custom-pages/CustomPages', () => (props) => {
|
|
mockComponentFn(props);
|
|
return customPagesMockText;
|
|
});
|
|
|
|
describe('<CourseAuthoringRoutes>', () => {
|
|
beforeEach(async () => {
|
|
const { axiosMock, reduxStore } = initializeMocks();
|
|
store = reduxStore;
|
|
axiosMock
|
|
.onGet(getApiWaffleFlagsUrl(courseId))
|
|
.reply(200, {});
|
|
await executeThunk(fetchWaffleFlags(courseId), store.dispatch);
|
|
});
|
|
|
|
it('renders the PagesAndResources component when the pages and resources route is active', async () => {
|
|
render(
|
|
<CourseAuthoringRoutes />,
|
|
{ routerProps: { initialEntries: ['/pages-and-resources'] } },
|
|
);
|
|
await waitFor(() => {
|
|
expect(screen.getByText(pagesAndResourcesMockText)).toBeVisible();
|
|
expect(mockComponentFn).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
courseId,
|
|
}),
|
|
);
|
|
});
|
|
});
|
|
|
|
it('renders the EditorContainer component when the course editor route is active', async () => {
|
|
render(
|
|
<CourseAuthoringRoutes />,
|
|
{ routerProps: { initialEntries: ['/editor/video/block-id'] } },
|
|
);
|
|
await waitFor(() => {
|
|
expect(screen.queryByText(editorContainerMockText)).toBeInTheDocument();
|
|
expect(screen.queryByText(pagesAndResourcesMockText)).not.toBeInTheDocument();
|
|
expect(mockComponentFn).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
learningContextId: courseId,
|
|
}),
|
|
);
|
|
});
|
|
});
|
|
|
|
it('renders the VideoSelectorContainer component when the course videos route is active', async () => {
|
|
render(
|
|
<CourseAuthoringRoutes />,
|
|
{ routerProps: { initialEntries: ['/editor/course-videos/block-id'] } },
|
|
);
|
|
await waitFor(() => {
|
|
expect(screen.queryByText(videoSelectorContainerMockText)).toBeInTheDocument();
|
|
expect(screen.queryByText(pagesAndResourcesMockText)).not.toBeInTheDocument();
|
|
expect(mockComponentFn).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
courseId,
|
|
}),
|
|
);
|
|
});
|
|
});
|
|
});
|