jason/DigitalConsumer.ISS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #313 from Safelite/feature/digital/SSR-448

Browse source 
Feature/digital/ssr 448
This commit is contained in:
katiekroell 2023-05-16 11:21:48 -04:00 committed by GitHub
commit 4da1d67215
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 329 additions and 162 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

206
src/layouts/policy-holder-details/policy-holder-details.vue
View file

@ -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,
},
}
</script>
<style lang="scss">
#sub-header p {
font-size: 16px;
line-height: 26px;
color: #4D5151;
}
vehiclesCount(){
return this.vehiclesFound.length;
}
},
components: {
siteHeader,
siteSubHeader,
textboxQuestion,
addressQuestions,
siteFooter,
Form,
},
}
</script>
#address-questions-wrapper {
margin-top: 24px;
}
<style lang="scss">
#sub-header p {
font-size: 16px;
line-height: 26px;
color: #4D5151;
}
#address-questions-wrapper .alert.heading {
line-height: 24px;
}
#address-questions-wrapper {
margin-top: 24px;
}
#address-questions-wrapper .form-test-error {
line-height: 24px;
}
</style>
#address-questions-wrapper .alert.heading {
line-height: 24px;
}
#address-questions-wrapper .form-test-error {
line-height: 24px;
}
</style>

158
src/layouts/welcome-page/welcome-page.spec.js
View file

@ -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);

103
src/layouts/welcome-page/welcome-page.vue
View file

@ -45,7 +45,7 @@
/>
</div>
</div>
<div class="row px-5">
<div class="row px-4">
<div class="col px-0">
<textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="small" class="mt-2" />
</div>
@ -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,

6
src/router/router-constants/navigation-scenarios.js
View file

@ -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",

18
src/router/router-constants/routing-table.js
View file

@ -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
}
},
]
},
{