diff --git a/src/containers/CourseCard/components/CourseCardActions/__snapshots__/index.test.jsx.snap b/src/containers/CourseCard/components/CourseCardActions/__snapshots__/index.test.jsx.snap deleted file mode 100644 index fec5ae1a..00000000 --- a/src/containers/CourseCard/components/CourseCardActions/__snapshots__/index.test.jsx.snap +++ /dev/null @@ -1,54 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CourseCardActions snapshot show begin course button when verified and not entitlement and has started 1`] = ` - - - -`; - -exports[`CourseCardActions snapshot show resume button when verified and not entitlement and has started 1`] = ` - - - -`; - -exports[`CourseCardActions snapshot show select session button when not verified and entitlement 1`] = ` - - - -`; - -exports[`CourseCardActions snapshot show upgrade button when not verified and not entitlement 1`] = ` - - - - -`; - -exports[`CourseCardActions snapshot show view course button when not verified and entitlement and fulfilled 1`] = ` - - - -`; diff --git a/src/containers/CourseCard/components/CourseCardActions/index.jsx b/src/containers/CourseCard/components/CourseCardActions/index.jsx index 5e4d7309..1d63f17f 100644 --- a/src/containers/CourseCard/components/CourseCardActions/index.jsx +++ b/src/containers/CourseCard/components/CourseCardActions/index.jsx @@ -10,27 +10,30 @@ import SelectSessionButton from './SelectSessionButton'; import BeginCourseButton from './BeginCourseButton'; import ResumeButton from './ResumeButton'; import ViewCourseButton from './ViewCourseButton'; -import useActionDisabledState from '../hooks'; export const CourseCardActions = ({ cardId }) => { const { isEntitlement, isFulfilled } = reduxHooks.useCardEntitlementData(cardId); - const { isVerified, hasStarted } = reduxHooks.useCardEnrollmentData(cardId); + const { + isVerified, + hasStarted, + isExecEd2UCourse, + } = reduxHooks.useCardEnrollmentData(cardId); const { isArchived } = reduxHooks.useCardCourseRunData(cardId); - const { isExecutiveEd2uCourse } = useActionDisabledState(cardId); - - let PrimaryButton; - if (isEntitlement) { - PrimaryButton = isFulfilled ? ViewCourseButton : SelectSessionButton; - } else if (isArchived) { - PrimaryButton = ViewCourseButton; - } else { - PrimaryButton = hasStarted ? ResumeButton : BeginCourseButton; - } return ( - {(!(isEntitlement || isVerified) && !isExecutiveEd2uCourse) && } - + {!(isEntitlement || isVerified || isExecEd2UCourse) && } + {isEntitlement && (isFulfilled + ? + : + )} + {(isArchived && !isEntitlement) && ( + + )} + {!(isArchived || isEntitlement) && (hasStarted + ? + : + )} ); }; diff --git a/src/containers/CourseCard/components/CourseCardActions/index.test.jsx b/src/containers/CourseCard/components/CourseCardActions/index.test.jsx index 4d565d85..58809da8 100644 --- a/src/containers/CourseCard/components/CourseCardActions/index.test.jsx +++ b/src/containers/CourseCard/components/CourseCardActions/index.test.jsx @@ -1,7 +1,13 @@ -import { shallow } from 'enzyme'; +import { shallow } from '@edx/react-unit-test-utils'; import { reduxHooks } from 'hooks'; +import UpgradeButton from './UpgradeButton'; +import SelectSessionButton from './SelectSessionButton'; +import BeginCourseButton from './BeginCourseButton'; +import ResumeButton from './ResumeButton'; +import ViewCourseButton from './ViewCourseButton'; + import CourseCardActions from '.'; jest.mock('hooks', () => ({ @@ -13,96 +19,98 @@ jest.mock('hooks', () => ({ }, })); -jest.mock('../hooks', () => jest.fn(() => ({ isExecutiveEd2uCourse: false }))); - jest.mock('./UpgradeButton', () => 'UpgradeButton'); jest.mock('./SelectSessionButton', () => 'SelectSessionButton'); jest.mock('./ViewCourseButton', () => 'ViewCourseButton'); jest.mock('./BeginCourseButton', () => 'BeginCourseButton'); jest.mock('./ResumeButton', () => 'ResumeButton'); +const cardId = 'test-card-id'; +const props = { cardId }; + +let el; describe('CourseCardActions', () => { - const props = { - cardId: 'cardId', - }; - const createWrapper = ({ - isEntitlement, isFulfilled, isArchived, isVerified, hasStarted, isMasquerading, - }) => { + const mockHooks = ({ + isEntitlement = false, + isExecEd2UCourse = false, + isFulfilled = false, + isArchived = false, + isVerified = false, + hasStarted = false, + isMasquerading = false, + } = {}) => { reduxHooks.useCardEntitlementData.mockReturnValueOnce({ isEntitlement, isFulfilled }); reduxHooks.useCardCourseRunData.mockReturnValueOnce({ isArchived }); - reduxHooks.useCardEnrollmentData.mockReturnValueOnce({ isVerified, hasStarted }); + reduxHooks.useCardEnrollmentData.mockReturnValueOnce({ isExecEd2UCourse, isVerified, hasStarted }); reduxHooks.useMasqueradeData.mockReturnValueOnce({ isMasquerading }); - return shallow(); }; - describe('snapshot', () => { - test('show upgrade button when not verified and not entitlement', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: false, hasStarted: false, - }); - expect(wrapper).toMatchSnapshot(); - }); - test('show select session button when not verified and entitlement', () => { - const wrapper = createWrapper({ - isEntitlement: true, isFulfilled: false, isArchived: false, isVerified: false, hasStarted: false, - }); - expect(wrapper).toMatchSnapshot(); - }); - test('show begin course button when verified and not entitlement and has started', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: true, hasStarted: false, - }); - expect(wrapper).toMatchSnapshot(); + const render = () => { + el = shallow(); + }; + describe('behavior', () => { + it('initializes redux hooks', () => { + mockHooks(); + render(); + expect(reduxHooks.useCardEntitlementData).toHaveBeenCalledWith(cardId); + expect(reduxHooks.useCardEnrollmentData).toHaveBeenCalledWith(cardId); + expect(reduxHooks.useCardCourseRunData).toHaveBeenCalledWith(cardId); }); - test('show resume button when verified and not entitlement and has started', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: true, hasStarted: true, + }); + describe('output', () => { + describe('Exec Ed course', () => { + it('does not render upgrade button', () => { + mockHooks({ isExecEd2UCourse: true }); + render(); + expect(el.instance.findByType(UpgradeButton).length).toEqual(0); }); - expect(wrapper).toMatchSnapshot(); }); - test('show view course button when not verified and entitlement and fulfilled', () => { - const wrapper = createWrapper({ - isEntitlement: true, isFulfilled: true, isArchived: false, isVerified: false, hasStarted: false, + describe('entitlement course', () => { + it('does not render upgrade button', () => { + mockHooks({ isEntitlement: true }); + render(); + expect(el.instance.findByType(UpgradeButton).length).toEqual(0); }); - expect(wrapper).toMatchSnapshot(); - }); - }); - - describe('behavior', () => { - it('show upgrade button when not verified and not entitlement', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: false, hasStarted: false, + it('renders ViewCourseButton if fulfilled', () => { + mockHooks({ isEntitlement: true, isFulfilled: true }); + render(); + expect(el.instance.findByType(ViewCourseButton)[0].props.cardId).toEqual(cardId); }); - expect(wrapper.find('UpgradeButton')).toHaveLength(1); - }); - it('show select session button when not verified and entitlement', () => { - const wrapper = createWrapper({ - isEntitlement: true, isFulfilled: false, isArchived: false, isVerified: false, hasStarted: false, + it('renders SelectSessionButton if not fulfilled', () => { + mockHooks({ isEntitlement: true }); + render(); + expect(el.instance.findByType(SelectSessionButton)[0].props.cardId).toEqual(cardId); }); - expect(wrapper.find('SelectSessionButton')).toHaveLength(1); }); - it('show begin course button when verified and not entitlement and has started', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: true, hasStarted: false, + describe('verified course', () => { + it('does not render upgrade button', () => { + mockHooks({ isVerified: true }); + render(); + expect(el.instance.findByType(UpgradeButton).length).toEqual(0); }); - expect(wrapper.find('BeginCourseButton')).toHaveLength(1); }); - it('show resume button when verified and not entitlement and has started', () => { - const wrapper = createWrapper({ - isEntitlement: false, isFulfilled: false, isArchived: false, isVerified: true, hasStarted: true, + describe('not entielement, verified, or exec ed', () => { + it('renders UpgradeButton and ViewCourseButton for archived courses', () => { + mockHooks({ isArchived: true }); + render(); + expect(el.instance.findByType(UpgradeButton)[0].props.cardId).toEqual(cardId); + expect(el.instance.findByType(ViewCourseButton)[0].props.cardId).toEqual(cardId); }); - expect(wrapper.find('ResumeButton')).toHaveLength(1); - }); - it('show view course button when not verified and entitlement and fulfilled', () => { - const wrapper = createWrapper({ - isEntitlement: true, isFulfilled: true, isArchived: false, isVerified: false, hasStarted: false, + describe('unstarted courses', () => { + it('renders UpgradeButton and BeginCourseButton', () => { + mockHooks(); + render(); + expect(el.instance.findByType(UpgradeButton)[0].props.cardId).toEqual(cardId); + expect(el.instance.findByType(BeginCourseButton)[0].props.cardId).toEqual(cardId); + }); }); - expect(wrapper.find('ViewCourseButton')).toHaveLength(1); - }); - it('show view course button when not verified and entitlement and fulfilled and archived', () => { - const wrapper = createWrapper({ - isEntitlement: true, isFulfilled: true, isArchived: true, isVerified: false, hasStarted: false, + describe('active courses (started, and not archived)', () => { + it('renders UpgradeButton and ResumeButton', () => { + mockHooks({ hasStarted: true }); + render(); + expect(el.instance.findByType(UpgradeButton)[0].props.cardId).toEqual(cardId); + expect(el.instance.findByType(ResumeButton)[0].props.cardId).toEqual(cardId); + }); }); - expect(wrapper.find('ViewCourseButton')).toHaveLength(1); }); }); });