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 index 7efff67b..d45ddf9c 100644 --- 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 @@ -2,10 +2,11 @@ import calendarOptions from '@/constants/calendar-options'; // Supporting Files -import { shallowMount } from '@vue/test-utils'; +import { shallowMount, mount } 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'; +import { createTestingPinia } from '@pinia/testing'; const appointmentText = 'Appointment content'; function setupMocks({ customMountOptions }) { @@ -24,6 +25,59 @@ function setupMocks({ customMountOptions }) { return { wrapper }; } +const calendarModalQuestionStub = { + render: () => {} +}; + +const mockMixin = { + methods: { + getCmsContent: jest.fn().mockImplementation(() => appointmentText) + } +}; + +function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRun = () => {}, mixin = mockMixin) { + const mountOptions = getMountOptions({ + router: { + navigate: jest.fn(), + navigateToExternalUrl: jest.fn() + } + }); + + mountOptions.global.stubs = { + // siteFooter: footerStub, + // siteHeader: headerStub, + // vehicleBanner: vehicleBannerStub, + // addToCalendar: addToCalendarStub + calendarModalQuestion: calendarModalQuestionStub + }; + + const testingPinia = createTestingPinia({ + initialState: { + main: mainInitialState + } + }); + useMainStore(testingPinia); + methodToRun(); + + mountOptions.global.mixins[0].methods.getSettingValue = jest.fn(() => 'false'); + mountOptions.global.plugins = [testingPinia]; + mountOptions.mixins = [mixin]; + mountOptions.data = () => ( + initialData + ); + + // const apiResponses = { + // supportingItems: [] + // }; + //const apiPromise = Promise.resolve(apiResponses); + // settleAllPromises.mockImplementation(() => apiPromise); + //fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + + const wrapper = shallowMount(addToCalendar, mountOptions); + wrapper.vm.$refs.calendarModalQuestion.openModal = jest.fn(); + return { wrapper }; +} + beforeEach(() => { jest.restoreAllMocks(); jest.clearAllMocks(); @@ -76,10 +130,52 @@ afterEach(() => { jest.clearAllMocks(); }); +const sessionStorage = { + 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 + } +}; + describe('Add-to-calendar methods...', () => { test('Add-to-calendar should trigger openModal method', () => { // Arrange - const { wrapper } = setupMocks({ customMountOptions: { propsData: { diff --git a/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue index a469db25..7dea78e0 100644 --- a/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue +++ b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue @@ -30,8 +30,6 @@ import { getDateFormat, addMinutes } from '@/helpers/date-helper'; import { AppointmentTypeStrings, RouteCodeFlags } from '@/constants/schedule-constants'; import { getCalendarFile, download } from '@/helpers/add-to-calendar-helper'; - -import { useMainStore } from '@/store'; import serviceType from '@/constants/service-type'; import applicationConfig from '@/constants/application-config.js'; import calendarModalQuestion from '@/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue'; @@ -53,12 +51,11 @@ export default { appointmentType: String, scheduleDate: String, scheduleStartTime: String, - scheduleEndTime: String - }, - setup() { - const mainStore = useMainStore(); - const submittedOrder = mainStore.getSubmittedOrder(); - return { mainStore, submittedOrder }; + scheduleEndTime: String, + hasRecalibrationPart: Boolean, + uniqueId: String, + isRepair: Boolean, + routeCode: String }, data() { return { @@ -116,23 +113,15 @@ export default { AddToCalendar_SameDayDropOff_Body() { return this.getCmsContent(this.sameDayDropOffWidgetName, 'BodyText'); }, - UniqueId() { - return this.submittedOrder.referralNumber?.toString(); - }, ServiceType() { - const { isRepair } = this.submittedOrder.damage; - const { hasRecalibrationPart } = this.mainStore; - if (!isRepair) { - if (hasRecalibrationPart) { + if (!this.isRepair) { + if (this.hasRecalibrationPart) { return serviceType.REPLACEMENT_AND_RECALIBRATION; } return serviceType.REPLACEMENT; } return serviceType.REPAIR; }, - RouteCode() { - return this.submittedOrder.schedule.routeCode; - }, Appointment() { let subject = ''; let location = ''; @@ -153,10 +142,10 @@ export default { } else { location = this.providerFullAddress?.replace('
', ''); if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) { - if (this.RouteCode.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + if (this.routeCode.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { subject = this.AddToCalendar_OvernightDropOff_Subject; body = this.AddToCalendar_OvernightDropOff_Body; - } else if (this.RouteCode.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { + } else if (this.routeCode.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { if (this.IsSameDayDropOff) { subject = this.AddToCalendar_SameDayDropOff_Subject; endDateTime = addMinutes(startDateTime, 120); @@ -196,7 +185,7 @@ export default { Location: location, StartDate: startDateTime, EndDate: endDateTime, - RefrrlSeqNum: this.UniqueId, + RefrrlSeqNum: this.uniqueId, Body: body, IsHTML: isHTML, Duration: duration @@ -287,10 +276,6 @@ export default { const calBody = getCalendarFile(calFile); download('SafeliteAppointment.ics', calBody); } - // getInShopAppointmentText() { - // const test = this.getCmsContent('AddToCalendar_InShop_TEST', 'Text'); - // return test; - // } } }; diff --git a/src/layouts/order-confirmation/order-confirmation.vue b/src/layouts/order-confirmation/order-confirmation.vue index b824e266..e33a5e08 100644 --- a/src/layouts/order-confirmation/order-confirmation.vue +++ b/src/layouts/order-confirmation/order-confirmation.vue @@ -41,7 +41,11 @@ :appointmentType="appointmentType" :scheduleDate="schedule.date" :scheduleStartTime="schedule.startTime" - :scheduleEndTime="schedule.endTime" /> + :scheduleEndTime="schedule.endTime" + :routeCode="schedule.routeCode" + :hasRecalibrationPart="hasRecalibrationPart" + :uniqueId="referralNumber" + :isRepair="isRepair" />
@@ -148,8 +152,10 @@ export default { schedule, customer, payment, - customerPortalLoginToken } = this.submittedOrder; - var { issConfig } = this.mainStore; + customerPortalLoginToken, + damage, + referralNumber } = this.submittedOrder; + var { issConfig, hasRecalibrationPart } = this.mainStore; return { vehicle, customerEmail: customer?.emailAddress, @@ -161,6 +167,9 @@ export default { customerPortalLoginToken, carrierName: issConfig.clientName, carrierUrl: issConfig.successReturnURL, + isRepair: damage.isRepair, + hasRecalibrationPart, + referralNumber: referralNumber?.toString(), widgets: { siteHeader: 'SiteHeaderWidget', vehicleBanner: 'VehicleBannerWidget', diff --git a/src/layouts/payment-method/payment-method.spec.js b/src/layouts/payment-method/payment-method.spec.js index acfaeafe..b255afab 100644 --- a/src/layouts/payment-method/payment-method.spec.js +++ b/src/layouts/payment-method/payment-method.spec.js @@ -22,7 +22,11 @@ jest.mock('@/helpers/order-helper.js', () => ({ function setupMocks({ customMountOptions = {}, queryString }, mainInitialState = {}, customMixin = null) { const mountOptions = getMountOptions({ ...customMountOptions, - route: { query: { issPage: issPageValues.PAYMENT_METHOD, ...queryString }, params: {} } + route: { query: { issPage: issPageValues.PAYMENT_METHOD, ...queryString }, params: {} }, + router: { + navigate: jest.fn(), + navigateToExternalUrl: jest.fn() + } }); const testingPinia = createTestingPinia({ diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index 36eabb76..09a6dad6 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -307,7 +307,7 @@ export default { this.$route ); } catch (error) { - useMainStore().setBailout(bailoutMessage.saveSessionError(submitError.data)); + useMainStore().setBailout(bailoutMessage.saveSessionError(error.data)); this.$router.navigate( this.navigationScenarios.SAVE_SESSION_FAILED, this.$route, diff --git a/src/layouts/tpa-confirmation/tpa-confirmation.spec.js b/src/layouts/tpa-confirmation/tpa-confirmation.spec.js index 5cc2eb2a..11f9e60b 100644 --- a/src/layouts/tpa-confirmation/tpa-confirmation.spec.js +++ b/src/layouts/tpa-confirmation/tpa-confirmation.spec.js @@ -8,8 +8,8 @@ import settleAllPromises from '@/helpers/layout-helper.js'; import { fetchCmsContentForPage } from '@/helpers/cms-content-helper'; import { mount } from '@vue/test-utils'; import { createTestingPinia } from '@pinia/testing'; -import bailoutMessage from '@/constants/bailoutMessage'; import coverageStatuses from '@/constants/coverage-statuses'; +import { deepClone } from '@/helpers/object-helper'; jest.mock('@/helpers/layout-helper.js', () => jest.fn()); @@ -54,11 +54,6 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu } }); const store = useMainStore(testingPinia); - store.submittedOrder = { - ...JSON.parse(JSON.stringify(store.order)), - isVerified: store.isVerified, - isUnverified: store.isUnverified - }; store.order = getDefaultState().order; store.hasSubmittedOrder = jest.fn().mockReturnValue(true); methodToRun(); @@ -80,12 +75,33 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu return { wrapper }; } +const defaultOrder = { + serviceLocation: { + provider: { + companyName: "Hershey", + phoneNumber: "726-117-0377" + } + }, + currentDeductible: 479, + isVerified: false, + carrierPhoneNumber: "757-277-0388", + vehicle: { + imageUrl: 'url for image', + category: 'car' + } +} + describe('TPAConfirmation.vue', () => { describe('Rendering', () => { + let wrapper; + let mockStoreActions; + beforeEach(() => { + mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => defaultOrder); + }; + wrapper = getMountedComponent({}, {}, mockStoreActions).wrapper; + }); test('Should render Site Header', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const siteHeader = wrapper.findComponent({ ref: 'siteHeader' }); @@ -93,9 +109,6 @@ describe('TPAConfirmation.vue', () => { expect(siteHeader.exists()).toBe(true); }); test('Should render Vehicle Banner', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const vehicleBanner = wrapper.findComponent({ ref: 'vehicleBanner' }); @@ -103,9 +116,6 @@ describe('TPAConfirmation.vue', () => { expect(vehicleBanner.exists()).toBe(true); }); test('Should render Confirmation Body One', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const bodyOne = wrapper.findComponent({ ref: 'tpaConfirmationBodyOne' }); @@ -113,9 +123,6 @@ describe('TPAConfirmation.vue', () => { expect(bodyOne.exists()).toBe(true); }); test('Should render Confirmation Body Two', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const bodyTwo = wrapper.findComponent({ ref: 'tpaConfirmationBodyTwo' }); @@ -123,9 +130,6 @@ describe('TPAConfirmation.vue', () => { expect(bodyTwo.exists()).toBe(true); }); test('Should render Order Details title', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const orderDetailsTitle = wrapper.findComponent({ ref: 'tpaConfirmationOrderDetailsTitle' }); @@ -133,9 +137,6 @@ describe('TPAConfirmation.vue', () => { expect(orderDetailsTitle.exists()).toBe(true); }); test('Should render Order Details body', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const orderDetailsBody = wrapper.findComponent({ ref: 'tpaConfirmationOrderDetailsBody' }); @@ -143,9 +144,6 @@ describe('TPAConfirmation.vue', () => { expect(orderDetailsBody.exists()).toBe(true); }); test('Should render Deductible Box', () => { - // Arrange - const { wrapper } = getMountedComponent({}); - // Act const deductibleBox = wrapper.findComponent({ ref: 'deductibleBox' }); @@ -160,7 +158,7 @@ describe('TPAConfirmation.vue', () => { successReturnURL: carrierReturnUrl } }; - const { wrapper } = getMountedComponent(initialStore); + wrapper = getMountedComponent(initialStore, {}, mockStoreActions).wrapper; // Act const siteFooter = wrapper.findComponent({ ref: 'siteFooter' }); @@ -169,9 +167,6 @@ describe('TPAConfirmation.vue', () => { expect(siteFooter.exists()).toBe(true); }); test('If Essential flow, should not display Site Footer', () => { - // Arrange - const { wrapper } = getMountedComponent(); - // Act const siteFooter = wrapper.findComponent({ ref: 'siteFooter' }); @@ -190,7 +185,10 @@ describe('TPAConfirmation.vue', () => { } } }; - const { wrapper } = getMountedComponent(initialStore); + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => defaultOrder); + }; + const { wrapper } = getMountedComponent(initialStore, {}, mockStoreActions); const expected = 'Verifying coverage'; // Assert @@ -207,7 +205,12 @@ describe('TPAConfirmation.vue', () => { currentDeductible } }; - const { wrapper } = getMountedComponent(initialStore); + const order = deepClone(defaultOrder); + order.isVerified = true; + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order); + }; + const { wrapper } = getMountedComponent(initialStore, {}, mockStoreActions); const notExpected = 'Verifying coverage'; // Assert @@ -216,26 +219,22 @@ describe('TPAConfirmation.vue', () => { }); }); describe('Methods', () => { - describe('getCustomValueFromString', () => { + describe.only('getCustomValueFromString', () => { describe.each([ - [false, coverageStatuses.PENDING, 0], - [false, coverageStatuses.PENDING, 500], - [false, coverageStatuses.NO_COVERAGE, 0], - [false, coverageStatuses.NO_COVERAGE, 500], - [false, coverageStatuses.VERIFIED, 0], - [true, coverageStatuses.VERIFIED, 500] - ])('with argument deductibleAboveZero', (expected, status, deductible) => { + [false, false, 0], + [false, false, 500], + [false, true, 0], + [true, true, 500] + ])('with argument deductibleAboveZero', (expected, isVerified, deductible) => { test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => { // Arrange - const initialStore = { - order: { - insuranceCoverage: { - coverageStatus: status - }, - currentDeductible: deductible - } + const order = deepClone(defaultOrder); + order.isVerified = isVerified; + order.currentDeductible = deductible; + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order); }; - const { wrapper } = getMountedComponent(initialStore); + const { wrapper } = getMountedComponent({}, {}, mockStoreActions); const argument = 'deductibleAboveZero'; // Act @@ -247,24 +246,20 @@ describe('TPAConfirmation.vue', () => { }); describe('with argument zeroDeductible', () => { describe.each([ - [false, coverageStatuses.PENDING, 0], - [false, coverageStatuses.PENDING, 500], - [false, coverageStatuses.NO_COVERAGE, 0], - [false, coverageStatuses.NO_COVERAGE, 500], - [true, coverageStatuses.VERIFIED, 0], - [false, coverageStatuses.VERIFIED, 500] - ])('with argument zeroDeductible', (expected, status, deductible) => { + [false, false, 0], + [false, false, 500], + [true, true, 0], + [false, true, 500] + ])('with argument zeroDeductible', (expected, isVerified, deductible) => { test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => { // Arrange - const initialStore = { - order: { - insuranceCoverage: { - coverageStatus: status - }, - currentDeductible: deductible - } + const order = deepClone(defaultOrder); + order.isVerified = isVerified; + order.currentDeductible = deductible; + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order); }; - const { wrapper } = getMountedComponent(initialStore); + const { wrapper } = getMountedComponent({}, {}, mockStoreActions); const argument = 'zeroDeductible'; // Act @@ -277,21 +272,18 @@ describe('TPAConfirmation.vue', () => { }); describe('with argument verifyingCoverage', () => { describe.each([ - [true, coverageStatuses.PENDING], - [true, coverageStatuses.NO_COVERAGE], - [false, coverageStatuses.VERIFIED] - ])('with argument zeroDeductible', (expected, status) => { + [true, false], + [false, true] + ])('with argument zeroDeductible', (expected, isVerified) => { test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)}`, () => { // Arrange - const initialStore = { - order: { - insuranceCoverage: { - coverageStatus: status - }, - currentDeductible: 123 - } + const order = deepClone(defaultOrder); + order.isVerified = isVerified; + order.currentDeductible = 123; + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order); }; - const { wrapper } = getMountedComponent(initialStore); + const { wrapper } = getMountedComponent({}, {}, mockStoreActions); const argument = 'verifyingCoverage'; // Act @@ -304,6 +296,9 @@ describe('TPAConfirmation.vue', () => { }); }); describe('Navigation', () => { + const mockStoreActions = () => { + useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => defaultOrder); + }; test('If Advanced flow, forward button action navigates to carrier URL', () => { // Arrange const carrierReturnUrl = 'testURL'; @@ -312,7 +307,7 @@ describe('TPAConfirmation.vue', () => { successReturnURL: carrierReturnUrl } }; - const { wrapper } = getMountedComponent(initialStore); + const { wrapper } = getMountedComponent(initialStore, {}, mockStoreActions); // Act wrapper.vm.forwardButtonAction();