diff --git a/jest.config.js b/jest.config.js index 7b59ea2c1..6c0addf5f 100644 --- a/jest.config.js +++ b/jest.config.js @@ -32,11 +32,7 @@ module.exports = { "!src/layouts/payment-pia-return/*.vue", // Temp test exclusion while in development "!src/layouts/insurance/*.vue", // Temp test exclusion while in development "!src/layouts/insurance-company/*.vue", // Temp test exclusion while in development - "!src/layouts/schedule/**/*.vue", // Temp test exclusion while in development "!src/digital-components/date-picker/**/*.vue", // Temp test exclusion while in development - - "!src/**/*-june-2025.vue", // Exclude these temporary files for CASH-845 project - "!src/layouts/insurance-company/insurance-company-question/*.vue", // Temp test exclusion while in development "!src/experiment-components/*.vue", // END @@ -44,7 +40,7 @@ module.exports = { testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], coverageThreshold: { global: { - statements: 64, + statements: 68, }, }, // Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit diff --git a/public/index.html b/public/index.html index 45f83a20f..ab8f27144 100644 --- a/public/index.html +++ b/public/index.html @@ -1,6 +1,7 @@ + diff --git a/src/constants/progress-bar-mapper.js b/src/constants/progress-bar-mapper.js index a57774c21..b21c6c9c7 100644 --- a/src/constants/progress-bar-mapper.js +++ b/src/constants/progress-bar-mapper.js @@ -48,6 +48,10 @@ export const pageProgressMapper = { percent: 30, step: 1, }, + "policy-info": { + percent: 55, + step: 2, + }, quote: { percent: 60, step: 2, diff --git a/src/constants/quote-page-discounts.js b/src/constants/quote-page-discounts.js index ed4439ea4..c7962af53 100644 --- a/src/constants/quote-page-discounts.js +++ b/src/constants/quote-page-discounts.js @@ -173,4 +173,29 @@ export const quotePageDiscountTable = [ packageLevel: packageNames.TIER_THREE, isInsurance: true, }, + // Replace - Curve Tempered + { + name: "Curve Tempered Glass Only", + experimentCode: "Show_GlassOnly_Replace_CT_Discount", + partNumber: "GL CT CSH PKG", + partType: partTypeStrings.QUOTE_PAGE_DISCOUNT, + description: "GLASS CT GEOTARGET DISC", + packageLevel: packageNames.TIER_ONE, + }, + { + name: "Curve Tempered Standard", + experimentCode: "Show_Standard_Replace_CT_Discount", + partNumber: "STD CT CSH PKG", + partType: partTypeStrings.QUOTE_PAGE_DISCOUNT, + description: "STD CT GEOTARGET DISC", + packageLevel: packageNames.TIER_TWO, + }, + { + name: "Curve Tempered Premium", + experimentCode: "Show_Premium_Replace_CT_Discount", + partNumber: "PRM CT CSH PKG", + partType: partTypeStrings.QUOTE_PAGE_DISCOUNT, + description: "PREM CT GEOTARGET DISC", + packageLevel: packageNames.TIER_THREE, + }, ]; diff --git a/src/constants/store-mutations.js b/src/constants/store-mutations.js index 700f527c2..9b4b3719c 100644 --- a/src/constants/store-mutations.js +++ b/src/constants/store-mutations.js @@ -119,6 +119,7 @@ const storeMutations = { UPDATE_EXTERNAL_PARAMETER_SERVICE_PACKAGE: "updateExternalParameterServicePackage", UPDATE_EXTERNAL_PARAMETER_SOURCE: "updateExternalParameterSource", UPDATE_EXTERNAL_PARAMETER_PHONE_NUMBER: "updateExternalParameterPhoneNumber", + UPDATE_EXTERNAL_PARAMETER_QS_STASH: "updateExternalParameterQsStash", //RESET EXTERNAL_PARAMETER MUTATIONS RESET_EXTERNAL_PARAMETER_VEHICLE_STATE: "resetExternalParameterVehicleState", diff --git a/src/digital-components/date-picker/date-picker-june-2025.vue b/src/digital-components/date-picker/date-picker-june-2025.vue deleted file mode 100644 index 9d001a113..000000000 --- a/src/digital-components/date-picker/date-picker-june-2025.vue +++ /dev/null @@ -1,1335 +0,0 @@ - - - - - - - - - - - diff --git a/src/digital-components/date-picker/date-picker.specDISABLED.js b/src/digital-components/date-picker/date-picker.specDISABLED.js deleted file mode 100644 index 6ed05d663..000000000 --- a/src/digital-components/date-picker/date-picker.specDISABLED.js +++ /dev/null @@ -1,1435 +0,0 @@ -import datePicker from "./date-picker"; - -// Supporting Files -import { shallowMount } from "@vue/test-utils"; -import { getMountOptions } from "@/helpers/unit-test-helper.js"; -import store from "@/store"; - -// Constants -const mockValuesForSetDate01 = { - overrideDate: "2023-12-01", - monthEnd: "2023-12-31", - initialViewWeeks: [ - { - weekNum: 1, - weekStartDate: "2023-12-01", - weekEndDate: "2023-12-02", - }, - { - weekNum: 2, - weekStartDate: "2023-12-03", - weekEndDate: "2023-12-09", - }, - { - weekNum: 3, - weekStartDate: "2023-12-10", - weekEndDate: "2023-12-16", - }, - { - weekNum: 4, - weekStartDate: "2023-12-17", - weekEndDate: "2023-12-23", - }, - { - weekNum: 5, - weekStartDate: "2023-12-24", - weekEndDate: "2023-12-30", - }, - ], - config: { - todayDate: "2023-12-01", - initialViewStartDate: "2023-12-01", - initialViewEndDate: "2023-12-30", - calendarViewDirection: "future", - initialShopTimeSlotsResponse: { - inshopTimeSlotsData: { - days: [ - { - date: "2023-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - mobileTimeSlotsData: { - days: [ - { - date: "2023-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - estimatedServiceMinutesMinimum: 90, - estimatedServiceMinutesMaximum: 120, - }, - hideSomeDaysForInitialView: true, - hideSecondMonth: true, - preSelectedDate: null, - }, - monthsData: [ - { - monthLabel: "December", - monthIndex: 12, - monthString: "December-2023", - yearNum: 2023, - datesInshop: [ - { - dateNum: 1, - dayClasses: " current-day", - inputValue: "2023-12-01", - isAvailable: false, - }, - { - dateNum: 2, - dayClasses: "", - inputValue: "2023-12-02", - isAvailable: false, - }, - { - dateNum: 3, - dayClasses: " sunday", - inputValue: "2023-12-03", - isAvailable: false, - }, - { - dateNum: 4, - dayClasses: "", - inputValue: "2023-12-04", - isAvailable: false, - }, - { - dateNum: 5, - dayClasses: "", - inputValue: "2023-12-05", - isAvailable: false, - }, - { - dateNum: 6, - dayClasses: "", - inputValue: "2023-12-06", - isAvailable: false, - }, - { - dateNum: 7, - dayClasses: "", - inputValue: "2023-12-07", - isAvailable: false, - }, - { - dateNum: 8, - dayClasses: "", - inputValue: "2023-12-08", - isAvailable: false, - }, - { - dateNum: 9, - dayClasses: "", - inputValue: "2023-12-09", - isAvailable: false, - }, - { - dateNum: 10, - dayClasses: " sunday", - inputValue: "2023-12-10", - isAvailable: false, - }, - { - dateNum: 11, - dayClasses: "", - inputValue: "2023-12-11", - isAvailable: false, - }, - { - dateNum: 12, - dayClasses: "", - inputValue: "2023-12-12", - isAvailable: false, - }, - { - dateNum: 13, - dayClasses: "", - inputValue: "2023-12-13", - isAvailable: false, - }, - { - dateNum: 14, - dayClasses: "", - inputValue: "2023-12-14", - isAvailable: false, - }, - { - dateNum: 15, - dayClasses: "", - inputValue: "2023-12-15", - isAvailable: false, - }, - { - dateNum: 16, - dayClasses: "", - inputValue: "2023-12-16", - isAvailable: false, - }, - { - dateNum: 17, - dayClasses: " sunday", - inputValue: "2023-12-17", - isAvailable: false, - }, - { - dateNum: 18, - dayClasses: "", - inputValue: "2023-12-18", - isAvailable: false, - }, - { - dateNum: 19, - dayClasses: "", - inputValue: "2023-12-19", - isAvailable: false, - }, - { - dateNum: 20, - dayClasses: "", - inputValue: "2023-12-20", - isAvailable: false, - }, - { - dateNum: 21, - dayClasses: "", - inputValue: "2023-12-21", - isAvailable: false, - }, - { - dateNum: 22, - dayClasses: "", - inputValue: "2023-12-22", - isAvailable: false, - }, - { - dateNum: 23, - dayClasses: "", - inputValue: "2023-12-23", - isAvailable: false, - }, - { - dateNum: 24, - dayClasses: " sunday", - inputValue: "2023-12-24", - isAvailable: false, - }, - { - dateNum: 25, - dayClasses: "", - inputValue: "2023-12-25", - isAvailable: false, - }, - { - dateNum: 26, - dayClasses: "", - inputValue: "2023-12-26", - isAvailable: false, - }, - { - dateNum: 27, - dayClasses: "", - inputValue: "2023-12-27", - isAvailable: false, - }, - { - dateNum: 28, - dayClasses: "", - inputValue: "2023-12-28", - isAvailable: false, - }, - { - dateNum: 29, - dayClasses: "", - inputValue: "2023-12-29", - isAvailable: false, - }, - { - dateNum: 30, - dayClasses: "", - inputValue: "2023-12-30", - isAvailable: true, - }, - { - dateNum: 31, - dayClasses: " sunday day-hidden", - inputValue: "2023-12-31", - isAvailable: false, - }, - ], - datesMobile: [], - startDateDayIndex: 5, - monthClass: "", - isMonthThatHidesSomeDaysForInitialView: true, - }, - { - monthLabel: "January", - monthIndex: 1, - monthString: "January-2024", - yearNum: 2024, - datesInshop: [ - { - dateNum: 1, - dayClasses: "", - inputValue: "2024-01-01", - isAvailable: false, - }, - { - dateNum: 2, - dayClasses: "", - inputValue: "2024-01-02", - isAvailable: false, - }, - { - dateNum: 30, - dayClasses: "", - inputValue: "2024-01-30", - isAvailable: false, - }, - { - dateNum: 31, - dayClasses: "", - inputValue: "2024-01-31", - isAvailable: false, - }, - ], - datesMobile: [], - startDateDayIndex: 1, - monthClass: " month-hidden", - }, - ], -}; - -const mockInitialData = { - todayDate: "2023-07-04", - initialViewStartDate: "2023-07-05", - initialViewEndDate: "2023-08-19", - calendarViewDirection: "future", - initialShopTimeSlotsResponse: { - inshopTimeSlotsData: { - days: [ - { - date: "2023-07-25", - timeSlots: [ - { - id: "06747-01820-S-B*20295*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - { - id: "06747-01820-S-B*20295*730 AM", - startTime: "07:30", - endTime: "08:30", - offerPremium: false, - }, - ], - }, - { - date: "2023-07-26", - timeSlots: [ - { - id: "06747-01820-S-B*20296*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - mobileTimeSlotsData: { - days: [ - { - date: "2023-07-25", - timeSlots: [ - { - id: "06747-01820-S-B*20295*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - { - id: "06747-01820-S-B*20295*730 AM", - startTime: "07:30", - endTime: "08:30", - offerPremium: false, - }, - ], - }, - { - date: "2023-07-26", - timeSlots: [ - { - id: "06747-01820-S-B*20296*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - estimatedServiceMinutesMinimum: 90, - estimatedServiceMinutesMaximum: 120, - }, - hideSomeDaysForInitialView: true, - hideSecondMonth: false, - preSelectedDate: null, -}; - -const mockCallbackResponse = { - inshopTimeSlotsData: { - days: [ - { - date: "2024-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - { - date: "2024-01-02", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - mobileTimeSlotsData: { - days: [ - { - date: "2024-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - { - date: "2024-01-02", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ], - }, - - estimatedServiceMinutesMinimum: 90, - estimatedServiceMinutesMaximum: 120, -}; - -const mockPromiseResolve = (returnValue) => - jest.fn(async () => Promise.resolve({ valid: returnValue })); - -describe("date-picker.vue", () => { - describe("initial setup", () => { - test("Expect initializeComponent to be run", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - wrapper.vm.initializeComponent = jest.fn().mockImplementation(); - wrapper.vm.initializeComponent(mockInitialData); - - // Assert - expect(wrapper.vm.initializeComponent).toHaveBeenCalled(); - - wrapper.unmount(); - }); - - test("When initializeComponent runs, expect will run setCalendarData method", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - const spy = jest.spyOn(wrapper.vm, "setCalendarData"); - wrapper.vm.$refs.timeSlotModalQuestion.initializeComponent = jest.fn(); - wrapper.vm.$nextTick(); - - // Act - wrapper.vm.initializeComponent(mockInitialData); - - // Assert - expect(spy).toHaveBeenCalled(); - - wrapper.unmount(); - }); - - test("If prop customComponentId is supplied, expect it will be used for componentId in setup method", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - customComponentId: "dateQuestion", - }, - }); - - // Act - const componentIdValue = wrapper.vm.componentId; - - // Assert - expect(componentIdValue).toEqual("dateQuestion"); - - wrapper.unmount(); - }); - - test("If prop getMoreDatesCallback is not supplied, expect the default function will return empty array", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - - // Act - const callbackResponse = wrapper.vm.getMoreDatesCallback( - "2023-07-24", - "2023-08-19", - "Inshop", - "006747" - ); - - // Assert - expect(callbackResponse).toEqual([]); - - wrapper.unmount(); - }); - - test("expect a date string created from today", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - const todayDate = new Date(); - const todayDateString = - todayDate.getFullYear() + - "-" + - ("0" + (todayDate.getMonth() + 1)).slice(-2) + - "-" + - ("0" + todayDate.getDate()).slice(-2); - - // Assert - expect(wrapper.vm.todayString).toEqual(todayDateString); - - wrapper.unmount(); - }); - - test("expect a date string created from todayOverrideDateString", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-02", - }, - }); - - // Assert - expect(wrapper.vm.todayString).toEqual("2023-07-02"); - - wrapper.unmount(); - }); - - test("expect computed todayDayIndex returns the correct day index", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-02", - }, - }); - - // Assert - expect(wrapper.vm.todayDayIndex).toEqual(0); - - wrapper.unmount(); - }); - - test("expect computed todayDateNum returns the correct date number", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-02", - }, - }); - - // Assert - expect(wrapper.vm.todayDateNum).toEqual(2); - - wrapper.unmount(); - }); - - test("expect computed currentWeekStartDateNum returns the correct date number when todayDayIndex is < todayDateNum", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - - // Assert - expect(wrapper.vm.currentWeekStartDateNum).toEqual(2); - - wrapper.unmount(); - }); - - test("expect computed currentWeekStartDateNum returns 1 when todayDayIndex is >= todayDateNum", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-01", - }, - }); - - // Assert - expect(wrapper.vm.currentWeekStartDateNum).toEqual(1); - - wrapper.unmount(); - }); - - test("expect computed currentWeekEndDateNum returns correct value", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - - // Assert - expect(wrapper.vm.currentWeekEndDateNum).toEqual(8); - - wrapper.unmount(); - }); - - test("expect computed calendarViewDirection returns 'past' when prop selectableDatesSetting is 'past'", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "past", - todayOverrideDateString: "2023-07-05", - }, - }); - - // Assert - expect(wrapper.vm.calendarViewDirection).toEqual("past"); - - wrapper.unmount(); - }); - - test("expect computed calendarViewDirection returns 'future' when prop selectableDatesSetting is 'custom'", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - - // Assert - expect(wrapper.vm.calendarViewDirection).toEqual("future"); - - wrapper.unmount(); - }); - - // describe("when loadInitialData is run...", () => { - // test("and this.todayString exists, expect it should have a todayDate matching today", async () => { - // // Arrange - // const { wrapper } = setupMocks({}); - // const todayDate = new Date(); - // const todayDateString = - // todayDate.getFullYear() + - // "-" + - // ("0" + (todayDate.getMonth() + 1)).slice(-2) + - // "-" + - // ("0" + todayDate.getDate()).slice(-2); - - // // Act - // const testResult = await wrapper.vm.loadInitialData({ - // selectableDatesSetting: "custom", - // initialViewRowsToShow: 5, - // getSelectableDatesCallback: mockPromiseResolve, - // preSelectedDate: null, - // }); - - // // Assert - // expect(testResult).toMatchObject({ - // todayDate: todayDateString, - // }); - - // wrapper.unmount(); - // }); - - // test("and overrride date exists, expect it should have a todayDate matching the override", async () => { - // // Arrange - // const overrideDate = mockValuesForSetDate01.overrideDate; - // const { wrapper } = setupMocks({ - // propsData: { - // selectableDatesSetting: "custom", - // todayOverrideDateString: overrideDate, - // }, - // }); - - // // Act - // const localThis = { - // todayString: null, - // todayOverrideDateString: overrideDate, - // getMonthEnd: () => mockValuesForSetDate01.monthEnd, - // getInitialViewWeeks: () => mockValuesForSetDate01.initialViewWeeks, - // }; - // const testResult = await datePicker.methods.loadInitialData.call(localThis, { - // selectableDatesSetting: "custom", - // initialViewRowsToShow: 5, - // getSelectableDatesCallback: mockPromiseResolve, - // preSelectedDate: null, - - // todayOverrideDateString: overrideDate, - // }); - - // // Assert - // expect(testResult).toMatchObject({ - // todayDate: overrideDate, - // }); - - // wrapper.unmount(); - // }); - - // test("with no this.todayString or overrride date, expect it should have a todayDate matching today", async () => { - // // Arrange - // const { wrapper } = setupMocks({}); - // const todayDate = new Date(); - // const todayDateString = - // todayDate.getFullYear() + - // "-" + - // ("0" + (todayDate.getMonth() + 1)).slice(-2) + - // "-" + - // ("0" + todayDate.getDate()).slice(-2); - - // // Act - // const localThis = { - // todayString: null, - // getMonthEnd: () => mockValuesForSetDate01.monthEnd, - // getInitialViewWeeks: () => mockValuesForSetDate01.initialViewWeeks, - // }; - - // //Act - // const testResult = await datePicker.methods.loadInitialData.call(localThis, { - // selectableDatesSetting: "custom", - // initialViewRowsToShow: 5, - // getSelectableDatesCallback: mockPromiseResolve, - // preSelectedDate: null, - // }); - - // // Assert - // expect(testResult).toMatchObject({ - // todayDate: todayDateString, - // }); - - // wrapper.unmount(); - // }); - - // test("and config.selectableDatesSetting is PAST, expect it should have a calendarViewDirection of PAST", async () => { - // // Arrange - // const { wrapper } = setupMocks({}); - - // // Act - // const testResult = await wrapper.vm.loadInitialData({ - // selectableDatesSetting: "past", - // initialViewRowsToShow: 5, - // getSelectableDatesCallback: mockPromiseResolve, - // }); - - // // Assert - // expect(testResult).toMatchObject({ - // calendarViewDirection: "past", - // }); - - // wrapper.unmount(); - // }); - - // test("and config.selectableDatesSetting is CUSTOM, expect it should have a calendarViewDirection of FUTURE", async () => { - // // Arrange - // const { wrapper } = setupMocks({}); - - // // Act - // const testResult = await wrapper.vm.loadInitialData({ - // selectableDatesSetting: "custom", - // initialViewRowsToShow: 5, - // getSelectableDatesCallback: mockPromiseResolve, - // }); - - // // Assert - // expect(testResult).toMatchObject({ - // calendarViewDirection: "future", - // }); - - // wrapper.unmount(); - // }); - // }); - - describe("when setCalendarData is run...", () => { - test("expect that data elements are updated properly", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - - // Act - await wrapper.vm.setCalendarData(mockValuesForSetDate01.config); - - // Assert - expect(wrapper.vm.hideSomeDaysForInitialView).toBe(true); - expect(wrapper.vm.selectableDatesInshop[0]).toMatchObject({ - date: "2023-12-30", - }); - expect(wrapper.vm.selectableDatesInshop[0].timeSlots.length).toBeGreaterThan(0); - expect(wrapper.vm.months.length).toBe(7); - expect(wrapper.vm.months[0]).toMatchObject({ - monthLabel: "December", - monthIndex: 12, - monthString: "December-2023", - yearNum: 2023, - startDateDayIndex: 5, - monthClass: "", - isMonthThatHidesSomeDaysForInitialView: true, - }); - - wrapper.unmount(); - }); - - test("expect that this.months are reversed if direction is past", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "past", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - const modifiedConfig = { ...mockValuesForSetDate01.config }; - modifiedConfig.calendarViewDirection = "past"; - - // Act - await wrapper.vm.setCalendarData(modifiedConfig); - - // Assert - expect(wrapper.vm.months.length).toBe(37); - expect(wrapper.vm.months[0]).toMatchObject({ - monthString: "December-2020", - startDateDayIndex: 2, - monthClass: " month-hidden last-available-month", - }); - - wrapper.unmount(); - }); - - test("expect that if there's a pre-selected date that it will scroll to it", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - const modifiedConfig = { ...mockValuesForSetDate01.config }; - modifiedConfig.preSelectedDate = "2023-12-25"; - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - - // Act - await wrapper.vm.setCalendarData(modifiedConfig); - await wrapper.vm.$nextTick(); - - // Assert - expect(wrapper.vm.scrollToElement).toHaveBeenCalledWith("December-2023"); - - wrapper.unmount(); - }); - - test("expect that if there's a pre-selected date within the last month available then the View More Dates button will be hidden", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - const modifiedConfig = { ...mockValuesForSetDate01.config }; - modifiedConfig.preSelectedDate = "2024-06-11"; - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - - // Act - await wrapper.vm.setCalendarData(modifiedConfig); - await wrapper.vm.$nextTick(); - - // Assert - expect(wrapper.vm.disableViewMoreDatesButton).toBe(true); - - wrapper.unmount(); - }); - - test("expect that this.months are reversed if direction is past", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "past", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - const modifiedConfig = { ...mockValuesForSetDate01.config }; - modifiedConfig.calendarViewDirection = "past"; - - // Act - await wrapper.vm.setCalendarData(modifiedConfig); - - // Assert - expect(wrapper.vm.months.length).toBe(37); - expect(wrapper.vm.months[0]).toMatchObject({ - monthString: "December-2020", - startDateDayIndex: 2, - monthClass: " month-hidden last-available-month", - }); - - wrapper.unmount(); - }); - - test("expect that if there's a pre-selected date that it will scroll to it", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - const modifiedConfig = { ...mockValuesForSetDate01.config }; - modifiedConfig.preSelectedDate = "2023-12-25"; - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - - // Act - await wrapper.vm.setCalendarData(modifiedConfig); - await wrapper.vm.$nextTick(); - - // Assert - expect(wrapper.vm.scrollToElement).toHaveBeenCalledWith("December-2023"); - - wrapper.unmount(); - }); - }); - - describe("when getInitialViewWeeks is run...", () => { - test("expect that 5 weeks will be returned when no preselected date", () => { - // Arrange - const { wrapper } = setupMocks({}); - const todayString = "2023-02-01"; - - // Act - const testResult = wrapper.vm.getInitialViewWeeks(todayString, 5); - - // Assert - expect(testResult.length).toBe(5); - - wrapper.unmount(); - }); - - test("expect that today will be in the start/end range of dates of the first week when no preselected date", () => { - // Arrange - const { wrapper } = setupMocks({}); - const todayString = "2023-02-01"; - - // Act - const testResult = wrapper.vm.getInitialViewWeeks(todayString, 5); - - // Assert - expect( - testResult[0].weekStartDate <= todayString && - todayString <= testResult[0].weekEndDate - ).toBe(true); - - wrapper.unmount(); - }); - - test("expect that single weeks that span 2 months will be split into separate shorter 'week' spans", () => { - // Arrange - const { wrapper } = setupMocks({}); - const todayString = "2023-02-15"; - - // Act - const testResult = wrapper.vm.getInitialViewWeeks(todayString, 5); - - // Assert - expect(testResult.length).toBe(5); - expect(testResult[0]).toMatchObject({ - weekStartDate: "2023-02-12", - }); - expect(testResult[testResult.length - 1]).toMatchObject({ - weekEndDate: "2023-03-11", - }); - - wrapper.unmount(); - }); - - test("expect that if today is 7/31/23 and there's a preselected date of 10/1/23 that there will be 14 initial weeks returned", () => { - // Arrange - const { wrapper } = setupMocks({}); - const mockPreSelectedDate = "2023-10-01"; - - // Act - const testResult = wrapper.vm.getInitialViewWeeks( - "2023-07-31", - 5, - mockPreSelectedDate - ); - - // Assert - expect(testResult.length).toBe(14); - - wrapper.unmount(); - }); - - test("expect that if there's a preselected date that the last week end date will be the end of the month of the preselected date", () => { - // Arrange - const { wrapper } = setupMocks({}); - const mockPreSelectedDate = "2023-10-01"; - - // Act - const testResult = wrapper.vm.getInitialViewWeeks( - "2023-07-31", - 5, - mockPreSelectedDate - ); - - // Assert - expect(testResult[testResult.length - 1]).toMatchObject({ - weekEndDate: "2023-10-31", - }); - - wrapper.unmount(); - }); - }); - - describe("when there's a pre-selected date...", () => { - test("and loadInitialData runs, expect hideSomeDaysForInitialView and hideSecondMonth to be false", async () => { - // Arrange - // uses "2023-12-01" which would set both hideSomeDaysForInitialView and hideSecondMonth to true, unless there was a pre-selected date - const overrideDate = mockValuesForSetDate01.overrideDate; - const mockMonthEnd = mockValuesForSetDate01.monthEnd; - const mockInitialViewWeeks = mockValuesForSetDate01.initialViewWeeks; - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: overrideDate, - }, - }); - - // Act - const localThis = { - todayString: null, - todayOverrideDateString: overrideDate, - getMonthEnd: () => mockMonthEnd, - getInitialViewWeeks: () => mockInitialViewWeeks, - }; - const testResult = await datePicker.methods.loadInitialData.call(localThis, { - selectableDatesSetting: "custom", - initialViewRowsToShow: 5, - getSelectableDatesCallback: mockPromiseResolve, - preSelectedDate: "2024-01-01", - todayOverrideDateString: overrideDate, - }); - - // Assert - expect(testResult).toMatchObject({ - hideSomeDaysForInitialView: false, - hideSecondMonth: false, - }); - - wrapper.unmount(); - }); - }); - }); - - describe("showAnotherMonth method...", () => { - test("expect that when hideSomeDaysForInitialView is true that it scrolls to correct month", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - wrapper.vm.months = mockValuesForSetDate01.monthsData; - wrapper.vm.updateSelectableDates = jest.fn().mockImplementation(); - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - wrapper.vm.hideSomeDaysForInitialView = true; - - // Act - await wrapper.vm.showAnotherMonth(); - - // // Assert - // expect(wrapper.vm.updateSelectableDates).toHaveBeenCalledWith( - // "2023-12-31", - // "2023-12-31" - // ); - // expect(wrapper.vm.scrollToElement).toHaveBeenCalledWith("December-2023"); - - // wrapper.unmount(); - }); - - test("expect that when hideSomeDaysForInitialView is false and direction is FUTURE that it scrolls to correct month", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - wrapper.vm.months = [...mockValuesForSetDate01.monthsData]; // copy array w/o reference to original - wrapper.vm.updateSelectableDates = jest.fn().mockImplementation(); - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - wrapper.vm.hideSomeDaysForInitialView = false; - - // Act - await wrapper.vm.showAnotherMonth(); - - // Assert - expect(wrapper.vm.updateSelectableDates).toHaveBeenCalledWith( - "2024-01-01", - "2024-01-31" - ); - expect(wrapper.vm.scrollToElement).toHaveBeenCalledWith("January-2024"); - - wrapper.unmount(); - }); - - test("expect that when hideSomeDaysForInitialView is false and direction is PAST that it scrolls to correct month", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "past", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - // Force correct state for this test. // TODO - figure out why original array is getting mutated here, making next line necessary - mockValuesForSetDate01.monthsData[1].monthClass = " month-hidden"; - - wrapper.vm.months = [...mockValuesForSetDate01.monthsData]; // copy array w/o reference to original - wrapper.vm.updateSelectableDates = jest.fn().mockImplementation(); - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - wrapper.vm.hideSomeDaysForInitialView = false; - - // Act - await wrapper.vm.showAnotherMonth(); - - // Assert - expect(wrapper.vm.updateSelectableDates).toHaveBeenCalledWith( - "2024-01-01", - "2024-01-31" - ); - expect(wrapper.vm.scrollToElement).toHaveBeenCalledWith("January-2024"); - - wrapper.unmount(); - }); - - test("expect that when the month to scroll to is the last available month that it will disable the View More Dates button", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - wrapper.vm.months = [...mockValuesForSetDate01.monthsData]; // copy array w/o reference to original - wrapper.vm.updateSelectableDates = jest.fn().mockImplementation(); - wrapper.vm.scrollToElement = jest.fn().mockImplementation(); - wrapper.vm.disableViewMoreDatesButton = false; - mockValuesForSetDate01.monthsData[1].monthClass = " month-hidden last-available-month"; // Force correct state for this test. - - // Act - await wrapper.vm.showAnotherMonth(); - - // Assert - expect(wrapper.vm.disableViewMoreDatesButton).toBe(true); - - wrapper.unmount(); - }); - }); - - describe("updateSelectableDates method...", () => { - test("expect that new dates from callback are added to selectableDatesInshop", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - getMoreDatesCallback: jest.fn(() => mockCallbackResponse), - }, - }); - wrapper.vm.selectableDatesInshop = [ - { - date: "2023-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ]; - wrapper.vm.months = mockValuesForSetDate01.monthsData; - - // Act - await wrapper.vm.updateSelectableDates("2024-01-01", "2024-01-05"); - - const isFoundInArray = wrapper.vm.selectableDatesInshop.find((obj) => { - return obj.date === "2024-01-02"; - }); - - // Assert - expect(isFoundInArray).not.toBeUndefined(); - - wrapper.unmount(); - }); - - test("expect that isAvailable flag on selectable dates is set to true", async () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - getMoreDatesCallback: jest.fn(() => mockCallbackResponse), - }, - }); - wrapper.vm.selectableDatesInshop = [ - { - date: "2023-12-30", - timeSlots: [ - { - id: "06747-01820-S-B*20453*7 AM", - startTime: "07:00", - endTime: "08:00", - offerPremium: false, - }, - ], - }, - ]; - wrapper.vm.months = mockValuesForSetDate01.monthsData; - - // Act - await wrapper.vm.updateSelectableDates("2024-01-01", "2024-01-05"); - const targetMonth = wrapper.vm.months.find((month) => { - return month.monthString === "January-2024"; - }); - - console.log("TEST targetMonth: ", targetMonth); - - const dateInArray = targetMonth.datesInshop.find((date) => { - return date.inputValue === "2024-01-02"; - }); - - // Assert - expect(dateInArray).toMatchObject({ - isAvailable: true, - }); - - wrapper.unmount(); - }); - }); - - describe("scrollToElement method...", () => { - test("expect that new dates from callback are added to selectableDatesInshop", () => { - // Arrange - const container = document.createElement("div"); - container.classList.add("page-container-grouped-styles"); - const targetElement = document.createElement("div"); - targetElement.setAttribute("id", "January-2024"); - container.appendChild(targetElement); - document.body.appendChild(container); - window.requestAnimationFrame = jest.fn(); - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: mockValuesForSetDate01.overrideDate, - }, - }); - - // Act - wrapper.vm.scrollToElement("January-2024"); - - // Assert - expect(window.requestAnimationFrame).toBeCalled(); - - wrapper.unmount(); - }); - }); - - describe("If user selects a date...", () => { - test("expect it will emit update:modelValue", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - const dateToSelect = "2023-07-07"; - - // Act - wrapper.setValue({ selectedDate: dateToSelect }); - - // Assert - expect(wrapper.emitted()["update:modelValue"][0]).toEqual([ - { selectedDate: "2023-07-07" }, - ]); - - wrapper.unmount(); - }); - - test("expect watched modelValue will be triggered", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - const dateToSelect = "2023-07-07"; - wrapper.vm.resetField = jest.fn(); - - // Act - wrapper.vm.$options.watch.modelValue.call(wrapper.vm, dateToSelect); - - // Assert - expect(wrapper.vm.resetField).toBeCalled(); - expect(wrapper.vm.resetField).toBeCalledWith({ value: dateToSelect }); - - wrapper.unmount(); - }); - }); - - describe("If fireDateSelectedEvent runs... ", () => { - test("expect it will emit date-clicked on mouse clicks ", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - - // Act - wrapper.vm.fireDateSelectedEvent({}); - const flattenedEmitted = JSON.stringify(wrapper.emitted()); - - // Assert - expect(wrapper.emitted()).toHaveProperty("date-clicked"); - expect(flattenedEmitted.includes("date-clicked")).toBeTruthy; - - wrapper.unmount(); - }); - - test("expect it will NOT emit date-clicked on keyboard arrow navigation ", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - }, - }); - - // Act - wrapper.vm.fireDateSelectedEvent({ screenX: 0, screenY: 0 }); - const flattenedEmitted = JSON.stringify(wrapper.emitted()); - - // Assert - expect(wrapper.emitted()).not.toHaveProperty("date-clicked"); - expect(flattenedEmitted.includes("date-clicked")).toBe(false); - - wrapper.unmount(); - }); - }); - - describe("If user triggers a validation error...", () => { - test("expect that watched errorMessage will be triggered", () => { - // Arrange - const { wrapper } = setupMocks({ - propsData: { - selectableDatesSetting: "custom", - todayOverrideDateString: "2023-07-05", - }, - }); - wrapper.vm.scrollToElement = jest.fn(); - - // Act - wrapper.vm.$options.watch.errorMessage.call(wrapper.vm, "anything"); - - // Assert - expect(wrapper.vm.scrollToElement).toBeCalled(); - expect(wrapper.vm.scrollToElement).toBeCalledWith("date-of-month-error"); - - wrapper.unmount(); - }); - }); -}); - -function setupMocks(mountOptionsMockData = {}) { - store.getters = { - order: { - serviceLocation: { appointmentType: "Inshop", provider: { providerNumber: "12345" } }, - }, - lineItems: { supportingItems: [] }, - }; - const initialMountOptionsMockData = { - store: { - getters: store.getters, - }, - }; - const mountOptions = getMountOptions( - Object.assign(initialMountOptionsMockData, mountOptionsMockData) - ); - - const wrapper = shallowMount(datePicker, mountOptions); - - return { wrapper }; -} diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index a4eb232e0..59297ae05 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -1,17 +1,18 @@