diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js new file mode 100644 index 00000000..db866faf --- /dev/null +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -0,0 +1,82 @@ +/* eslint-env jest */ +import { mount, flushPromises } from '@vue/test-utils'; +import { createTestingPinia } from '@pinia/testing'; +import { navigationScenarios } from '@/router/router-constants/navigation-scenarios'; +import { routerParams } from '@/router/router-params'; +import { vehicleCategories } from '@/constants/vehicle-categories'; +import VehicleDamageComponent from './vehicle-damage.vue'; + +const mockRoute = { + params: {}, +}; +const mockRouter = { + navigate: jest.fn(), +}; +const mountOptions = { + global: { + mixins: [ + { + computed: { + navigationScenarios() { + return navigationScenarios; + }, + routerParams() { + return routerParams; + }, + vehicleCategories() { + return vehicleCategories; + }, + }, + methods: { + getCmsContent: jest.fn(), + getFooterInfoBoxHeight: jest.fn(() => 80), + getPageNameByQueryString: jest.fn(() => ''), + }, + }, + ], + mocks: { + $route: mockRoute, + $router: mockRouter, + }, + stubs: { + siteHeader: true, + vehicleBanner: true, + siteSubHeader: true, + siteDoorOptions: true, + damageLocationQuestion: true, + windshieldOptions: true, + replaceOptionsQuestion: true, + alert: true, + }, + }, +}; +beforeEach(() => { + jest.clearAllMocks(); +}); +describe('vehicle-damage.vue', () => { + test('When damage selected is a repair, navigate to coverage-statement page', async () => { + mountOptions.global.plugins = [createTestingPinia({ + initialState: { + main: { + order: { + damage: { + isRepair: true, + }, + }, + }, + }, + })]; + const wrapper = mount(VehicleDamageComponent, mountOptions); + const siteFooterWrapper = wrapper.getComponent({ ref: 'siteFooter' }); + + siteFooterWrapper.vm.$emit('forwardClicked'); + + await flushPromises(); + expect(mockRouter.navigate).toHaveBeenCalledTimes(1); + expect(mockRouter.navigate) + .toHaveBeenCalledWith( + navigationScenarios.CLICKED_FORWARD_WITH_REPAIR, + mockRoute, + ); + }); +}); diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 0683869b..b4c96911 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -48,8 +48,10 @@ + @backClicked="backButtonAction" + @forwardClicked="forwardButtonAction" + ref="siteFooter" + /> @@ -119,6 +121,11 @@ export default { ); }); }, + setup() { + const mainStore = useMainStore(); + + return { mainStore }; + }, data() { return { selectedDamageLocations: this.getDamageLocationsFromStore(), @@ -148,15 +155,15 @@ export default { var glassSelections = []; if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return glass.glassLocation === damageLocationsSelected.WINDSHIELD; }) || - useMainStore().order.damage.isRepair + this.mainStore.order.damage.isRepair ) { glassSelections.push(damageLocationsSelected.WINDSHIELD); } if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return ( glass.glassLocation === damageLocationsSelected.DRIVER || glass.glassLocation === damageLocationsSelected.PASSENGER @@ -167,7 +174,7 @@ export default { } if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return glass.glassLocation === damageLocationsSelected.REAR; }) ) { @@ -184,14 +191,14 @@ export default { selectedWindshieldReplaceOptions: [], }; - if (useMainStore().order.damage.isRepair === undefined) return windshieldOptions; + if (this.mainStore.order.damage.isRepair === undefined) return windshieldOptions; - if (useMainStore().order.damage.isRepair) { + if (this.mainStore.order.damage.isRepair) { windShieldOptions.selectedWindshieldDamageType = damageLocationsSelected.REPAIR; - windShieldOptions.selectedWindshieldChipCount = useMainStore().order.damage.numberOfChips; + windShieldOptions.selectedWindshieldChipCount = this.mainStore.order.damage.numberOfChips; } else { if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return ( glass.glassLocation === damageLocationsSelected.WINDSHIELD && glass.glassName === damageLocationsSelected.SINGLE @@ -206,7 +213,7 @@ export default { } if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return ( glass.glassLocation === damageLocationsSelected.WINDSHIELD && glass.glassName === damageLocationsSelected.DRIVER @@ -221,7 +228,7 @@ export default { } if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return ( glass.glassLocation === damageLocationsSelected.WINDSHIELD && glass.glassName === damageLocationsSelected.PASSENGER @@ -242,7 +249,7 @@ export default { getDoorSidesFromStore() { var doorSides = []; if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return glass.glassLocation === damageLocationsSelected.DRIVER; }) ) { @@ -250,7 +257,7 @@ export default { } if ( - useMainStore().order.damage.glassToReplace?.some((glass) => { + this.mainStore.order.damage.glassToReplace?.some((glass) => { return glass.glassLocation === damageLocationsSelected.PASSENGER; }) ) { @@ -263,7 +270,7 @@ export default { getDriverSideReplaceOptionsFromStore() { var driverSideReplaceOptions = []; - useMainStore().order.damage.glassToReplace?.forEach((glass) => { + this.mainStore.order.damage.glassToReplace?.forEach((glass) => { if (glass.glassLocation === damageLocationsSelected.DRIVER) { driverSideReplaceOptions.push(glass.glassName); } @@ -275,7 +282,7 @@ export default { getPassengerSideReplaceOptionsFromStore() { var passengerSideReplaceOptions = []; - useMainStore().order.damage.glassToReplace?.forEach((glass) => { + this.mainStore.order.damage.glassToReplace?.forEach((glass) => { if (glass.glassLocation === damageLocationsSelected.PASSENGER) { passengerSideReplaceOptions.push(glass.glassName); } @@ -285,7 +292,7 @@ export default { }, getRearReplaceOptionsFromStore() { - var rearReplaceOptions = useMainStore().order.damage.glassToReplace?.filter( + var rearReplaceOptions = this.mainStore.order.damage.glassToReplace?.filter( (glass) => glass.glassLocation === damageLocationsSelected.REAR )[0]?.glassName; @@ -300,18 +307,26 @@ export default { }, navigateForward() { - // If vin already exists, navigate directly to vin-lookup - if (useMainStore().order.vehicle.vin) { + if (this.mainStore.damage.isRepair) { this.$router.navigate( - this.navigationScenarios.CLICKED_FORWARD_WITH_VIN, - this.$route - ); - } else { - this.$router.navigate( - this.navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN, + this.navigationScenarios.CLICKED_FORWARD_WITH_REPAIR, this.$route ); } + else { + // If vin already exists, navigate directly to vin-lookup + if (this.mainStore.order.vehicle.vin) { + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_WITH_VIN, + this.$route + ); + } else { + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN, + this.$route + ); + } + } }, selectedGlassToReplace() { diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index f8848107..da815f1f 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -11,6 +11,9 @@ const navigationScenarios = { CLICKED_FORWARD_WELCOME_PAGE: "CLICKED_FORWARD_WELCOME_PAGE", CLICKED_FORWARD_POLICY_HOLDER_DETAILS: "CLICKED_FORWARD_POLICY_HOLDER_DETAILS", + // Vehicle Damage + CLICKED_FORWARD_WITH_REPAIR: 'CLICKED_FORWARD_WITH_REPAIR', + // Vin selection CLICKED_BACK_WITH_VIN: "CLICKED_BACK_WITH_VIN", CLICKED_FORWARD_WITH_VIN: "CLICKED_FORWARD_WITH_VIN", diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index d66ae872..3ed33adb 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -63,6 +63,10 @@ const routingTable = function(store) { scenario: navigationScenarios.CLICKED_BACK, destinationIssPageValue: issPageValues.VEHICLE_STYLE, }, + { + scenario: navigationScenarios.CLICKED_FORWARD_WITH_REPAIR, + destinationIssPageValue: issPageValues.COVERAGE_STATEMENT, + }, { scenario: navigationScenarios.CLICKED_FORWARD_WITH_VIN, destinationIssPageValue: issPageValues.VEHICLE_LOOKUP,