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

Merge pull request #529 from Safelite/feature/digital/SSR-586

Browse source 
SSR-586 - Save Bailout & Callback
This commit is contained in:
Josh Dassinger 2024-01-15 10:15:55 -06:00 committed by GitHub
commit 110ccdd54f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 410 additions and 239 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/constants/bailoutCode.js Normal file
View file

@ -0,0 +1,12 @@
const bailoutCode = Object.freeze({
Unknown: 0,
SaveSessionError: 1,
VehicleNotFound: 2,
VehicleLookupError: 3,
CoverageStatementInvalidState: 4,
DoNotSeeMyShop: 5,
PricingResponseError: 6,
TPANotEnabled: 7
});
export default bailoutCode;

50
src/constants/bailoutMessage.js Normal file
View file

@ -0,0 +1,50 @@
import bailoutCode from '@/constants/bailoutCode';
function getItemData(data) {
if (data === undefined || data == null) {
return 'null';
}
if (typeof data === 'string') {
return data;
}
return JSON.stringify(data);
}
const bailoutMessage = Object.freeze({
unknown: (error) => ({
code: bailoutCode.Unknown,
message: `An unknown bailout occurred: ${getItemData(error)}`
}),
saveSessionError: (error) => ({
code: bailoutCode.SaveSessionError,
message: `An error occurred during save session: ${getItemData(error)}`
}),
vehicleNotFound: (vin) => ({
code: bailoutCode.VehicleNotFound,
message: `Failed to find vehicle in system with vin: ${vin}`
}),
vehicleLookupError: (vin, error) => ({
code: bailoutCode.VehicleLookupError,
message: `An error occurred looking up Vin: ${vin}. Error: ${getItemData(error)}`
}),
coverageStatementInvalidState: () => ({
code: bailoutCode.CoverageStatementInvalidState,
message: 'Coverage Statement has entered an invalid state'
}),
doNotSeeMyShop: () => ({
code: bailoutCode.DoNotSeeMyShop,
message: 'User does not see their shop.'
}),
pricingResponseError: (lineItems, error) => ({
code: bailoutCode.PricingResponseError,
message: `An error occurred in getPriceOrderItems. Line Items: ${getItemData(lineItems)} Error: ${getItemData(error)}`
}),
TPANotEnabled: () => ({
code: bailoutCode.TPANotEnabled,
message: 'User selected TPA when TPA is not enabled for this client'
})
});
export default bailoutMessage;

22
src/helpers/bailout-helper.js Normal file
View file

@ -0,0 +1,22 @@
import { useMainStore } from '@/store';
import BailoutCode from '@/constants/bailoutCode';
import issPageValues from "@/router/router-constants/issPage-values";
function canBailoutNavigateBack() {
const code = useMainStore().pageData(issPageValues.BAILOUT_PAGE)?.bailoutCode;
if (code == null) {
return true;
}
switch (code) {
case BailoutCode.VehicleNotFound:
case BailoutCode.DoNotSeeMyShop:
case BailoutCode.TPANotEnabled:
return true;
default:
return false;
}
}
export default canBailoutNavigateBack;

4
src/layouts/bailout-page/__snapshots__/bailout-page.spec.js.snap
View file

