diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue index 7956343a..46789bfa 100644 --- a/src/layouts/policy-holder-details/policy-holder-details.vue +++ b/src/layouts/policy-holder-details/policy-holder-details.vue @@ -83,135 +83,95 @@ export default { { resultKey: "cmsContent", promise: cmsContentPromise, - },]; - - //use resultMap to populate layout content. - let resultMap = await settleAllPromises(promiseResultMap); - - next((vm) => { - vm.setCmsContent(resultMap.cmsContent); - }); - - }, - created(){ - this.getVehiclesfromPolicyLookup(); - }, - methods: - { - backButtonAction() { - this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); }, + ]; - async forwardButtonAction() - { - this.mainStore.updatePolicyHolderDetails(this.customerQuestions); - return this.navigateForward(); - }, + //use resultMap to populate layout content. + let resultMap = await settleAllPromises(promiseResultMap); - navigateForward() { - if(this.vehiclesCount > 0) + next((vm) => { + vm.setCmsContent(resultMap.cmsContent); + }); + + }, + methods: + { + backButtonAction() { + this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); + }, + + async forwardButtonAction() + { + this.mainStore.updatePolicyHolderDetails(this.customerQuestions); + return this.navigateForward(); + }, + + navigateForward() { + if(this.vehiclesCount > 0) + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED, + this.$route, + {}, + {}, + this.vehiclesFound + ); + else this.$router.navigate( - this.navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED, - this.$route, - {}, - {}, - this.vehiclesFound - ); - else - this.$router.navigate( - this.navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, - this.$route - ); - }, - getPolicyHolderDetailsFromStore() { - return { - addressQuestions : - { - streetAddress: this.mainStore.order.customer.address.streetAddress, - streetAddress2: this.mainStore.order.customer.address.streetAddress2, - city: this.mainStore.order.customer.address.city, - state: this.mainStore.order.customer.address.state, - zipCode: this.mainStore.order.customer.address.zipCode, - }, - firstName : this.mainStore.order.customer.firstName, - lastName : this.mainStore.order.customer.lastName, - } - }, - async getPolicyLookupResponse(){ - const policyLookupResponse = this.mainStore.getCoveragePolicyInfo({ - accountNumber:this.mainStore.order.accountNumber.toString(), - policyNumber:this.mainStore.order.policy.policyNumber, - dateOfLoss:this.mainStore.order.policy.dateOfLoss}); - - // Settle promises and get results - const promisePolicyLookupResultMap = [ - { - resultKey: "policyLookupResponse", - promise: policyLookupResponse, - } - ]; - const policyLookupResultMap = await settleAllPromises(promisePolicyLookupResultMap); - return policyLookupResultMap.policyLookupResponse; - }, - async getVehiclesfromPolicyLookup() - { - //call coverage policy lookup if isCoverageEnabled flag enabled - if(this.isCoverageEnabled){ - const policyLookupResponse = await this.getPolicyLookupResponse(); - if(policyLookupResponse!=null){ - var policy = policyLookupResponse.policies?.[0]; - if(policy!=null){ - //populate policy holder details from policy lookup - this.mainStore.order.customer.address.streetAddress = policy.insureds?.[0]?.address; - this.mainStore.order.customer.address.city=policy.insureds?.[0]?.city; - this.mainStore.order.customer.address.state=policy.insureds?.[0]?.state; - this.mainStore.order.customer.address.zipCode=policy.insureds?.[0]?.zipCode; - this.mainStore.order.customer.firstName = policy.insureds?.[0]?.firstName; - this.mainStore.order.customer.lastName = policy.insureds?.[0]?.lastName; - - this.customerQuestions = this.getPolicyHolderDetailsFromStore(); - //populate vehicles - this.vehiclesFound= policy.vehicles; - } - } - } - }, - + this.navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, + this.$route + ); }, - computed:{ - isCoverageEnabled(){ - return this.mainStore.issConfig.isCoverageEnabled; - }, - vehiclesCount(){ - return this.vehiclesFound.length; - } + + getPolicyHolderDetailsFromStore() { + return { + addressQuestions : + { + streetAddress: this.mainStore.order.customer.address.streetAddress, + streetAddress2: this.mainStore.order.customer.address.streetAddress2, + city: this.mainStore.order.customer.address.city, + state: this.mainStore.order.customer.address.state, + zipCode: this.mainStore.order.customer.address.zipCode, + }, + firstName : this.mainStore.order.customer.firstName, + lastName : this.mainStore.order.customer.lastName, + } + }, + }, + computed:{ + isCoverageEnabled(){ + return this.mainStore.issConfig.isCoverageEnabled; }, - components: { - siteHeader, - siteSubHeader, - textboxQuestion, - addressQuestions, - siteFooter, - Form, - }, - } - - +#address-questions-wrapper .alert.heading { + line-height: 24px; +} + +#address-questions-wrapper .form-test-error { + line-height: 24px; +} + diff --git a/src/layouts/welcome-page/welcome-page.spec.js b/src/layouts/welcome-page/welcome-page.spec.js index 195f129d..48bb9080 100644 --- a/src/layouts/welcome-page/welcome-page.spec.js +++ b/src/layouts/welcome-page/welcome-page.spec.js @@ -8,6 +8,9 @@ import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import baseMixin from "@/mixins/base-mixin.js"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import { applicationConfig } from "@/constants/application-config"; +import { useMainStore } from "@/store"; +import { navigationScenarios } from "@/router/router-constants/navigation-scenarios"; + // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), @@ -22,9 +25,7 @@ jest.mock("@/helpers/cms-content-helper", () => ({ describe("welcome-page.vue", () => { test("Should render welcomePage sub-components (policyNumber, policyZipCode, dateOfLoss, damageCause etc.)", async () => { // Arrange - - const { wrapper } = setupMocks({}); - + const { wrapper } = setupMocks({}); // Act const policyNumber = wrapper.findComponent({ ref: "policyNumber" }); @@ -36,7 +37,6 @@ describe("welcome-page.vue", () => { const phoneNumber = wrapper.findComponent({ ref: "phoneNumber" }); const email = wrapper.findComponent({ ref: "email" }); - // Assert expect(policyNumber.exists()).toBe(true); expect(dateOfLoss.exists()).toBe(true); @@ -49,26 +49,152 @@ describe("welcome-page.vue", () => { }); }); +describe("navigation", () => { + test("if policy and vehicles are found, navigate to policy-vehicle page", async () => { + // Arrange + const mockvehicles = [ + { + vin: "TEST_VIN", + }, + { + vin: "TEST_VIN2", + } + ]; + + const { wrapper } = setupMocks({ + policies: [{ + vehicles: [ + { + vin: "TEST_VIN" + }, + { + vin: "TEST_VIN2" + } + ] + }] + }); + + await wrapper.setData({ + isCoverageEnabled: true, + }); + + useMainStore().order.policy.policyNumber = "p_0001"; + useMainStore().order.policy.dateOfLoss = "2022-01-28"; + useMainStore().order.accountNumber = "00000"; + + // Act + await wrapper.vm.forwardButtonAction(); + + // Assert + expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith( + navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_WITH_VEHICLES, + undefined, + {}, + {}, + mockvehicles + ); + }); + test("if policy is found, but no vehicles, navigate to vehicle-selection page", async () => { + // Arrange + const { wrapper } = setupMocks({ + policies: [{}] + }); + + await wrapper.setData({ + isCoverageEnabled: true, + vehiclesCount: 0, + vehiclesFound: null, + }); + + useMainStore().order.policy.policyNumber = "p_0001"; + useMainStore().order.policy.dateOfLoss = "2022-01-28"; + useMainStore().order.accountNumber = "00000"; + + // Act + + await wrapper.vm.forwardButtonAction(); + + // Assert + expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith( + navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_NO_VEHICLES, + undefined + ); + }); + test("if policy is not found, navigate to policy-holder-details page", async () => { + // Arrange + const { wrapper } = setupMocks({ + policies: null + }); + + await wrapper.setData({ + isCoverageEnabled: true, + }); + + useMainStore().order.policy.policyNumber = "p_0001"; + useMainStore().order.policy.dateOfLoss = "2022-01-28"; + useMainStore().order.accountNumber = "00000"; + + // Act + await wrapper.vm.navigateForward(); + + // Assert + expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith( + navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, + undefined + ); + }); +}); + function setupMocks({ pageHeaderWidgetHeaderText = {}, pageFooterWidgetCmsContent = {}, mountOptionsMockData = {}, + policies = [], + getCoveragePolicyInfoResponse }) { + useMainStore().getCoveragePolicyInfo = jest.fn().mockImplementation(() => { + return Promise.resolve({ + data: getCoveragePolicyInfoResponse + ? getCoveragePolicyInfoResponse + : { + policies: [ + { + insureds: [ + { + customerId: "TEST_ID" + }, + ], + vehicles: [ + { + vin: "TEST_VIN" + }, + { + vin: "TEST_VIN2" + } + ] + }, + ], + }, + }) + }) + //Mock api responses const apiResponses = { cmsContent: { - SiteSubHeaderWidget: pageHeaderWidgetHeaderText, - VehicleBannerWidget: { - GenericVehicleImage: - `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`, + SiteSubHeaderWidget: pageHeaderWidgetHeaderText, + VehicleBannerWidget: { + GenericVehicleImage: + `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`, + }, + SiteHeaderWidget: { + LogoImage: + `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`, + }, + SiteFooterWidget: pageFooterWidgetCmsContent, }, - SiteHeaderWidget: { - LogoImage: - `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`, - }, - SiteFooterWidget: pageFooterWidgetCmsContent, - - }, + policyLookupResponse: { + policies: policies + } }; mountOptionsMockData = { @@ -76,8 +202,6 @@ function setupMocks({ router: { navigate: jest.fn(), }, - - }; const apiPromise = Promise.resolve(apiResponses); diff --git a/src/layouts/welcome-page/welcome-page.vue b/src/layouts/welcome-page/welcome-page.vue index 32689479..c36a9a0b 100644 --- a/src/layouts/welcome-page/welcome-page.vue +++ b/src/layouts/welcome-page/welcome-page.vue @@ -45,7 +45,7 @@ /> -
+
@@ -203,7 +203,8 @@ export default { mixins: [BaseFormMixin], data() { return { - welcomePageModel: this.getWelcomePageModelFromStore() + welcomePageModel: this.getWelcomePageModelFromStore(), + vehiclesFound: [], }; }, setup() { @@ -238,15 +239,79 @@ export default { { async forwardButtonAction() { this.mainStore.updatePolicyData(this.welcomePageModel); + + //call coverage policy lookup if isCoverageEnabled flag enabled + if (this.isCoverageEnabled) { + const policyLookupResponse = useMainStore().getCoveragePolicyInfo({ + accountNumber:this.mainStore.order.accountNumber.toString(), + policyNumber:this.mainStore.order.policy.policyNumber, + dateOfLoss:this.mainStore.order.policy.dateOfLoss + }); + + // Settle promises and get results + const promisePolicyLookupResultMap = [ + { + resultKey: "policyLookupResponse", + promise: policyLookupResponse, + } + ]; + + const policyLookupResultMap = await settleAllPromises(promisePolicyLookupResultMap); + const policyInfo = policyLookupResultMap.policyLookupResponse; + + // if policy lookup fails, navigate directly to policy-holder-details page + if (!policyInfo) { + this.navigateForward(); + } + + const policy = policyInfo.policies?.[0]; + if (policy) { + //populate policy holder details from policy lookup + this.mainStore.order.customer.address.streetAddress = policy.insureds?.[0]?.address; + this.mainStore.order.customer.address.city = policy.insureds?.[0]?.city; + this.mainStore.order.customer.address.state = policy.insureds?.[0]?.state; + this.mainStore.order.customer.address.zipCode = policy.insureds?.[0]?.zipCode; + this.mainStore.order.customer.firstName = policy.insureds?.[0]?.firstName; + this.mainStore.order.customer.lastName = policy.insureds?.[0]?.lastName; + + //populate vehicles + this.vehiclesFound = policy.vehicles; + } + return this.navigateForward(policy); + } return this.navigateForward(); }, - navigateForward() { - this.$router.navigate( - this.navigationScenarios.CLICKED_FORWARD, - this.$route - ); + navigateForward(policy) { + if (policy) { + if (this.vehiclesFound) { + // if policy lookup is successful and vehicles are found, navigate to policy-vehicles page + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_WITH_VEHICLES, + this.$route, + {}, + {}, + this.vehiclesFound + ); + } + else { + // if policy lookup is successful, but no vehicles are associated with the policy + // navigate to vehicle-selection page (manual entry) + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_NO_VEHICLES, + this.$route + ); + } + } + else { + // if policy lookup is unsuccessful, navigate to policy-holder-details page + this.$router.navigate( + this.navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, + this.$route + ); + } }, + getWelcomePageModelFromStore() { return { policyNumber: this.mainStore.order.policy.policyNumber, @@ -265,7 +330,7 @@ export default { computed:{ DamageCauseOptions() { const damageCauseAnswers = this.getCmsContent("DamageCauseQuestion", "Answers"); - const damageCauseAnswersObj ={}; + const damageCauseAnswersObj = {}; if(damageCauseAnswers) { for (let answer of Object.values(damageCauseAnswers)) { @@ -276,24 +341,22 @@ export default { } return damageCauseAnswersObj; }, - DamageGlassOnlyOptions() - { + DamageGlassOnlyOptions() { return this.getCmsContent("GlassOnlyQuestion", "Answers"); }, - DamageGlassOnlyQuestion() - { + DamageGlassOnlyQuestion() { return this.getCmsContent("GlassOnlyQuestion", "QuestionText"); }, - displayDamageCityQuestion(){ + displayDamageCityQuestion() { return !!this.getCmsContent("DamageCityQuestion","QuestionText"); }, - displayDamageStateQuestion(){ + displayDamageStateQuestion() { return !!this.getCmsContent("DamageStateQuestion","QuestionText"); }, - displayGlassOnlyQuestion(){ + displayGlassOnlyQuestion() { return !!this.getCmsContent("GlassOnlyQuestion","QuestionText"); }, - displayPolicyZip(){ + displayPolicyZip() { if (this.mainStore.issConfig.isAuthenticated && !!this.mainStore.issConfig.disabledFields.policyZipCode) { return false; @@ -305,10 +368,12 @@ export default { getStates() { return states; }, - isPolicyHolderEnabled() - { + isPolicyHolderEnabled() { return !!this.mainStore.issConfig.disabledFields.policyNumber; - } + }, + isCoverageEnabled() { + return this.mainStore.issConfig.isCoverageEnabled; + }, }, components: { siteHeader, diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index b2fb1fa4..7c9e90da 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -6,6 +6,11 @@ const navigationScenarios = { // Entry MOVE_FORWARD_ENTRY_PAGE: "MOVE_FORWARD_ENTRY_PAGE", + // Welcome + CLICKED_FORWARD_POLICY_UNVERIFIED: "CLICKED_FORWARD_POLICY_UNVERIFIED", + CLICKED_FORWARD_POLICY_VERIFIED_NO_VEHICLES: "CLICKED_FORWARD_POLICY_VERIFIED_NO_VEHICLES", + CLICKED_FORWARD_POLICY_VERIFIED_WITH_VEHICLES: "CLICKED_FORWARD_POLICY_VERIFIED_WITH_VEHICLES", + // YMMS SELECTED_YEAR: "SELECTED_YEAR", SELECTED_MAKE: "SELECTED_MAKE", @@ -51,6 +56,7 @@ const navigationScenarios = { CLICKED_FORWARD_WITH_SAFELITE: "CLICKED_FORWARD_WITH_SAFELITE", CLICKED_FORWARD_WITH_TPA_ENABLED: "CLICKED_FORWARD_WITH_TPA_ENABLED", CLICKED_FORWARD_WITH_TPA_DISABLED: "CLICKED_FORWARD_WITH_TPA_DISABLED", + CLICKED_FORWARD_WITH_POLICY_AND_VEHICLES: "CLICKED_FORWARD_WITH_POLICY_AND_VEHICLES", //Bailout CLICKED_FORWARD_WITH_BAILOUT: "CLICKED_FORWARD_WITH_BAILOUT", diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index 082c9e53..b2aba7a7 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -394,7 +394,19 @@ const routingTable = function(store) { { scenario: navigationScenarios.CLICKED_FORWARD, destinationIssPageValue: issPageValues.POLICY_HOLDER_DETAILS - } + }, + { + scenario: navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, + destinationIssPageValue: issPageValues.POLICY_HOLDER_DETAILS + }, + { + scenario: navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_NO_VEHICLES, + destinationIssPageValue: issPageValues.VEHICLE_SELECTION + }, + { + scenario: navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED_WITH_VEHICLES, + destinationIssPageValue: issPageValues.POLICY_VEHICLES + } ] }, { @@ -406,12 +418,12 @@ const routingTable = function(store) { }, { scenario: navigationScenarios.CLICKED_FORWARD_POLICY_UNVERIFIED, - destinationIssPageValue: issPageValues.VEHICLE_YEAR + destinationIssPageValue: issPageValues.VEHICLE_SELECTION }, { scenario: navigationScenarios.CLICKED_FORWARD_POLICY_VERIFIED, destinationIssPageValue: issPageValues.POLICY_VEHICLES - } + }, ] }, {