From 0d52f5a26b6d20cfa863139c885e64a7c82f094e Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Fri, 15 Mar 2024 15:56:46 -0400 Subject: [PATCH] unit tests for calendar components --- .../add-to-calendar/add-to-calendar.spec.js | 187 ++++++++++++++++++ .../calendar-modal-question.spec.js | 41 ++++ 2 files changed, 228 insertions(+) create mode 100644 src/layouts/order-confirmation/add-to-calendar/add-to-calendar.spec.js create mode 100644 src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.spec.js diff --git a/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.spec.js b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.spec.js new file mode 100644 index 00000000..7efff67b --- /dev/null +++ b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.spec.js @@ -0,0 +1,187 @@ +// Components +import calendarOptions from '@/constants/calendar-options'; + +// Supporting Files +import { shallowMount } from '@vue/test-utils'; +import { getMountOptions } from '@/helpers/unit-test-helper.js'; +import { useMainStore } from '@/store'; +import addToCalendar from '@/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue'; + +const appointmentText = 'Appointment content'; +function setupMocks({ customMountOptions }) { + const mountOptions = getMountOptions({ + ...customMountOptions + }); + mountOptions.mixins = [ + { + methods: { + getCmsContent: jest.fn().mockImplementation(() => appointmentText) + } + } + ]; + const wrapper = shallowMount(addToCalendar, mountOptions); + wrapper.vm.$refs.calendarModalQuestion.openModal = jest.fn(); + return { wrapper }; +} + +beforeEach(() => { + jest.restoreAllMocks(); + jest.clearAllMocks(); + useMainStore().submittedOrder = { + schedule: { + date: '2019-01-01', + startTime: '09:00', + endTime: '10:00', + routeCode: '000' + }, + lineItems: { + glassParts: [ + { + partNumber: 'ABC123' + } + ], + supportingItems: [] + }, + serviceLocation: { + address: '', + address2: null, + city: '', + state: 'AZ', + appointmentType: 'Inshop', + zipCode: '12345', + zipCodeCtu: '01234', + provider: { + providerNumber: '123', + address: { + streetAddress: 'test1', + city: 'test', + state: 'AZ', + zipCode: '12345', + zipCodeCtu: '01234' + } + } + }, + damage: { + isRepair: false + }, + referralNumber: '1234567', + payment: { + isInsurance: true + } + }; +}); +afterEach(() => { + useMainStore().submittedOrder = {}; + jest.restoreAllMocks(); + jest.clearAllMocks(); +}); + +describe('Add-to-calendar methods...', () => { + test('Add-to-calendar should trigger openModal method', () => { + // Arrange + + const { wrapper } = setupMocks({ + customMountOptions: { + propsData: { + appointment: { + RefrrlSeqNum: '123456', + StartDate: new Date(2023, 9, 11, 12, 0, 0), + EndDate: new Date(2023, 9, 11, 13, 0, 0), + Subject: 'Meeting with John', + Location: 'Conference Room', + Body: 'Discuss the project progress', + IsHTML: true, + Duration: '1220' + } + } + } + }); + + // Act + wrapper.vm.openCalendarModal(); + + // Assert + expect(wrapper.vm.$refs.calendarModalQuestion.openModal).toBeCalled(); + }); + + test('getCalendarData should return expected model value.', () => { + // Arrange + const type = calendarOptions.OUTLOOKCOM; + const { wrapper } = setupMocks({ + customMountOptions: { + propsData: { + appointment: { + RefrrlSeqNum: '123456', + StartDate: new Date(2023, 9, 11, 12, 0, 0), + EndDate: new Date(2023, 9, 11, 13, 0, 0), + Subject: 'Meeting with John', + Location: 'Conference Room', + Body: 'Discuss the project progress', + IsHTML: true, + Duration: '1220' + } + } + } + }); + + // Act + const testValue = wrapper.vm.getCalendarData(type); + + // Assert + expect(testValue.name).toEqual(calendarOptions.OUTLOOKCOM); + }); + + test('setCalendarAppointment should call getAppointment method for iCAL and Outlook.', () => { + // Arrange + const newValue = { name: calendarOptions.OUTLOOK }; + const { wrapper } = setupMocks({ + customMountOptions: { + propsData: { + appointment: { + RefrrlSeqNum: '123456', + StartDate: new Date(2023, 9, 11, 12, 0, 0), + EndDate: new Date(2023, 9, 11, 13, 0, 0), + Subject: 'Meeting with John', + Location: 'Conference Room', + Body: 'Discuss the project progress', + IsHTML: true, + Duration: '1220' + } + } + } + }); + wrapper.vm.getAppointment = jest.fn(); + // Act + wrapper.vm.setCalendarAppointment(newValue); + + // Assert + expect(wrapper.vm.getAppointment).toHaveBeenCalled(); + }); + test('setCalendarAppointment should call window.open for Google, yahoo and Outlook.com.', () => { + // Arrange + const newValue = { name: calendarOptions.GOOGLE }; + const { wrapper } = setupMocks({ + customMountOptions: { + propsData: { + appointment: { + RefrrlSeqNum: '123456', + StartDate: new Date(2023, 9, 11, 12, 0, 0), + EndDate: new Date(2023, 9, 11, 13, 0, 0), + Subject: 'Meeting with John', + Location: 'Conference Room', + Body: 'Discuss the project progress', + IsHTML: true, + Duration: '1220' + } + } + } + }); + window.open = jest.fn(); + + // Act + wrapper.vm.setCalendarAppointment(newValue); + + // Assert + expect(window.open).toHaveBeenCalledTimes(1); + }); +}); diff --git a/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.spec.js b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.spec.js new file mode 100644 index 00000000..51b43508 --- /dev/null +++ b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.spec.js @@ -0,0 +1,41 @@ +import { shallowMount } from '@vue/test-utils'; +import calendarModalQuestion from '@/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue'; + +describe('calendar-modal-question.vue', () => { + test('When selected calendar option is changed, a correctly selectedCalendarOption should be emitted', async () => { + // Arrange + const url = 'iCal url'; + const name = 'iCal'; + const icon = 'iCal.svg'; + const expectedEmit = [ + [ + { + url, + name, + icon + } + ] + ]; + + const wrapper = shallowMount(calendarModalQuestion, { + propsData: { + calendarOptionsData: [ + { + url, + name, + icon + } + ] + } + }); + + wrapper.vm.$refs.calendarOptions.closeModal = jest.fn(); + wrapper.vm.selectedCalendarOption = name; + + // Act + wrapper.vm.setSelectedCalendarOption(); + + // Assert + expect(wrapper.emitted()['update:modelValue']).toEqual(expectedEmit); + }); +});