@ -2,13 +2,15 @@
exports[`Bailout page returns the initial data 1`] = `
Object {
"bailout": Object {
"bailoutCode": 0,
},
"bailoutPageModel": Object {
"email": "alexander.hamilton45@gmail.com",
"firstName": "Alexander",
"lastName": "Hamilton",
"phoneNumber": "6145550909",
},
"notSeeingPreferredShop": false,
"rules": Object {
"email": "email-required|email-address-format",
"firstName": "first-name-required",

315
src/layouts/bailout-page/bailout-page.spec.js
View file

@ -9,6 +9,7 @@ import routerParams from '@/router/router-constants/router-params';
import { useMainStore } from '@/store';
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import settleAllPromises from '@/helpers/layout-helper.js';
import bailoutCode from '@/constants/bailoutCode';
// Mock fetchCmsContentForPage
jest.mock('@/helpers/cms-content-helper', () => ({
@ -28,7 +29,16 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu
const testingPinia = createTestingPinia({
initialState: {
main: mainInitialState
main: {
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.Unknown
}
}
},
...mainInitialState
}
}
});
useMainStore(testingPinia);
@ -146,30 +156,39 @@ describe('Bailout page', () => {
});
describe('computed', () => {
describe('subHeaderCmsWidgetName', () => {
test.each([true, false])(
'returns noTpa widget name when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNoTPAWidget';
// Act
const name = wrapper.vm.subHeaderCmsWidgetName;
// Assert
expect(name).toBe(expected);
}
);
test('returns notSeeingPreferredShop widget name when tpa enabled and notSeeingPreferredShop true', () => {
test('returns noTpa widget name when bailout code is BailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.TPANotEnabled
}
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNoTPAWidget';
// Act
const name = wrapper.vm.subHeaderCmsWidgetName;
// Assert
expect(name).toBe(expected);
});
test('returns notSeeingPreferredShop widget name when bailout code is bailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.DoNotSeeMyShop
}
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNotSeeingPreferredShop';
@ -179,12 +198,18 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test('returns default widget name when tpa enabled and notSeeingPreferredShop false', () => {
test('returns default widget name when bailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.Unknown
}
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SiteSubHeaderWidget';
@ -196,12 +221,18 @@ describe('Bailout page', () => {
});
});
describe('subHeaderContentProperty', () => {
test('returns "SubHeaderText" when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns "SubHeaderText" when bailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.Unknown
}
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SubHeaderText';
@ -211,30 +242,39 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test.each([true, false])(
'returns "HeaderText" when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
// Act
const name = wrapper.vm.subHeaderContentProperty;
// Assert
expect(name).toBe(expected);
}
);
test('returns "HeaderText" when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns "HeaderText" when bailoutCode is bailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.TPANotEnabled
}
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
// Act
const name = wrapper.vm.subHeaderContentProperty;
// Assert
expect(name).toBe(expected);
});
test('returns "HeaderText" when bailoutCode is bailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.DoNotSeeMyShop
}
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
@ -246,12 +286,18 @@ describe('Bailout page', () => {
});
});
describe('subContentProperty', () => {
test('returns "SecondaryText" when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns "SecondaryText" when bailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.Unknown
}
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SecondaryText';
@ -261,30 +307,39 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test.each([true, false])(
'returns "BodyText" when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
// Act
const name = wrapper.vm.subContentProperty;
// Assert
expect(name).toBe(expected);
}
);
test('returns "BodyText" when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns "BodyText" when bailoutCode is bailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.TPANotEnabled
}
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
// Act
const name = wrapper.vm.subContentProperty;
// Assert
expect(name).toBe(expected);
});
test('returns "BodyText" when bailoutCode is bailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.DoNotSeeMyShop
}
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
@ -296,12 +351,18 @@ describe('Bailout page', () => {
});
});
describe('stripRteStyle', () => {
test('returns false when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns false when bailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.Unknown
}
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = false;
@ -311,12 +372,18 @@ describe('Bailout page', () => {
// Assert
expect(flag).toBe(expected);
});
test('returns true when tpa flow not enabled and not seeing preferred shop flag false', () => {
test('returns true when bailoutCode is bailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.TPANotEnabled
}
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = true;
@ -326,12 +393,18 @@ describe('Bailout page', () => {
// Assert
expect(flag).toBe(expected);
});
test('returns true when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns true when when bailoutCode is bailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
applicationUser: {
pageData: {
'bailout-page': {
bailoutCode: bailoutCode.DoNotSeeMyShop
}
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = true;
@ -342,24 +415,6 @@ describe('Bailout page', () => {
expect(flag).toBe(expected);
});
});
describe('isTpaEnabled', () => {
test.each([true, false])(
'matches enableTPAFlow in store',
(enableTPAFlow) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow }
};
const { wrapper } = getMountedComponent(mainInitialState);
// Act
const flag = wrapper.vm.isTpaEnabled;
// Assert
expect(flag).toBe(enableTPAFlow);
}
);
});
});
describe('method', () => {
describe('backButtonAction', () => {
@ -390,8 +445,7 @@ describe('Bailout page', () => {
wrapper.vm.navigationScenarios.CLICKED_FORWARD,
wrapper.vm.$route,
{},
{},
wrapper.vm.bailoutPageModel
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
});
});
@ -426,62 +480,5 @@ describe('Bailout page', () => {
});
});
});
describe('setNotSeeingPreferShop', () => {
test.each([true, false])(
'updates notSeeingPreferredShop value',
(flag) => {
// Arrange
const { wrapper } = getMountedComponent();
// Act
wrapper.vm.setNotSeeingPreferShop(flag);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(flag);
}
);
test('sets notSeeingPreferredShop to true when null is passed', () => {
// Arrange
const { wrapper } = getMountedComponent();
// Act
wrapper.vm.setNotSeeingPreferShop(null);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(false);
});
});
});
describe('before entering the route', () => {
test.each([true, false])(
'sets notSeeingPreferredShop flag based value returned by store method pageData',
async (notSeeingPreferredShop) => {
// Arrange
const page = 'bailout-page';
const initialStoreState = {
applicationUser: {
pageData: {
[page]: {
[routerParams.NOT_SEEING_PREFERRED_SHOP]: notSeeingPreferredShop,
turtle: 5
}
}
}
};
const { wrapper } = getMountedComponent(initialStoreState);
// Act
await bailoutPage.beforeRouteEnter.call(
wrapper.vm,
{ query: { issPage: page } },
undefined,
(c) => c(wrapper.vm)
);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(notSeeingPreferredShop);
}
);
});
});

72
src/layouts/bailout-page/bailout-page.vue
View file

@ -55,6 +55,7 @@
class="footer-content-container"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
:isBackButtonHidden="!canNavigateBack"
@backClicked="backButtonAction"
@ForwardClicked="forwardButtonAction" />
</div>
@ -76,6 +77,9 @@ import settleAllPromises from '@/helpers/layout-helper';
import { useMainStore } from '@/store';
import widgetFields from '@/constants/cms-widget-fields.js';
import routerParams from '@/router/router-constants/router-params';
import canNavigateBackFromBailout from '@/helpers/bailout-helper';
import BailoutCode from '@/constants/bailoutCode';
import issPageValues from '@/router/router-constants/issPage-values';
export default {
name: 'bailout-page',
@ -101,18 +105,18 @@ export default {
// use resultMap to populate layout content.
const resultMap = await settleAllPromises(promiseResultMap);
const pageData = useMainStore().pageData(to.query.issPage);
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
if (pageData && pageData[routerParams.NOT_SEEING_PREFERRED_SHOP]) {
vm.setNotSeeingPreferShop(pageData[routerParams.NOT_SEEING_PREFERRED_SHOP]);
}
});
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
return {
notSeeingPreferredShop: false,
bailoutPageModel: this.getBailoutPageModelFromStore(),
bailout: this.mainStore.pageData(issPageValues.BAILOUT_PAGE),
widget: {
defaultSiteHeader: 'SiteSubHeaderWidget',
noTpa: 'ContentGroupNoTPAWidget',
@ -128,43 +132,64 @@ export default {
},
computed: {
subHeaderCmsWidgetName() {
if (!this.isTpaEnabled) {
return this.widget.noTpa;
switch (this.bailout.bailoutCode) {
case BailoutCode.TPANotEnabled:
return this.widget.noTpa;
case BailoutCode.DoNotSeeMyShop:
return this.widget.notSeeingPreferredShop;
default:
return this.widget.defaultSiteHeader;
}
if (this.notSeeingPreferredShop) {
return this.widget.notSeeingPreferredShop;
}
return this.widget.defaultSiteHeader;
},
subHeaderContentProperty() {
return !this.isTpaEnabled || this.notSeeingPreferredShop
? widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT
: widgetFields.SUB_HEADER_WIDGET.SUB_HEADER_TEXT;
switch (this.bailout.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT;
default:
return widgetFields.SUB_HEADER_WIDGET.SUB_HEADER_TEXT;
}
},
subContentProperty() {
return !this.isTpaEnabled || this.notSeeingPreferredShop
? widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT
: widgetFields.SUB_HEADER_WIDGET.SECONDARY_TEXT;
switch (this.bailout.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT;
default:
return widgetFields.SUB_HEADER_WIDGET.SECONDARY_TEXT;
}
},
stripRteStyle() {
return !this.isTpaEnabled || this.notSeeingPreferredShop;
switch (this.bailout.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return true;
default:
return false;
}
},
isTpaEnabled() {
return useMainStore().issConfig.enableTPAFlow;
canNavigateBack() {
return canNavigateBackFromBailout();
}
},
methods: {
backButtonAction() {
// route to move backwards
this.mainStore.resetBailout();
this.$router.navigate(this.navigationScenarios.CLICKED_BACK_PREVIOUS, this.$route);
},
forwardButtonAction() {
this.mainStore.setBailoutContactInfo(this.bailoutPageModel);
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD,
this.$route,
{},
{},
this.bailoutPageModel
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
},
getBailoutPageModelFromStore() {
@ -174,9 +199,6 @@ export default {
phoneNumber: useMainStore().order.customer.phoneNumber,
email: useMainStore().order.customer.emailAddress
};
},
setNotSeeingPreferShop(value) {
this.notSeeingPreferredShop = value ?? false;
}
}
};

38
src/layouts/coverage-statement/coverage-statement.vue
View file

@ -128,6 +128,8 @@ import baseFormMixin from '@/mixins/base-form-mixin.js';
import navigationScenarios from '@/router/router-constants/navigation-scenarios.js';
import routerParams from '@/router/router-constants/router-params';
import issPageValues from '@/router/router-constants/issPage-values';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from '@/constants/bailoutMessage';
export default {
name: 'coverage-statement',
@ -170,35 +172,29 @@ export default {
...(clonedGlassParts ?? [])
];
let hasBailedOut = false;
let pricingResults = [];
if (useMainStore().order.policy.policyLookupSuccessful && useMainStore().order.vehicle.policyVehicleId >= 0) {
await useMainStore().getFinalDeductible();
pricingResults = await useMainStore().getPriceOrderItems(availableLineItems)
.catch((err) => {
const errorPageData = {
errorData: err.data,
functionLocation: 'beforeRouteEnter',
functionName: 'getPriceOrderItems',
functionParameters: {
availableLineItems
},
routeFrom: from,
routeTo: to
};
useMainStore().updatePageData({ page: issPageValues.BAILOUT_PAGE, data: errorPageData });
useMainStore().setBailout(to, bailoutMessage.pricingResponseError(availableLineItems.map((li) => li.partNumber), { code: err.code, message: err.message, data: err.data }));
hasBailedOut = true;
next(`/?issPage=${issPageValues.BAILOUT_PAGE}`);
});
}
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.setSupportingItems(resultMap.supportingItems);
// eslint-disable-next-line no-param-reassign
vm.availableLineItems = pricingResults;
vm.$refs.loadingModal.showModal();
vm.initializeComponent(availableLineItems);
});
if (!hasBailedOut) {
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.setSupportingItems(resultMap.supportingItems);
// eslint-disable-next-line no-param-reassign
vm.availableLineItems = pricingResults;
vm.$refs.loadingModal.showModal();
vm.initializeComponent(availableLineItems);
});
}
},
setup() {
const mainStore = useMainStore();
@ -394,6 +390,7 @@ export default {
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
} else {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.TPANotEnabled());
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED,
this.$route,
@ -402,6 +399,7 @@ export default {
);
}
} else {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.coverageStatementInvalidState());
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_INVALID_STATE,
this.$route,

26
src/layouts/policy-vehicles/policy-vehicles.spec.js
View file

@ -10,6 +10,9 @@ import { getRandomString, getRandomInt } from '@/helpers/data-generation';
import endorsementOptions from '@/constants/endorsement-options';
import { createTestingPinia } from '@pinia/testing';
import vehicleSelectionOptions from '@/constants/vehicle-selection-options';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from '@/constants/bailoutMessage';
import issPageValues from '@/router/router-constants/issPage-values';
// Mock fetchCmsContentForPage
jest.mock('@/helpers/cms-content-helper', () => ({
@ -73,6 +76,10 @@ function setupMocks() {
return { wrapper };
}
beforeEach(() => {
useMainStore().applicationUser.pageData[issPageValues.BAILOUT_PAGE] = null;
});
describe('policy-vehicles.vue', () => {
test('Should navigate to CLICKED_BACK if backButtonAction is run', async () => {
// Arrange
@ -100,7 +107,6 @@ describe('policy-vehicles.vue', () => {
policyVehicles: [
{ vin }
],
bailout: false,
policyVinFound: true
});
@ -241,19 +247,30 @@ describe('policy-vehicles.vue', () => {
async () => {
// Arrange
const { wrapper } = setupMocks({});
wrapper.vm.lookupVehicleByVin = jest.fn().mockReturnValue({ error: true, status: 500 });
const lookupReturnValue = { error: true, status: 500, data: 'error' };
wrapper.vm.lookupVehicleByVin = jest.fn().mockReturnValue(lookupReturnValue);
const vin = getRandomString(17, 17);
await wrapper.setData({
selectedVehicleVin: vin,
bailout: false
policyVehicles: [
{
vin
}
]
});
// Act
wrapper.vm.mainStore.applicationUser.pageData[issPageValues.BAILOUT_PAGE] = {
'bailout-page': {
bailoutCode: bailoutCode.VehicleLookupError
}
};
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.vm.bailout).toBeTruthy();
// eslint-disable-next-line max-len
expect(wrapper.vm.mainStore.setBailout).toHaveBeenCalledWith(wrapper.vm.$router.currentRoute, bailoutMessage.vehicleLookupError(vin, lookupReturnValue.data));
expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith(
navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
undefined,
@ -274,7 +291,6 @@ describe('policy-vehicles.vue', () => {
const vin = getRandomString(17, 17);
await wrapper.setData({
selectedVehicleVin: vin,
bailout: false,
policyVinFound: true,
policyVehicles: [{
vin,

14
src/layouts/policy-vehicles/policy-vehicles.vue
View file

@ -53,6 +53,8 @@ import vehicleSelectionOptions from '@/constants/vehicle-selection-options.js';
import endorsementOptions from '@/constants/endorsement-options.js';
import globalRules from '@/constants/global-rules.js';
import { useMainStore } from '@/store/index.js';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from '@/constants/bailoutMessage';
export default {
name: 'policy-vehicles',
@ -71,6 +73,10 @@ export default {
vm.setCmsContent(cmsContentPromise);
});
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
const policyVehicles = useMainStore().order.policy.vehicles;
return {
@ -78,7 +84,6 @@ export default {
selectedVehicleVin: '',
displayGeneric: true,
policyVinFound: true,
bailout: false,
rules: {
optionRequired: globalRules.OPTION_REQUIRED
}
@ -197,7 +202,7 @@ export default {
return this.navigateForward();
}
this.bailout = true;
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.vehicleLookupError(vehicle.vin, vehicleLookupResponse.data));
return this.navigateForward();
}
@ -215,7 +220,7 @@ export default {
return this.navigateForward();
},
navigateForward() {
if (this.bailout) {
if (this.mainStore.isBailout) {
this.$router
.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
@ -260,7 +265,8 @@ export default {
} catch (responseError) {
return {
error: true,
status: responseError.status
status: responseError.status,
data: responseError.data
};
}
}

3
src/layouts/provider-preference/provider-preference.vue
View file

@ -68,6 +68,8 @@ import steeringModal from '@/layouts/provider-preference/steering-modal/steering
import shopPreferenceModal from '@/layouts/provider-preference/shop-preference-modal/shop-preference-modal.vue';
import tpaRecalModal from '@/layouts/provider-preference/tpa-recal-modal/tpa-recal-modal.vue';
import globalRules from '@/constants/global-rules';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from "@/constants/bailoutMessage";
const options = { SAFELITE: 'SafeliteOption', TPA: 'TPAOption' };
@ -194,6 +196,7 @@ export default {
}
scenario = this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED;
} else {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.TPANotEnabled());
scenario = this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED;
}
break;

30
src/layouts/service-packages/service-packages.vue
View file

@ -66,6 +66,8 @@ import allGlassPartsAndItemsHavePrices from '@/layouts/service-packages/service-
import globalRules from '@/constants/global-rules';
import servicePackageQuestion from '@/layouts/service-packages/service-package-question/service-package-question.vue';
import issPageValues from '@/router/router-constants/issPage-values';
import bailoutCode from "@/constants/bailoutCode";
import bailoutMessage from "@/constants/bailoutMessage";
const store = useMainStore();
@ -119,29 +121,23 @@ export default {
...clonedGlassParts
];
let hasBailedOut = false;
const pricingResults = await store.getPriceOrderItems(availableLineItems)
.catch((err) => {
const errorPageData = {
errorData: err.data,
functionLocation: 'beforeRouteEnter',
functionName: 'getPriceOrderItems',
functionParameters: {
availableLineItems
},
routeFrom: from,
routeTo: to
};
useMainStore().updatePageData({ page: issPageValues.BAILOUT_PAGE, data: errorPageData });
useMainStore().setBailout(to, bailoutMessage.pricingResponseError(availableLineItems.map((li) => li.partNumber), { code: err.code, message: err.message, data: err.data }));
hasBailedOut = true;
next(`/?issPage=${issPageValues.BAILOUT_PAGE}`);
});
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.pricedGlassParts = clonedGlassParts;
vm.supportingItems = resultMap.supportingItems;
vm.availableLineItems = pricingResults;
});
if (!hasBailedOut) {
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.pricedGlassParts = clonedGlassParts;
vm.supportingItems = resultMap.supportingItems;
vm.availableLineItems = pricingResults;
});
}
},
data() {
return {

8
src/layouts/tpa-search/tpa-search.vue
View file

@ -133,6 +133,8 @@ import widgetFields from '@/constants/cms-widget-fields.js';
import { shallowRef } from 'vue';
import routerParams from '@/router/router-constants/router-params';
import { toTitleCase, toDisplayPhoneNumber } from '@/helpers/text-helper.js';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from "@/constants/bailoutMessage";
const radiusFilterPairs = [
{ radius: 15, filter: '15 miles' },
@ -343,12 +345,10 @@ export default {
return getTpaProvidersResult?.data?.shopProviders ?? [];
},
doNotSeeMyShopLinkClick() {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.doNotSeeMyShop());
this.$router.navigate(
this.navigationScenarios.CLICKED_DO_NOT_SEE_MY_SHOP_LINK,
this.$route,
{},
{},
{ [routerParams.NOT_SEEING_PREFERRED_SHOP]: true }
this.$route
);
},
async searchClick() {

6
src/layouts/vin-lookup/vin-lookup.vue
View file

@ -63,6 +63,8 @@ import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import vinLocationInformation from '@/layouts/vin-lookup/vin-location-information/vin-location-information.vue';
import vinLookupAlerts from '@/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue';
import vinQuestion from '@/layouts/vin-lookup/vin-question/vin-question.vue';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from "@/constants/bailoutMessage";
export default {
name: 'vin-lookup',
@ -177,14 +179,18 @@ export default {
if (vehicleLookupResponse.error) {
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_FOUND;
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.vehicleNotFound(this.vin));
this.resetVehicleFromLookup();
this.$refs.siteFooter.removeLoader();
// Temp solution to turn on 'disabled' style on the Continue button
// because the form itself actually passes its client-side validation.
// SSR-189 Scenario #4.
this.$refs.siteFooter.enableForwardAction();
return;
}
this.mainStore.resetBailout();
// Add vin bcs the response from the service doesn't contain vin
this.vehicleFromLookup = Object.assign(vehicleLookupResponse.data, { vin: this.vin });
}

16
src/router/index.js
View file

@ -16,7 +16,11 @@ import showIssLoadingModal from '@/helpers/loading-modal-helper';
import analyticsMixin from '@/mixins/analytics-mixin';
import { saveSession } from '@/helpers/order-helper.js';
import routerParams from '@/router/router-constants/router-params';
import bailoutCode from '@/constants/bailoutCode';
import IssPageValues from '@/router/router-constants/issPage-values';
import navigationScenarios from './router-constants/navigation-scenarios';
import canBailoutNavigateBack from "@/helpers/bailout-helper";
import bailoutMessage from "@/constants/bailoutMessage";
const routes = [
{
@ -119,13 +123,20 @@ const router = createRouter({
}
});
router.beforeEach(async (to, from, next) => {
router.beforeEach(async (to, from) => {
const fromQueryPage = from.query?.issPage;
if (fromQueryPage === undefined) {
showIssLoadingModal(true);
}
next();
const store = useMainStore();
// Prevent navigating backwards if we enter a bailout that we are not allowed to go back on
if (store.isBailout && from.name === IssPageValues.BAILOUT_PAGE && to.name !== 'root' && to.name !== IssPageValues.CONTACT_CONFIRMATION
&& !canBailoutNavigateBack()) {
return false;
}
return true;
});
router.afterEach(async (to, from) => {
@ -143,6 +154,7 @@ router.afterEach(async (to, from) => {
const saveSessionSynchronous = !!from.params[routerParams.SAVE_SESSION_SYNCHRONOUS];
await saveSession({ shouldAwaitSaveSessionQueue: saveSessionSynchronous }).catch((error) => {
if (from.name === issPageValues.WELCOME_PAGE) {
store.setBailout(router, bailoutMessage.saveSessionError(error.data));
router.navigate(
navigationScenarios.SAVE_SESSION_FAILED,
{ query: { issPage: issPageValues.WELCOME_PAGE } }

3
src/router/router-constants/router-params.js
View file

@ -1,7 +1,6 @@
const routerParams = Object.freeze({
DISPLAY_VEHICLE_CHANGE_ALERT: 'displayVehicleChangeAlert',
SAVE_SESSION_SYNCHRONOUS: 'saveSessionSynchronous',
NOT_SEEING_PREFERRED_SHOP: 'notSeeingPreferredShop'
SAVE_SESSION_SYNCHRONOUS: 'saveSessionSynchronous'
});
export default routerParams;

30
src/store/index.js
View file

@ -224,6 +224,7 @@ export const useMainStore = defineStore({
|| state.order.serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP,
isDropOffAppointment: (state) => state.order.serviceLocation.appointmentType === AppointmentTypeStrings.DROP_OFF,
isClaimRegistrationRequired: (state) => state.issConfig.isClaimRegistrationRequired,
isBailout: (state) => state.applicationUser.pageData[issPageValues.BAILOUT_PAGE] != null,
eventBusItem: (state) => (eventCategory, eventSubCategory) => {
const matchedEvent = state.applicationUser.eventBus.find(({ category, subCategory }) => category === eventCategory && subCategory === eventSubCategory);
return matchedEvent?.eventValue;
@ -1411,6 +1412,13 @@ export const useMainStore = defineStore({
this.order.serviceLocation.isVehicleProtected = null;
},
resetBailout() {
this.updatePageData({
page: issPageValues.BAILOUT_PAGE,
data: null
});
},
updateSupportingItems(partsData) {
this.order.lineItems.supportingItems = partsData;
},
@ -2054,6 +2062,27 @@ export const useMainStore = defineStore({
this.updateRegistration(registrationInfo);
},
setBailout(currentRoute, bailoutData) {
this.updatePageData({
page: issPageValues.BAILOUT_PAGE,
data: {
url: window.location.href,
page: currentRoute.value?.name ?? currentRoute.name,
bailoutCode: bailoutData.code,
errorMessage: bailoutData.message,
submit: false
}
});
},
setBailoutContactInfo(contact) {
this.order.customer.firstName = contact.firstName;
this.order.customer.lastName = contact.lastName;
this.order.customer.phoneNumber = contact.phoneNumber;
this.order.customer.emailAddress = contact.email;
this.pageData(issPageValues.BAILOUT_PAGE).submit = true;
},
resetRegistrationAndDependencies() {
this.resetRegistrationState();
this.resetGlassPartsState();
@ -2094,6 +2123,7 @@ export const useMainStore = defineStore({
this.order.customer.address.streetAddress2 = null;
this.resetVehicleState();
this.resetDamageState();
this.resetBailout();
}
},