78 lines
2.4 KiB
JavaScript
78 lines
2.4 KiB
JavaScript
import { render, screen } from '@testing-library/react';
|
|
import userEvent from '@testing-library/user-event';
|
|
import { reduxHooks } from 'hooks';
|
|
import track from 'tracking';
|
|
import useActionDisabledState from './hooks';
|
|
import CourseCardTitle from './CourseCardTitle';
|
|
|
|
jest.mock('tracking', () => ({
|
|
course: {
|
|
courseTitleClicked: jest.fn().mockName('segment.courseTitleClicked'),
|
|
},
|
|
}));
|
|
|
|
jest.mock('hooks', () => ({
|
|
reduxHooks: {
|
|
useCardCourseData: jest.fn(),
|
|
useCardCourseRunData: jest.fn(),
|
|
useTrackCourseEvent: jest.fn(),
|
|
},
|
|
}));
|
|
|
|
jest.mock('./hooks', () => jest.fn(() => ({ disableCourseTitle: false })));
|
|
|
|
jest.unmock('@edx/frontend-platform/i18n');
|
|
jest.unmock('@openedx/paragon');
|
|
jest.unmock('react');
|
|
|
|
describe('CourseCardTitle', () => {
|
|
const props = {
|
|
cardId: 'test-card-id',
|
|
};
|
|
|
|
const courseName = 'Test Course';
|
|
const homeUrl = 'http://test.com';
|
|
const handleTitleClick = jest.fn();
|
|
|
|
beforeEach(() => {
|
|
jest.clearAllMocks();
|
|
reduxHooks.useCardCourseData.mockReturnValue({ courseName });
|
|
reduxHooks.useCardCourseRunData.mockReturnValue({ homeUrl });
|
|
reduxHooks.useTrackCourseEvent.mockReturnValue(handleTitleClick);
|
|
});
|
|
|
|
it('renders course name as link when not disabled', async () => {
|
|
useActionDisabledState.mockReturnValue({ disableCourseTitle: false });
|
|
render(<CourseCardTitle {...props} />);
|
|
|
|
const user = userEvent.setup();
|
|
const link = screen.getByRole('link', { name: courseName });
|
|
expect(link).toHaveAttribute('href', homeUrl);
|
|
|
|
await user.click(link);
|
|
expect(handleTitleClick).toHaveBeenCalled();
|
|
});
|
|
|
|
it('renders course name as span when disabled', () => {
|
|
useActionDisabledState.mockReturnValue({ disableCourseTitle: true });
|
|
render(<CourseCardTitle {...props} />);
|
|
|
|
const text = screen.getByText(courseName);
|
|
expect(text).toBeInTheDocument();
|
|
expect(text.tagName.toLowerCase()).toBe('span');
|
|
});
|
|
|
|
it('uses correct hooks with cardId', () => {
|
|
useActionDisabledState.mockReturnValue({ disableCourseTitle: false });
|
|
render(<CourseCardTitle {...props} />);
|
|
|
|
expect(reduxHooks.useCardCourseData).toHaveBeenCalledWith(props.cardId);
|
|
expect(reduxHooks.useCardCourseRunData).toHaveBeenCalledWith(props.cardId);
|
|
expect(reduxHooks.useTrackCourseEvent).toHaveBeenCalledWith(
|
|
track.course.courseTitleClicked,
|
|
props.cardId,
|
|
homeUrl,
|
|
);
|
|
});
|
|
});
|