Fixing tests

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: {

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
+        scheduleEndTime: String,
-    },
+        hasRecalibrationPart: Boolean,
-    setup() {
+        uniqueId: String,
-        const mainStore = useMainStore();
+        isRepair: Boolean,
-        const submittedOrder = mainStore.getSubmittedOrder();
+        routeCode: String
-        return { mainStore, submittedOrder };
     },
     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;
+            if (!this.isRepair) {
-            const { hasRecalibrationPart } = this.mainStore;
+                if (this.hasRecalibrationPart) {
-            if (!isRepair) {
-                if (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('<br/>', '');
                 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;
-        // }
     }
 };
 </script>

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" />
                         <div
                             class="appointment-text text-center lh-base"
                             v-html="appointmentWordingText"></div>
@@ -148,8 +152,10 @@ export default {
             schedule,
             customer,
             payment,
-            customerPortalLoginToken } = this.submittedOrder;
+            customerPortalLoginToken,
-        var { issConfig } = this.mainStore;
+            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',

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({

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,

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, false, 0],
-                [false, coverageStatuses.PENDING, 500],
+                [false, false, 500],
-                [false, coverageStatuses.NO_COVERAGE, 0],
+                [false, true, 0],
-                [false, coverageStatuses.NO_COVERAGE, 500],
+                [true, true, 500]
-                [false, coverageStatuses.VERIFIED, 0],
+            ])('with argument deductibleAboveZero', (expected, isVerified, deductible) => {
-                [true, coverageStatuses.VERIFIED, 500]
-            ])('with argument deductibleAboveZero', (expected, status, deductible) => {
                 test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => {
                     // Arrange
-                    const initialStore = {
+                    const order = deepClone(defaultOrder);
-                        order: {
+                    order.isVerified = isVerified;
-                            insuranceCoverage: {
+                    order.currentDeductible = deductible;
-                                coverageStatus: status
+                    const mockStoreActions = () => {
-                            },
+                        useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order);
-                            currentDeductible: deductible
-                        }
                     };
-                    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, false, 0],
-                    [false, coverageStatuses.PENDING, 500],
+                    [false, false, 500],
-                    [false, coverageStatuses.NO_COVERAGE, 0],
+                    [true, true, 0],
-                    [false, coverageStatuses.NO_COVERAGE, 500],
+                    [false, true, 500] 
-                    [true, coverageStatuses.VERIFIED, 0],
+                ])('with argument zeroDeductible', (expected, isVerified, deductible) => {
-                    [false, coverageStatuses.VERIFIED, 500]
-                ])('with argument zeroDeductible', (expected, status, deductible) => {
                     test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => {
                         // Arrange
-                        const initialStore = {
+                        const order = deepClone(defaultOrder);
-                            order: {
+                        order.isVerified = isVerified;
-                                insuranceCoverage: {
+                        order.currentDeductible = deductible;
-                                    coverageStatus: status
+                        const mockStoreActions = () => {
-                                },
+                            useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order);
-                                currentDeductible: deductible
-                            }
                         };
-                        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, false],
-                    [true, coverageStatuses.NO_COVERAGE],
+                    [false, true]
-                    [false, coverageStatuses.VERIFIED]
+                ])('with argument zeroDeductible', (expected, isVerified) => {
-                ])('with argument zeroDeductible', (expected, status) => {
                     test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)}`, () => {
                         // Arrange
-                        const initialStore = {
+                        const order = deepClone(defaultOrder);
-                            order: {
+                        order.isVerified = isVerified;
-                                insuranceCoverage: {
+                        order.currentDeductible = 123;
-                                    coverageStatus: status
+                        const mockStoreActions = () => {
-                                },
+                            useMainStore().getSubmittedOrder = jest.fn().mockImplementation(() => order);
-                                currentDeductible: 123
-                            }
                         };
-                        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();