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

CSR-762 Fix merge conflicts

Browse source
This commit is contained in:
Katie 2022-10-07 15:50:52 -04:00
commit 88944befe0
22 changed files with 1064 additions and 495 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/common-components/date-picker/date-picker-spec.js Normal file
View file

@ -0,0 +1 @@
test.todo("some test to be written in the future");

459
src/common-components/date-picker/date-picker.vue Normal file
View file

@ -0,0 +1,459 @@
<template>
<div id="app">
<fieldset>
<legend class="d-flex justify-content-center">Date Picker</legend>
<div class="grid-container">
<!-- Do the days of the weeek need to be read? -->
<div class="grid-item"><span class="sr-only">Sunday</span>S</div>
<div class="grid-item"><span class="sr-only">Monday</span>M</div>
<div class="grid-item"><span class="sr-only">Tuesday</span>T</div>
<div class="grid-item"><span class="sr-only">Wednesday</span>W</div>
<div class="grid-item"><span class="sr-only">Thursday</span>T</div>
<div class="grid-item"><span class="sr-only">Friday</span>F</div>
<div class="grid-item"><span class="sr-only">Saturday</span>S</div>
<div class="grid-item radio-wrapper past-day">
<input type="radio" name="day-of-month" id="thirtypast" />
<label for="thirtypast"><span>30</span></label>
</div>
<div class="grid-item radio-wrapper past-day">
<input type="radio" name="day-of-month" id="thirtyonepast" />
<label for="thirtyonepast"><span>31</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day first-of-month">
<div v-if="isFirstDayOfMonth" class="current-month">OCT</div>
<input type="radio" name="day-of-month" id="one" />
<label for="one"><span class="sr-only">{{dayOfWeek}} {{pastMonth}} {{dayOfMonth}}</span><span>1</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="two" />
<label for="two"><span>2</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="three" />
<label for="three"><span>3</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day" :class="[isCurrentDay ? 'current-day' : '']">
<div v-if="isCurrentDayDot" class="current-day-dot"></div>
<input type="radio" name="day-of-month" id="four" />
<label for="four"><span>4</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="five" />
<label for="five"><span>5</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="six" />
<label for="six"><span>6</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="seven" />
<label for="seven"><span>7</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="eight" />
<label for="eight"><span>8</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="nine" />
<label for="nine"><span>9</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="ten" />
<label for="ten"><span>10</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="eleven" />
<label for="eleven"><span>11</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twelve" />
<label for="twelve"><span>12</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="thirteen" />
<label for="thirteen"><span>13</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="fourteen" />
<label for="fourteen"><span>17</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="fifteen" />
<label for="fifteen"><span>15</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="sixteen" />
<label for="sixteen"><span>16</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="seventeen" />
<label for="seventeen"><span>17</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="eighteen" />
<label for="eighteen"><span>18</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="nineteen" />
<label for="nineteen"><span>19</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twenty" />
<label for="twenty"><span>20</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentyone" />
<label for="twentyone"><span>21</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentytwo" />
<label for="twentytwo"><span>22</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentythree" />
<label for="twentythree"><span>23</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentyfour" />
<label for="twentyfour"><span>24</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentyfive" />
<label for="twentyfive"><span>25</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentysix" />
<label for="twentysix"><span>26</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentyseven" />
<label for="twentyseven"><span>27</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentyeight" />
<label for="twentyeight"><span>28</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="twentynine" />
<label for="twentynine"><span>29</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="thirty" />
<label for="thirty"><span>30</span></label>
</div>
<div class="grid-item radio-wrapper highlighted-day">
<input type="radio" name="day-of-month" id="thirtyone" />
<label for="thirtyone"><span>31</span></label>
</div>
<div class="grid-item radio-wrapper future-day">
<input type="radio" name="day-of-month" id="onefuture" />
<label for="onefuture"><span>1</span></label>
</div>
<div class="grid-item radio-wrapper future-day">
<input type="radio" name="day-of-month" id="twofuture" />
<label for="twofuture"><span>2</span></label>
</div>
</div>
</fieldset>
</div>
<form class="w-100 d-flex justify-content-center mt-5">
<input type="date">
</form>
</template>
<script>
export default {
name: "datePicker",
data() {
return {
dayOfWeek: "Tuesday",
dayOfMonth: "1st",
pastMonth: "October",
isFirstDayOfMonth: true,
isCurrentDay: true,
isCurrentDayDot: true,
};
},
};
</script>
<style lang="scss">
.container {
//max-width: 341px;
label {
display: initial; //Override Bootstrap default
}
#availableDates label:nth-child(14n):after {
content: "\a";
white-space: pre;
}
}
.grid-container {
margin: 0 auto;
max-width: 341px;
display: grid;
grid-gap: 4px;
grid-template-columns: auto auto auto auto auto auto auto;
justify-content: center;
align-items: center;
.grid-item {
text-align: center;
padding: 4px;
}
.radio-wrapper {
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
width: 46px;
height: 46px;
.current-day-dot {
position: absolute;
}
&.first-of-month {
.current-month {
position: absolute;
font-size: 9px;
top: 4px;
color: #1574a1;
}
}
&.highlighted-day {
input[type="radio"] {
position: absolute;
// opacity: 0;
height: 0.1px;
width: 0.1px;
+ label {
position: relative;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
border-radius: 50%;
color: #1574a1;
span {
z-index: 2;
}
&::before {
content: "";
position: absolute;
border-radius: 50%;
border: 1px solid #1574a1;
background-color: #e4f1f7;
color: #1574a1;
width: 40px;
height: 40px;
z-index: -1;
}
&::after {
content: "";
position: absolute;
border-radius: 50%;
width: 40px;
height: 40px;
}
}
&:checked {
+ label::after {
background: #1574a1;
box-shadow: 0 0 0 3px #fff, 0 0 0 5.5px #1574a1;
color: #fff;
}
+ label span {
color: #fff;
}
}
&:focus {
+ label::before {
background-color: #1574a1;
}
+ label span {
color: #fff;
}
}
}
}
&.past-day {
input[type="radio"] {
position: absolute;
opacity: 0;
height: 0.1px;
width: 0.1px;
+ label {
position: relative;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
border-radius: 50%;
color: #8E9292;
span {
z-index: 2;
}
&::before {
content: "";
position: absolute;
border-radius: 50%;
border: 1px solid transparent;
background-color: transparent;
color: #1574a1;
width: 40px;
height: 40px;
z-index: -1;
}
&::after {
content: "";
position: absolute;
border-radius: 50%;
width: 40px;
height: 40px;
}
}
&:checked {
+ label::after {
background: #1574a1;
box-shadow: 0 0 0 3px #fff, 0 0 0 5.5px #1574a1;
color: #fff;
}
+ label span {
color: #fff;
}
}
&:focus {
+ label::before {
background-color: transparent;
}
+ label span {
color: #1574a1;
}
}
&:active {
+ label::before {
background-color: #1574a1;
}
+ label span {
color: #fff;
}
}
}
}
&.future-day {
input[type="radio"] {
position: absolute;
opacity: 0;
height: 0.1px;
width: 0.1px;
+ label {
position: relative;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
border-radius: 50%;
color: #4D5151;
span {
z-index: 2;
}
&::before {
content: "";
position: absolute;
border-radius: 50%;
border: 1px solid transparent;
background-color: transparent;
color: #1574a1;
width: 40px;
height: 40px;
z-index: -1;
}
&::after {
content: "";
position: absolute;
border-radius: 50%;
width: 40px;
height: 40px;
}
}
}
}
&.current-day {
input[type="radio"] {
position: absolute;
// opacity: 0;
height: 0.1px;
width: 0.1px;
&:after {
content: "\A";
width:4px;
height:4px;
border-radius:50%;
background: #1574a1;
position: absolute;
top: 8px;
left: -1px;
z-index: 1;
}
&:checked {
+ label::after {
background: #1574a1;
box-shadow: 0 0 0 3px #fff, 0 0 0 5.5px #1574a1;
color: #fff;
}
+ label span {
color: #fff;
}
&:after {
background: #fff;
}
}
}
span {
position: relative;
top: -.25rem;
}
}
}
}
</style>

2
src/common-components/question-chain/question-chain.vue
View file

@ -72,7 +72,7 @@ export default {
this.currentQuestionNum = this.questions[0].questionSequence;
// scroll the next question into view
this.$nextTick(() => {
document.querySelector('.current-question').scrollIntoView({behavior: "smooth"});
document.querySelector('.current-question')?.scrollIntoView({behavior: "smooth"});
})
}
},

1
src/constants/application-config.js
View file

@ -7,6 +7,7 @@ const applicationConfig = {
COOKIE_PATH: "/",
CURRENT_ENVIRONMENT: process.env.VUE_APP_CURRENT_ENVIRONMENT, // "Localhost", "Dev", "QA", and "Prod"
APPLICATION_NAME: "FixMyGlass",
APPLICATION_ABBREVIATION: "fmg",
SITE_ENTRY_TRIGGER_VALUE: "FixMyGlass"
};

20
src/constants/endpoints.js
View file

@ -1,10 +1,14 @@
const endpoints = {
GetRouteInfo: {
url: "/content/api/v1/content/RouteInfo",
url: (applicationAbbreviation) => `/content/api/v1/content/${applicationAbbreviation}/RouteInfo`,
method: "POST",
},
GetHomepageInfo: {
url: "/content/api/v1/content/HomepageInfo",
url: (applicationAbbreviation) => `/content/api/v1/content/${applicationAbbreviation}/HomepageInfo`,
method: "GET",
},
GetPageData: {
url: (applicationAbbreviation, pageName) => `/content/api/v1/content/${applicationAbbreviation}/${pageName}`,
method: "GET",
},
GetVehicleYears: {
@ -31,10 +35,6 @@ const endpoints = {
url: "/parts/api/v1/parts/damage-options",
method: "GET",
},
GetPageData: {
url: "/content/api/v1/content",
method: "GET",
},
LookupVehicleByYmms: {
url: "/vehicle/api/v1/vehicle/Lookup",
method: "GET",
@ -67,12 +67,12 @@ const endpoints = {
url: "/parts/api/v1/parts/part-from-capability-answer",
method: "POST"
},
SaveOrder: {
url: "/order/api/v1/order/save",
SaveSession: {
url: "/order/api/v1/order/save-session",
method: "POST",
},
LoadOrder: {
url: "/order/api/v1/order/load",
LoadSession: {
url: "/order/api/v1/order/load-session",
method: "POST",
},
ValidateZip: {

132
src/constants/store-actions.js
View file

@ -1,78 +1,74 @@
const storeActions = {
// Content Actions
GET_ROUTE_INFO_ACTION: "getRouteInfo",
GET_HOMEPAGE_NAME: "getHomepageName",
GET_PAGE_DATA: "getPageData",
// Content Actions
GET_ROUTE_INFO_ACTION: "getRouteInfo",
GET_HOMEPAGE_NAME: "getHomepageName",
GET_PAGE_DATA: "getPageData",
// Vehicle Actions
GET_VEHICLE_YEARS: "getVehicleYears",
GET_VEHICLE_MAKES: "getVehicleMakes",
GET_VEHICLE_MODELS: "getVehicleModels",
GET_VEHICLE_STYLES: "getVehicleStyles",
SET_VEHICLE: "setVehicle",
GET_DAMAGE_OPTIONS: "getDamageOptions",
GET_EVOX_IMAGE: "getEvoxImage",
// Vehicle Actions
GET_VEHICLE_YEARS: "getVehicleYears",
GET_VEHICLE_MAKES: "getVehicleMakes",
GET_VEHICLE_MODELS: "getVehicleModels",
GET_VEHICLE_STYLES: "getVehicleStyles",
SET_VEHICLE: "setVehicle",
GET_DAMAGE_OPTIONS: "getDamageOptions",
GET_EVOX_IMAGE: "getEvoxImage",
// Lookup Actions
LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms",
LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin",
LOOKUP_VIN_BY_PLATE: "lookupVinByPlate",
LOOKUP_VIN_BY_ADDRESS: "lookupVinByAddress",
// Lookup Actions
LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms",
LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin",
LOOKUP_VIN_BY_PLATE: "lookupVinByPlate",
LOOKUP_VIN_BY_ADDRESS: "lookupVinByAddress",
GET_PARTS_OR_QUESTIONS: "getPartsOrQuestions",
GET_PARTS: "getParts",
GET_CAPABILITY_QUESTIONS: "getCapabilityQuestions",
GET_PART_FROM_CAPABILITY_QUESTION_ANSWER:
"getPartFromCapabilityQuestionAnswer",
GET_MOLDING_QUESTIONS: "getMoldingQuestions",
SAVE_SESSION: "saveSession",
LOAD_SESSION: "loadSession",
UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE: "updateStoreWithSaveSessionResponse",
VALIDATE_ZIP: "validateZip",
LOG_EXPERIMENT_EXPOSURE: "logExperimentExposure",
LOG_PAGE_VIEW: "logPageView",
LOG_CUSTOM_EVENT: "logCustomEvent",
INITIALIZE_SESSION: "initializeSession",
GET_EXPERIMENTS_BY_USER: "GetExperimentsByUser",
RUN_EXPERIMENTS_FOR_TRIGGER: "runExperimentsForTrigger",
CLEAR_VIN: "clearVin",
RESET_SAVE_SESSION_PROMISE: "resetSaveSessionPromise",
// DEPENDENCY MUTATIONS
RESET_VEHICLE_STATE_AND_DEPENDENCIES: "resetVehicleAndDependencies",
RESET_DAMAGE_STATE_AND_DEPENDENCIES: "resetDamageAndDependencies",
RESET_REGISTRATION_STATE_AND_DEPENDENCIES: "resetRegistrationAndDependencies",
RESET_PARTS_STATE_AND_DEPENDENCIES: "resetPartsAndDependencies",
RESET_STATE: "resetState",
GET_PARTS_OR_QUESTIONS: "getPartsOrQuestions",
GET_PARTS: "getParts",
GET_CAPABILITY_QUESTIONS: "getCapabilityQuestions",
GET_PART_FROM_CAPABILITY_QUESTION_ANSWER:
"getPartFromCapabilityQuestionAnswer",
GET_MOLDING_QUESTIONS: "getMoldingQuestions",
SAVE_ORDER: "saveOrder",
LOAD_ORDER: "loadOrder",
UPDATE_STORE_WITH_SAVE_ORDER_RESPONSE: "updateStoreWithSaveOrderResponse",
VALIDATE_ZIP: "validateZip",
LOG_EXPERIMENT_EXPOSURE: "logExperimentExposure",
LOG_PAGE_VIEW: "logPageView",
LOG_CUSTOM_EVENT: "logCustomEvent",
INITIALIZE_SESSION: "initializeSession",
GET_EXPERIMENTS_BY_USER: "GetExperimentsByUser",
RUN_EXPERIMENTS_FOR_TRIGGER: "runExperimentsForTrigger",
CLEAR_VIN: "clearVin",
RESET_SAVE_ORDER_PROMISE: "resetSaveOrderPromise",
// DEPENDENCY MUTATIONS
RESET_VEHICLE_STATE_AND_DEPENDENCIES: "resetVehicleAndDependencies",
RESET_DAMAGE_STATE_AND_DEPENDENCIES: "resetDamageAndDependencies",
RESET_REGISTRATION_STATE_AND_DEPENDENCIES:
"resetRegistrationAndDependencies",
RESET_PARTS_STATE_AND_DEPENDENCIES: "resetPartsAndDependencies",
RESET_STATE: "resetState",
// SAVE COMPONENT STATE
SAVE_VEHICLE_YEAR: "saveVehicleYear",
SAVE_VEHICLE_MAKE: "saveVehicleMake",
SAVE_VEHICLE_MODEL: "saveVehicleModel",
SAVE_VEHICLE_STYLE: "saveVehicleStyle",
SAVE_VEHICLE_DAMAGE: "saveVehicleDamage",
SAVE_VIN_LOOKUP: "saveVinLookup",
SAVE_SERVICE_LOCATION: "saveServiceLocation",
SAVE_EMAIL: "saveEmail",
SAVE_REGISTRATION_LICENSE_PLATE_LOOKUP:
"saveRegistrationLicensePlateLookup",
SAVE_VIN: "saveVin",
SAVE_REGISTRATION_ADDRESS_LOOKUP: "saveRegistrationAddressLookup",
SAVE_GLASS_PARTS: "saveGlassParts",
SAVE_PART_QUESTION_ANSWERS: "savePartQuestionAnswers",
RESET_MOLDING_AND_CAPABILITY_QUESTIONS_IF_NEEDED:
"resetMoldingAndCapabilityQuestionAnswersIfNeeded",
SAVE_MOLDING_QUESTION_ANSWERS: "saveMoldingQuestionAnswers",
SAVE_CAPABILITY_QUESTION_ANSWERS: "saveCapabilityQuestionAnswers",
// SAVE COMPONENT STATE
SAVE_VEHICLE_YEAR: "saveVehicleYear",
SAVE_VEHICLE_MAKE: "saveVehicleMake",
SAVE_VEHICLE_MODEL: "saveVehicleModel",
SAVE_VEHICLE_STYLE: "saveVehicleStyle",
SAVE_VEHICLE_DAMAGE: "saveVehicleDamage",
SAVE_VIN_LOOKUP: "saveVinLookup",
SAVE_SERVICE_LOCATION: "saveServiceLocation",
SAVE_EMAIL: "saveEmail",
SAVE_REGISTRATION_LICENSE_PLATE_LOOKUP: "saveRegistrationLicensePlateLookup",
SAVE_VIN: "saveVin",
SAVE_REGISTRATION_ADDRESS_LOOKUP: "saveRegistrationAddressLookup",
SAVE_GLASS_PARTS: "saveGlassParts",
SAVE_PART_QUESTION_ANSWERS: "savePartQuestionAnswers",
RESET_MOLDING_AND_CAPABILITY_QUESTIONS_IF_NEEDED:
"resetMoldingAndCapabilityQuestionAnswersIfNeeded",
SAVE_MOLDING_QUESTION_ANSWERS: "saveMoldingQuestionAnswers",
SAVE_CAPABILITY_QUESTION_ANSWERS: "saveCapabilityQuestionAnswers",
};
const gaStoreActions = {
UPDATE_CURRENTLY_SELECTED_VALUES: "updateCurrentlySelectedValues",
UPDATE_FIRED_GA_CLICK_EVENT_VALUES: "updateFiredGaClickEventValues",
UPDATE_LAST_FOCUSED_INPUT_GROUP: "updateLastFocusedInputGroup",
UPDATE_WAS_LAST_FOCUSED_INPUT_MULTISELECT:
"updateWasLastFocusedInputMultiselect",
UPDATE_CURRENTLY_SELECTED_VALUES: "updateCurrentlySelectedValues",
UPDATE_FIRED_GA_CLICK_EVENT_VALUES: "updateFiredGaClickEventValues",
UPDATE_LAST_FOCUSED_INPUT_GROUP: "updateLastFocusedInputGroup",
UPDATE_WAS_LAST_FOCUSED_INPUT_MULTISELECT:
"updateWasLastFocusedInputMultiselect",
};
export { storeActions, gaStoreActions };

126
src/constants/store-mutations.js
View file

@ -1,79 +1,79 @@
const storeMutations = {
// VEHICLE MUTATIONS
UPDATE_YEAR: "updateYear",
UPDATE_MAKE: "updateMake",
UPDATE_MODEL: "updateModel",
UPDATE_STYLE: "updateStyle",
UPDATE_CAR_ID: "updateCarId",
UPDATE_VEHICLE_CATEGORY: "updateVehicleCategory",
UPDATE_VEHICLE_IMAGE_URL: "updateVehicleImageUrl",
UPDATE_VEHICLE_IMAGE_VIF_NUMBER: "updateVehicleImageVifNumber",
UPDATE_VEHICLE_IMAGE_COLOR: "updateVehicleImageColor",
UPDATE_VEHICLE_VIN: "updateVehicleVin",
UPDATE_VEHICLE: "updateVehicle",
// VEHICLE MUTATIONS
UPDATE_YEAR: "updateYear",
UPDATE_MAKE: "updateMake",
UPDATE_MODEL: "updateModel",
UPDATE_STYLE: "updateStyle",
UPDATE_CAR_ID: "updateCarId",
UPDATE_VEHICLE_CATEGORY: "updateVehicleCategory",
UPDATE_VEHICLE_IMAGE_URL: "updateVehicleImageUrl",
UPDATE_VEHICLE_IMAGE_VIF_NUMBER: "updateVehicleImageVifNumber",
UPDATE_VEHICLE_IMAGE_COLOR: "updateVehicleImageColor",
UPDATE_VEHICLE_VIN: "updateVehicleVin",
UPDATE_VEHICLE: "updateVehicle",
UPDATE_IS_REPAIR: "updateIsRepair",
UPDATE_NUMBER_OF_CHIPS: "updateNumberOfChips",
UPDATE_GLASS_TO_REPLACE: "updateGlassToReplace",
UPDATE_PART_QUESTION_ANSWERS: "updatePartQuestionAnswers",
UPDATE_MOLDING_QUESTION_ANSWERS: "updateMoldingQuestionAnswers",
UPDATE_CAPABILITY_QUESTION_ANSWERS: "updateCapabilityQuestionAnswers",
UPDATE_GLASS_PARTS: "updateGlassParts",
UPDATE_OTHER_PARTS: "updateOtherParts",
UPDATE_IS_REPAIR: "updateIsRepair",
UPDATE_NUMBER_OF_CHIPS: "updateNumberOfChips",
UPDATE_GLASS_TO_REPLACE: "updateGlassToReplace",
UPDATE_PART_QUESTION_ANSWERS: "updatePartQuestionAnswers",
UPDATE_MOLDING_QUESTION_ANSWERS: "updateMoldingQuestionAnswers",
UPDATE_CAPABILITY_QUESTION_ANSWERS: "updateCapabilityQuestionAnswers",
UPDATE_GLASS_PARTS: "updateGlassParts",
UPDATE_OTHER_PARTS: "updateOtherParts",
UPDATE_REGISTRATION_LICENSE_PLATE: "updateRegistrationLicensePlate",
UPDATE_REGISTRATION_ADDRESS: "updateRegistrationAddress",
UPDATE_REGISTRATION_CITY: "updateRegistrationCity",
UPDATE_REGISTRATION_STATE: "updateRegistrationState",
UPDATE_REGISTRATION_ZIP_CODE: "updateRegistrationZipCode",
UPDATE_REGISTRATION_FIRST_NAME: "updateRegistrationFirstName",
UPDATE_REGISTRATION_LAST_NAME: "updateRegistrationLastName",
UPDATE_REGISTRATION: "updateRegistration",
UPDATE_REGISTRATION_LICENSE_PLATE: "updateRegistrationLicensePlate",
UPDATE_REGISTRATION_ADDRESS: "updateRegistrationAddress",
UPDATE_REGISTRATION_CITY: "updateRegistrationCity",
UPDATE_REGISTRATION_STATE: "updateRegistrationState",
UPDATE_REGISTRATION_ZIP_CODE: "updateRegistrationZipCode",
UPDATE_REGISTRATION_FIRST_NAME: "updateRegistrationFirstName",
UPDATE_REGISTRATION_LAST_NAME: "updateRegistrationLastName",
UPDATE_REGISTRATION: "updateRegistration",
UPDATE_SERVICE_LOCATION_ZIP_CODE: "updateServiceLocationZipCode",
UPDATE_SERVICE_LOCATION_STATE: "updateServiceLocationState",
UPDATE_SERVICE_LOCATION: "updateServiceLocation",
UPDATE_SERVICE_LOCATION_ZIP_CODE: "updateServiceLocationZipCode",
UPDATE_SERVICE_LOCATION_STATE: "updateServiceLocationState",
UPDATE_SERVICE_LOCATION: "updateServiceLocation",
UPDATE_CUSTOMER_EMAIL_ADDRESS: "updateCustomerEmailAddress",
UPDATE_CUSTOMER_EMAIL_ADDRESS: "updateCustomerEmailAddress",
// ORDER MUTATIONS
UPDATE_REFERRAL_NUMBER: "updateReferralNumber",
UPDATE_REFERRAL_DATE: "updateReferralDate",
UPDATE_REFERRAL_CORRELATION_ID: "updateReferralCorrelationId",
UPDATE_PARENT_ACCT_NUMBER: "updateParentAcctNumber",
UPDATE_EON: "updateEON",
UPDATE_SAVED_SESSION_ID: "updateSavedSessionId",
UPDATE_CRM_CUSTOMER_ID: "updateCrmCustomerId",
// ORDER MUTATIONS
UPDATE_REFERRAL_NUMBER: "updateReferralNumber",
UPDATE_REFERRAL_DATE: "updateReferralDate",
UPDATE_REFERRAL_CORRELATION_ID: "updateReferralCorrelationId",
UPDATE_PARENT_ACCT_NUMBER: "updateParentAcctNumber",
UPDATE_EON: "updateEON",
UPDATE_SAVED_SESSION_ID: "updateSavedSessionId",
UPDATE_CRM_CUSTOMER_ID: "updateCrmCustomerId",
// EVENT BUS MUTATIONS
ADD_EVENT_TO_BUS: "addEventToBus",
REMOVE_EVENT_FROM_BUS: "removeEventFromBus",
// EVENT BUS MUTATIONS
ADD_EVENT_TO_BUS: "addEventToBus",
REMOVE_EVENT_FROM_BUS: "removeEventFromBus",
// DEPENDENCY MUTATIONS
RESET_VEHICLE_STATE: "resetVehicleState",
RESET_DAMAGE_STATE: "resetDamageState",
RESET_REGISTRATION_STATE: "resetRegistrationState",
RESET_GLASS_PARTS_STATE: "resetGlassPartsState",
RESET_STATE: "resetState",
RESET_SAVE_ORDER_PROMISE: "resetSaveOrderPromise",
// DEPENDENCY MUTATIONS
RESET_VEHICLE_STATE: "resetVehicleState",
RESET_DAMAGE_STATE: "resetDamageState",
RESET_REGISTRATION_STATE: "resetRegistrationState",
RESET_GLASS_PARTS_STATE: "resetGlassPartsState",
RESET_STATE: "resetState",
RESET_SAVE_SESSION_PROMISE: "resetSaveSessionPromise",
// OTHER MUTATIONS
UPDATE_PAGE_DATA: "updatePageData",
UPDATE_STATE_WITH_ORDER_INFORMATION: "updateStateWithOrderInformation",
UPDATE_SAVE_ORDER_PROMISE: "updateSaveOrderPromise",
UPDATE_LAST_PAGE_VISITED: "updateLastPageVisited",
// OTHER MUTATIONS
UPDATE_PAGE_DATA: "updatePageData",
UPDATE_STATE_WITH_ORDER_INFORMATION: "updateStateWithOrderInformation",
UPDATE_SAVE_SESSION_PROMISE: "updateSaveSessionPromise",
UPDATE_LAST_PAGE_VISITED: "updateLastPageVisited",
// EXPERIMENT MUTATIONS
UPDATE_EXPERIMENTS: "updateExperiments",
UPDATE_TRIGGERED_SITE_ENTRY: "updateTriggeredSiteEntry",
// EXPERIMENT MUTATIONS
UPDATE_EXPERIMENTS: "updateExperiments",
UPDATE_TRIGGERED_SITE_ENTRY: "updateTriggeredSiteEntry",
};
const gaStoreMutations = {
UPDATE_CURRENTLY_SELECTED_VALUES: "updateCurrentlySelectedValues",
UPDATE_FIRED_GA_CLICK_EVENT_VALUES: "updateFiredGaClickEventValues",
UPDATE_LAST_FOCUSED_INPUT_GROUP: "updateLastFocusedInputGroup",
UPDATE_WAS_LAST_FOCUSED_INPUT_MULTISELECT:
"updateWasLastFocusedInputMultiselect",
UPDATE_CURRENTLY_SELECTED_VALUES: "updateCurrentlySelectedValues",
UPDATE_FIRED_GA_CLICK_EVENT_VALUES: "updateFiredGaClickEventValues",
UPDATE_LAST_FOCUSED_INPUT_GROUP: "updateLastFocusedInputGroup",
UPDATE_WAS_LAST_FOCUSED_INPUT_MULTISELECT:
"updateWasLastFocusedInputMultiselect",
};
export { storeMutations, gaStoreMutations };

8
src/helpers/heritage-integration/navigation-helper.js
View file

@ -1,7 +1,7 @@
import { queryStrings } from "@/constants/query-strings";
import { externalUrls } from "@/router/router-constants/externalUrl-values";
import { lazyLoadComponent } from "@/router/dynamic-routing/component-loader.js";
import { saveOrder } from "@/helpers/heritage-integration/order-helper.js";
import { saveSession } from "@/helpers/heritage-integration/order-helper.js";
import { fmgPageValues } from "@/router/router-constants/fmgPage-values";
import store from "@/store";
import router from "@/router";
@ -39,10 +39,10 @@ export async function getPageToRouteExistingOrderTo(toRoute = {}, existingHerita
Used to navigate to the heritage funnel with the correct query string and url.
*/
export async function navigateToHeritageFunnel(shouldSaveOrder = true) {
export async function navigateToHeritageFunnel(shouldSaveSession = true) {
// Create the order (or save existing order) when navigating to Heritage Funnel.
if (shouldSaveOrder) {
await saveOrder();
if (shouldSaveSession) {
await saveSession();
}
router.navigateToExternalUrl(

26
src/helpers/heritage-integration/navigation-helper.spec.js
View file

@ -295,7 +295,7 @@ describe("getPageToRouteExistingOrderTo", () => {
});
describe("navigateToHeritageFunnel", () => {
test("should save order", async () => {
test("should save session", async () => {
// Arrange
const mockReferralNumber = "2";
const mockCorrelationId = "55";
@ -308,26 +308,26 @@ describe("navigateToHeritageFunnel", () => {
const mockData = {
actionList: [{
actionName: storeActions.SAVE_ORDER,
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
}]
}
setupMocksForJsFiles(mockData);
const saveOrderFunction = jest.spyOn(orderHelper, "saveOrder");
const saveSessionFunction = jest.spyOn(orderHelper, "saveSession");
router.navigateToExternalUrl = jest.fn();
// Act
await navigateToHeritageFunnel();
// Assert
expect(saveOrderFunction).toHaveBeenCalled();
expect(saveSessionFunction).toHaveBeenCalled();
// Should save before we navigate to heritage by default
const saveOrderFunctionCallOrder = saveOrderFunction.mock.invocationCallOrder[0];
const saveSessionFunctionCallOrder = saveSessionFunction.mock.invocationCallOrder[0];
const routerNavigateFunctionCallOrder = router.navigateToExternalUrl.mock.invocationCallOrder[0];
expect(saveOrderFunctionCallOrder).toBeLessThan(routerNavigateFunctionCallOrder);
saveOrderFunction.mockRestore();
expect(saveSessionFunctionCallOrder).toBeLessThan(routerNavigateFunctionCallOrder);
saveSessionFunction.mockRestore();
});
test("should go to heritage funnel", async () => {
@ -343,7 +343,7 @@ describe("navigateToHeritageFunnel", () => {
const mockData = {
actionList: [{
actionName: storeActions.SAVE_ORDER,
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
}]
}
@ -366,7 +366,7 @@ describe("navigateToHeritageFunnel", () => {
);
});
test("should not save order, but should still navigate", async () => {
test("should not save session, but should still navigate", async () => {
// Arrange
const mockReferralNumber = "2";
const mockCorrelationId = "55";
@ -376,22 +376,22 @@ describe("navigateToHeritageFunnel", () => {
const mockData = {
actionList: [{
actionName: storeActions.SAVE_ORDER,
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
}]
}
setupMocksForJsFiles(mockData);
const saveOrderFunction = jest.spyOn(orderHelper, "saveOrder");
const saveSessionFunction = jest.spyOn(orderHelper, "saveSession");
router.navigateToExternalUrl = jest.fn();
// Act
await navigateToHeritageFunnel(false);
// Assert
expect(saveOrderFunction).not.toHaveBeenCalled();
expect(saveSessionFunction).not.toHaveBeenCalled();
expect(router.navigateToExternalUrl).toHaveBeenCalled();
saveOrderFunction.mockRestore();
saveSessionFunction.mockRestore();
});
});

58
src/helpers/heritage-integration/order-helper.js
View file

@ -10,7 +10,7 @@ import { storeMutations } from "@/constants/store-mutations";
it will reset the state and go back to the start of the funnel.
*/
export async function loadOrderIfPresent() {
export async function loadSessionIfPresent() {
const funnelCookie = getFunnelCookie();
// Do nothing if there is no cookie, correlation id, or referral number.
@ -26,7 +26,7 @@ export async function loadOrderIfPresent() {
}
// Load referral if there is a cookie, and it doesn't indicate it needs a state reset.
return (await loadOrder(funnelCookie.ReferralNumber, funnelCookie.ReferralDate, funnelCookie.ReferralCorrelationId, funnelCookie.ReferralParentAccountNumber)).data;
return (await loadSession(funnelCookie.ReferralNumber, funnelCookie.ReferralDate, funnelCookie.ReferralCorrelationId, funnelCookie.ReferralParentAccountNumber)).data;
}
/*
@ -34,34 +34,34 @@ export async function loadOrderIfPresent() {
This will also set Referral information in the store after saving, and then
update the cookie.
*/
export async function saveOrder() {
var saveOrderPromise;
if (store.getters.applicationUser.saveOrderPromise) {
// queue newest request after current saveOrderPromise resolves
saveOrderPromise = store.getters.applicationUser.saveOrderPromise.then(() => {
// get a new saveOrderPromise
return saveOrderHelper();
export async function saveSession() {
var saveSessionPromise;
if (store.getters.applicationUser.saveSessionPromise) {
// queue newest request after current saveSessionPromise resolves
saveSessionPromise = store.getters.applicationUser.saveSessionPromise.then(() => {
// get a new saveSessionPromise
return saveSessionHelper();
});
} else {
// create an initial saveOrderPromise
saveOrderPromise = saveOrderHelper();
// create an initial saveSessionPromise
saveSessionPromise = saveSessionHelper();
}
store.commit(storeMutations.UPDATE_SAVE_ORDER_PROMISE, saveOrderPromise);
store.commit(storeMutations.UPDATE_SAVE_SESSION_PROMISE, saveSessionPromise);
// await here to allow for a caller to await and make the function synchronous
await saveOrderPromise;
await saveSessionPromise;
}
// PRIVATE FUNCTIONS //
/*
Calls API to load order given the referral number, referralDate, and referralCorrelationId
Calls API to load session given the referral number, referralDate, and referralCorrelationId
and returns the response.
*/
async function loadOrder(referralNumber, referralDate, referralCorrelationId, accountNumber) {
// await the saveOrderPromise in the store to make sure we're loading up to date information
await store.getters.applicationUser.saveOrderPromise;
const response = await baseMixin.methods.dispatchStoreAction(storeActions.LOAD_ORDER,
async function loadSession(referralNumber, referralDate, referralCorrelationId, accountNumber) {
// await the saveSessionPromise in the store to make sure we're loading up to date information
await store.getters.applicationUser.saveSessionPromise;
const response = await baseMixin.methods.dispatchStoreAction(storeActions.LOAD_SESSION,
{
referralNumber: referralNumber.toString(),
referralDate: referralDate,
@ -73,18 +73,18 @@ async function loadOrder(referralNumber, referralDate, referralCorrelationId, ac
}
/*
Encapsulates asynchronous Save Order logic inside a promise to allow for Save Order queuing
Encapsulates asynchronous Save Session logic inside a promise to allow for Save Session queuing
*/
async function saveOrderHelper() {
const savedOrderInfo = await baseMixin.methods.dispatchStoreAction(storeActions.SAVE_ORDER);
// Update the store with information received from the saveOrder response
await baseMixin.methods.dispatchStoreAction(storeActions.UPDATE_STORE_WITH_SAVE_ORDER_RESPONSE, {
referralNumber: savedOrderInfo.data.referralNumber.toString(),
referralCorrelationId: savedOrderInfo.data.referralCorrelationId,
referralDate: savedOrderInfo.data.referralDate,
accountNumber: savedOrderInfo.data.accountNumber.toString(),
savedSessionId: savedOrderInfo.data.savedSessionId,
crmCustomerId: savedOrderInfo.data.crmCustomerId.toString(),
async function saveSessionHelper() {
const savedSessionInfo = await baseMixin.methods.dispatchStoreAction(storeActions.SAVE_SESSION);
// Update the store with information received from the saveSession response
await baseMixin.methods.dispatchStoreAction(storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE, {
referralNumber: savedSessionInfo.data.referralNumber.toString(),
referralCorrelationId: savedSessionInfo.data.referralCorrelationId,
referralDate: savedSessionInfo.data.referralDate,
accountNumber: savedSessionInfo.data.accountNumber.toString(),
savedSessionId: savedSessionInfo.data.savedSessionId,
crmCustomerId: savedSessionInfo.data.crmCustomerId.toString(),
}, false);
// Update the cookie with the referral information when saved.

38
src/helpers/heritage-integration/order-helper.spec.js
View file

@ -1,11 +1,11 @@
import * as cookieHelper from "@/helpers/heritage-integration/cookie-helper";
import { loadOrderIfPresent, saveOrder } from "@/helpers/heritage-integration/order-helper";
import { loadSessionIfPresent, saveSession } from "@/helpers/heritage-integration/order-helper";
import { cookieNames } from "@/constants/cookie-names";
import { setupMocksForJsFiles, removeAllTestCookies, getMockOrderInfo, setupCookies } from "@/helpers/unit-test-helper.js";
import { storeActions } from "@/constants/store-actions";
import router from "@/router";
describe("loadOrderIfPresent", () => {
describe("loadSessionIfPresent", () => {
afterEach(() => {
removeAllTestCookies();
@ -25,7 +25,7 @@ describe("loadOrderIfPresent", () => {
document.cookie = `${cookieNames.FUNNEL_SESSION_INFO}=${JSON.stringify(testCookieValue)}; path=/; ${cookieHelper.getCookieDomainValue()}`;
// Act
loadOrderIfPresent();
loadSessionIfPresent();
// Assert
expect(cookieHelper.deleteFunnelCookie).toHaveBeenCalled();
@ -49,7 +49,7 @@ describe("loadOrderIfPresent", () => {
var mocks = setupMocksForJsFiles(mockData);
// Act
loadOrderIfPresent();
loadSessionIfPresent();
// Assert
expect(cookieHelper.getFunnelCookie).toHaveBeenCalled();
@ -69,21 +69,21 @@ describe("loadOrderIfPresent", () => {
var mocks = setupMocksForJsFiles(mockData);
// Act
loadOrderIfPresent();
loadSessionIfPresent();
// Assert
expect(cookieHelper.getFunnelCookie).toHaveBeenCalled();
expect(mocks.baseMixin.methods.dispatchStoreAction).not.toHaveBeenCalledWith(storeActions.RESET_STATE);
});
test("Funnel cookie valid, should call loadOrder", async () => {
test("Funnel cookie valid, should call loadSession", async () => {
// Arrange
cookieHelper.getFunnelCookie = jest.spyOn(cookieHelper, "getFunnelCookie")
.mockReturnValueOnce({ ShouldResetState: false, ReferralNumber: 123456, ReferralCorrelationId: "yyy-yyy-yyyy", ReferralDate: new Date()});
const mockData = {
actionList: [{
actionName: storeActions.LOAD_ORDER,
actionName: storeActions.LOAD_SESSION,
data: { ReferralNumber: 123456, vehicle: { year: 2010 } }
}],
}
@ -91,22 +91,22 @@ describe("loadOrderIfPresent", () => {
var mocks = setupMocksForJsFiles(mockData);
// Act
const result = await loadOrderIfPresent();
const result = await loadSessionIfPresent();
// Assert
expect(cookieHelper.getFunnelCookie).toHaveBeenCalled();
expect(mocks.baseMixin.methods.dispatchStoreAction).not.toHaveBeenCalledWith(storeActions.LOAD_ORDER);
expect(mocks.baseMixin.methods.dispatchStoreAction).not.toHaveBeenCalledWith(storeActions.LOAD_SESSION);
expect(result.ReferralNumber).toBe(123456);
expect(result.vehicle.year).toBe(2010);
});
});
describe("saveOrder", () => {
describe("saveSession", () => {
afterEach(() => {
removeAllTestCookies();
});
test("saveOrder => should set state order values", async () => {
test("saveSession => should set state order values", async () => {
// Arrange
const mockReferralNumber = "2";
const mockCorrelationId = "55";
@ -120,11 +120,11 @@ describe("saveOrder", () => {
const mockData = {
actionList: [
{
actionName: storeActions.SAVE_ORDER,
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
},
{
actionName: storeActions.UPDATE_STORE_WITH_SAVE_ORDER_RESPONSE
actionName: storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE
}
]
}
@ -132,11 +132,11 @@ describe("saveOrder", () => {
const mocks = setupMocksForJsFiles(mockData);
// Act
await saveOrder();
await saveSession();
// Assert
expect(mocks.baseMixin.methods.dispatchStoreAction).toHaveBeenCalledWith(storeActions.SAVE_ORDER);
expect(mocks.baseMixin.methods.dispatchStoreAction).toHaveBeenCalledWith(storeActions.UPDATE_STORE_WITH_SAVE_ORDER_RESPONSE, {
expect(mocks.baseMixin.methods.dispatchStoreAction).toHaveBeenCalledWith(storeActions.SAVE_SESSION);
expect(mocks.baseMixin.methods.dispatchStoreAction).toHaveBeenCalledWith(storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE, {
referralNumber: mockReferralNumber,
referralDate: mockReferralDate,
referralCorrelationId: mockCorrelationId,
@ -146,7 +146,7 @@ describe("saveOrder", () => {
}, false);
});
test("saveOrder => should update DidHeritageFunnelUpdateLast cookie value to false", async () => {
test("saveSession => should update DidHeritageFunnelUpdateLast cookie value to false", async () => {
// Arrange
const mockReferralNumber = 1566818;
const mockReferralDate = "2022-03-15T10:56:24.597";
@ -159,7 +159,7 @@ describe("saveOrder", () => {
const mockData = {
actionList: [{
actionName: storeActions.SAVE_ORDER,
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
}],
router: router
@ -178,7 +178,7 @@ describe("saveOrder", () => {
setupCookies({ funnelCookieValue: JSON.stringify(testCookieValue) });
// Act
await saveOrder();
await saveSession();
// Assert
expect(cookieHelper.getFunnelCookie().DidHeritageFunnelUpdateLast).toEqual(false);

110
src/layouts/capability-questions/capability-questions.vue
View file

@ -76,7 +76,6 @@ export default {
capabilityQuestionsData: store.getters.pageData(fmgPageValues.CAPABILITY_QUESTIONS).partsOrQuestions,
selectedAnswers: {},
currentQuestionChainIndex: 0,
foundDuplicateQuestions: [],
};
},
computed: {
@ -97,7 +96,17 @@ export default {
}
},
mounted() {
this.loadInitialCapabilityQuestionsData();
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.capabilityQuestionAnswers;
this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((glass, i) => {
// NOTE: questions for property "questions" can differ between layouts
glass.questions = glass.capabilityQuestions;
// reset selectedAnswers for this glass
this.selectedAnswers[glass.key] = [];
// pass in: glass, i, alreadyAnsweredQuestions
return this.setupInitialData(glass, i, alreadyAnsweredQuestions);
});
},
methods: {
showThisQuestionChain(glass, i) {
@ -110,14 +119,13 @@ export default {
},
async forwardButtonAction() {
const capabilityQuestionsAnswersArray = this.capabilityQuestionsData.map((glass) => {
const selectedAnswerResult1 = glass.answerData.answerResult;
const selectedAnswerResult2 = glass.answerData.answerResult2;
const selectedAnswerResult2 = this.getCorrespondingAnswerResult2(glass.answerData.answerResult);
return {
glassLocation: glass.glassLocation,
glassName: glass.glassName,
result: glass.answerData.answerResult,
result1: selectedAnswerResult1,
result1: glass.answerData.answerResult,
result2: selectedAnswerResult2,
answeredQuestions: glass.answerData.answeredQuestions,
isSuppressedPart: glass.isSuppressedPart,
@ -147,7 +155,7 @@ export default {
// only runs when all questions in a question-chain have been answered
// when selectedAnswers updates, user has completed this part's question chain and has a final answer
// (does not get run for each invididual question's answer, only when
// all relevent questions for the current part have been answered)
// all relevant questions for the current part have been answered)
/*
answer example format:
@ -166,6 +174,7 @@ export default {
// collect a list of the answered questions' numbers, needed later below
const answeredQuestionIndexes = [];
const foundDuplicateQuestions = [];
// if user has answered a question differently than anything that was preloaded,
// we need to clear out any preloaded answers
@ -255,7 +264,6 @@ export default {
// restore original answerResult
if (thisAns.originalAnswerResult) {
thisAns.answerResult = thisAns.originalAnswerResult;
thisAns.answerResult1 = thisAns.originalAnswerResult;
thisAns.originalAnswerResult = null;
}
}
@ -270,7 +278,6 @@ export default {
thisAns.nextQuestionSequence = null;
thisAns.originalAnswerResult = thisAns.originalAnswerResult || thisAns.answerResult;
thisAns.answerResult = matchedAnswer.answerResult;
thisAns.answerResult1 = matchedAnswer.answerResult;
}
}
});
@ -280,12 +287,12 @@ export default {
thisAnsweredCapabilityQuestion.suppressQuestion = true;
const thisGlassPart = "glass" + gpIndex;
if (this.foundDuplicateQuestions[thisGlassPart]) {
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredCapabilityQuestion.questionSequence)) {
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredCapabilityQuestion.questionSequence);
if (foundDuplicateQuestions[thisGlassPart]) {
if (!foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredCapabilityQuestion.questionSequence)) {
foundDuplicateQuestions[thisGlassPart].push(thisAnsweredCapabilityQuestion.questionSequence);
}
} else {
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredCapabilityQuestion.questionSequence];
foundDuplicateQuestions[thisGlassPart] = [thisAnsweredCapabilityQuestion.questionSequence];
}
// are there any questions left that are not suppressed?
@ -306,7 +313,6 @@ export default {
// set the answerData as 'already answered'
glass.answerData = {
answerResult: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
answerResult1: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
answeredQuestions: [answeredQuestionObj],
};
@ -332,12 +338,12 @@ export default {
// EX answeredQuestionIndexes: [1,5,11,13]
// EX this.foundDuplicateQuestions = {
// EX foundDuplicateQuestions = {
// "glassPart1": [1],
// "glassPart2": [7, 10]
// };
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
const thisPartsDupes = foundDuplicateQuestions["glass" + answer.glassIndex];
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
const glassPartAnswered = this.capabilityQuestionsData[answer.glassIndex];
@ -383,14 +389,9 @@ export default {
});
filteredCompleteAnsweredQuestions = filteredCompleteAnsweredQuestions.sort((a, b) => a.questionNum - b.questionNum);
const selectedAnswerResult1 = answer.answerResult;
const selectedAnswerResult2 = this.getCorrespondingAnswerResult2(selectedAnswerResult1);
// set final answer data for the current answered glass part
glassPartAnswered.answerData = {
answerResult: selectedAnswerResult1,
answerResult1: selectedAnswerResult1,
answerResult2: selectedAnswerResult2,
answerResult: answer.answerResult,
answeredQuestions: filteredCompleteAnsweredQuestions,
}
@ -412,73 +413,6 @@ export default {
.answers.find(answer => answer.answerResult == answerResult1)
.answerResult2;
},
loadInitialCapabilityQuestionsData() {
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.capabilityQuestionAnswers;
this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((glass, i) => {
glass.key = glass.glassLocation + "-" + glass.glassName;
this.selectedAnswers[glass.key] = [];
if (!alreadyAnsweredQuestions) {
glass.answerData = null;
}
alreadyAnsweredQuestions?.forEach((savedPart) => {
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) {
return;
}
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
let answerString = "";
// matches; loop through answeredQuestions for matches
savedPart.answeredQuestions.forEach((aq) => {
if (!aq.questionNum || !aq.selectedAnswerText) {
return;
}
// determine which answer was previously chosen
const theAns = glass.capabilityQuestions[aq.questionNum - 1].answers.find((a) => {
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
});
if (theAns.nextQuestionSequence) {
answerString = `${aq.questionNum}|nextQuestion|${theAns.nextQuestionSequence}|${theAns.answerText}`
} else {
answerString = `${aq.questionNum}|answer|${theAns.answerResult}|${theAns.answerText}`
}
// mark this partQuestion as answered (question-chain will read this)
glass.capabilityQuestions[aq.questionNum - 1].answerSelected = answerString;
// mark this partQuestion as duplicate if it is (question-chain will read this)
if (aq.suppressQuestion) {
glass.capabilityQuestions[aq.questionNum - 1].suppressQuestion = true;
}
});
// advance the currentQuestionChainIndex
this.currentQuestionChainIndex = i;
// add answerData to current glass
glass.answerData = {
answerResult: savedPart.result,
answerResult1: savedPart.result,
answerResult2: this.getCorrespondingAnswerResult2(savedPart.result),
answeredQuestions: savedPart.answeredQuestions
}
}
});
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
this.$watch("selectedAnswers." + glass.key, (newValue) => {
if (newValue) {
this.handleAnswerUpdates(newValue);
}
}, { deep: true })
return glass;
});
},
},
components: {
funnelHeader,

99
src/layouts/molding-questions/molding-questions.vue
View file

@ -94,7 +94,6 @@ export default {
moldingQuestionsData: store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS).partsOrQuestions,
selectedAnswers: {},
currentGlassIndex: 0,
foundDuplicateQuestions: [],
};
},
computed: {
@ -109,7 +108,17 @@ export default {
}
},
mounted() {
this.LoadInitialData();
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.moldingQuestionAnswers;
this.moldingQuestionsData = this.pageData.partsOrQuestions.filter(x => x.parts[0].childPartQuestions.length).map((glass, i) => {
// NOTE: questions for property "questions" can differ between layouts
glass.questions = glass.parts[0].childPartQuestions;
// reset selectedAnswers for this glass
this.selectedAnswers[glass.key] = [];
// pass in: glass, i, alreadyAnsweredQuestions
return this.setupInitialData(glass, i, alreadyAnsweredQuestions);
});
},
methods: {
arePagePrerequisitesValid() {
@ -153,11 +162,11 @@ export default {
this.navigateForward(partsOrQuestions);
},
handleAnswerUpdates(key, answer) {
handleAnswerUpdates(answer) {
// only runs when all questions in a question-chain have been answered
// when selectedAnswers updates, user has completed this part's question chain and has a final answer
// (does not get run for each invididual question's answer, only when
// all relevent questions for the current part have been answered)
// all relevant questions for the current part have been answered)
/*
answer example format:
@ -176,6 +185,7 @@ export default {
// collect a list of the answered questions' numbers, needed later below
const answeredQuestionIndexes = [];
const foundDuplicateQuestions = [];
// if user has answered a question differently than anything that was preloaded,
// we need to clear out any preloaded answers
@ -288,12 +298,12 @@ export default {
thisAnsweredPartQuestion.suppressQuestion = true;
const thisGlassPart = "glass" + gpIndex;
if (this.foundDuplicateQuestions[thisGlassPart]) {
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredPartQuestion.questionSequence)) {
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredPartQuestion.questionSequence);
if (foundDuplicateQuestions[thisGlassPart]) {
if (!foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredPartQuestion.questionSequence)) {
foundDuplicateQuestions[thisGlassPart].push(thisAnsweredPartQuestion.questionSequence);
}
} else {
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredPartQuestion.questionSequence];
foundDuplicateQuestions[thisGlassPart] = [thisAnsweredPartQuestion.questionSequence];
}
// are there any questions left that are not suppressed?
@ -341,12 +351,12 @@ export default {
// EX answeredQuestionIndexes: [1,5,11,13]
// EX this.foundDuplicateQuestions = {
// EX foundDuplicateQuestions = {
// "glassPart1": [1],
// "glassPart2": [7, 10]
// };
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
const thisPartsDupes = foundDuplicateQuestions["glass" + answer.glassIndex];
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
const glassPartAnswered = this.moldingQuestionsData[answer.glassIndex];
@ -408,75 +418,6 @@ export default {
}
},
LoadInitialData() {
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.moldingQuestionAnswers;
this.moldingQuestionsData = this.pageData.partsOrQuestions.filter(x => x.parts[0].childPartQuestions.length).map((glass, i) => {
glass.key = glass.glassLocation + "-" + glass.glassName;
// NOTE: property "questions" can differ between layouts
glass.questions = glass.parts[0].childPartQuestions;
this.selectedAnswers[glass.key] = [];
if (!alreadyAnsweredQuestions) {
glass.answerData = null;
}
alreadyAnsweredQuestions?.forEach((savedPart) => {
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.partNum) {
return;
}
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
let answerString = "";
// matches; loop through answeredQuestions for matches
savedPart.answeredQuestions.forEach((aq) => {
if (!aq.questionNum || !aq.selectedAnswerText) {
return;
}
// determine which answer was previously chosen
const theAns = glass.questions[aq.questionNum-1].answers.find((a) => {
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
});
if (theAns.nextQuestionSequence) {
answerString = `${aq.questionNum}|nextQuestion|${theAns.nextQuestionSequence}|${theAns.answerText}`
} else {
answerString = `${aq.questionNum}|answer|${theAns.answerResult}|${theAns.answerText}`
}
// mark this partQuestion as answered (question-chain will read this)
glass.questions[aq.questionNum-1].answerSelected = answerString;
// mark this partQuestion as duplicate if it is (question-chain will read this)
if (aq.suppressQuestion) {
glass.questions[aq.questionNum-1].suppressQuestion = true;
}
});
// advance the currentGlassIndex
this.currentGlassIndex = i;
// add answerData to current glass
glass.answerData = {
answerResult: savedPart.partNum,
answeredQuestions: savedPart.answeredQuestions
}
}
});
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
this.$watch("selectedAnswers." + glass.key, (newValue) => {
if (newValue) {
this.handleAnswerUpdates(glass.key, newValue);
}
}, {deep: true})
return glass;
});
},
},
components: {
funnelHeader,

101
src/layouts/part-questions/part-questions.vue
View file

@ -90,10 +90,9 @@ export default {
},
data() {
return {
partsQuestionsData: store.getters.pageData(fmgPageValues.PART_QUESTIONS).partsOrQuestions,
partsQuestionsData: [],
selectedAnswers: {},
currentGlassIndex: 0,
foundDuplicateQuestions: [],
};
},
computed: {
@ -109,7 +108,17 @@ export default {
},
mixins: [vehicleQuestionsMixin],
mounted() {
this.LoadInitialData();
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.partQuestionAnswers;
this.partsQuestionsData = this.pageData.partsOrQuestions.filter(x => x.partQuestions).map((glass, i) => {
// NOTE: questions for property "questions" can differ between layouts
glass.questions = glass.partQuestions;
// reset selectedAnswers for this glass
this.selectedAnswers[glass.key] = [];
// pass in: glass, i, alreadyAnsweredQuestions
return this.setupInitialData(glass, i, alreadyAnsweredQuestions);
});
},
methods: {
arePagePrerequisitesValid() {
@ -149,11 +158,11 @@ export default {
this.navigateForward(glassNameAndPartsForStore);
},
handleAnswerUpdates(key, answer) {
handleAnswerUpdates(answer) {
// only runs when all questions in a question-chain have been answered
// when selectedAnswers updates, user has completed this part's question chain and has a final answer
// (does not get run for each invididual question's answer, only when
// all relevent questions for the current part have been answered)
// all relevant questions for the current part have been answered)
/*
answer example format:
@ -172,6 +181,7 @@ export default {
// collect a list of the answered questions' numbers, needed later below
const answeredQuestionIndexes = [];
const foundDuplicateQuestions = [];
// if user has answered a question differently than anything that was preloaded,
// we need to clear out any preloaded answers
@ -284,12 +294,12 @@ export default {
thisAnsweredQuestion.suppressQuestion = true;
const thisGlassPart = "glass" + gpIndex;
if (this.foundDuplicateQuestions[thisGlassPart]) {
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredQuestion.questionSequence)) {
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredQuestion.questionSequence);
if (foundDuplicateQuestions[thisGlassPart]) {
if (!foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredQuestion.questionSequence)) {
foundDuplicateQuestions[thisGlassPart].push(thisAnsweredQuestion.questionSequence);
}
} else {
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredQuestion.questionSequence];
foundDuplicateQuestions[thisGlassPart] = [thisAnsweredQuestion.questionSequence];
}
// are there any questions left that are not suppressed?
@ -337,12 +347,12 @@ export default {
// EX answeredQuestionIndexes: [1,5,11,13]
// EX this.foundDuplicateQuestions = {
// EX foundDuplicateQuestions = {
// "glassPart1": [1],
// "glassPart2": [7, 10]
// };
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
const thisPartsDupes = foundDuplicateQuestions["glass" + answer.glassIndex];
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
const glassPartAnswered = this.partsQuestionsData[answer.glassIndex];
@ -404,75 +414,6 @@ export default {
}
},
LoadInitialData() {
// are there alreadyAnsweredQuestions?
const alreadyAnsweredQuestions = store.getters.damage.partQuestionAnswers;
this.partsQuestionsData = this.pageData.partsOrQuestions.filter(x => x.partQuestions).map((glass, i) => {
glass.key = glass.glassLocation + "-" + glass.glassName;
// NOTE: property "questions" can differ between layouts
glass.questions = glass.partQuestions;
this.selectedAnswers[glass.key] = [];
if (!alreadyAnsweredQuestions) {
glass.answerData = null;
}
alreadyAnsweredQuestions?.forEach((savedPart) => {
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) {
return;
}
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
let answerString = "";
// matches; loop through answeredQuestions for matches
savedPart.answeredQuestions.forEach((aq) => {
if (!aq.questionNum || !aq.selectedAnswerText) {
return;
}
// determine which answer was previously chosen
const theAns = glass.questions[aq.questionNum-1].answers.find((a) => {
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
});
if (theAns.nextQuestionSequence) {
answerString = `${aq.questionNum}|nextQuestion|${theAns.nextQuestionSequence}|${theAns.answerText}`
} else {
answerString = `${aq.questionNum}|answer|${theAns.answerResult}|${theAns.answerText}`
}
// mark this question as answered (question-chain will read this)
glass.questions[aq.questionNum-1].answerSelected = answerString;
// mark this question as duplicate if it is (question-chain will read this)
if (aq.suppressQuestion) {
glass.questions[aq.questionNum-1].suppressQuestion = true;
}
});
// advance the currentGlassIndex
this.currentGlassIndex = i;
// add answerData to current glass
glass.answerData = {
answerResult: savedPart.result,
answeredQuestions: savedPart.answeredQuestions
}
}
});
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
this.$watch("selectedAnswers." + glass.key, (newValue) => {
if (newValue) {
this.handleAnswerUpdates(glass.key, newValue);
}
}, {deep: true})
return glass;
});
},
},
components: {
funnelHeader,

62
src/mixins/vehicle-questions-mixin.js
View file

@ -64,6 +64,68 @@ export default {
currentPageComesAfterPage(currentPage = this.$route.query.fmgPage, fmgPage) {
return this.comparePageIndices(currentPage, fmgPage) > 0;
},
setupInitialData(glass, i, alreadyAnsweredQuestions, vm) {
glass.key = glass.glassLocation + "-" + glass.glassName;
const self = vm ?? this;
// clear answerData if no questions are already answered
if (!alreadyAnsweredQuestions) { glass.answerData = null }
alreadyAnsweredQuestions?.forEach((answeredGlass) => {
// if answeredGlass lacks any of these properties then exit
if (!answeredGlass.glassLocation ||
!answeredGlass.glassName ||
!answeredGlass.answeredQuestions ||
!answeredGlass.result && !answeredGlass.partNum) { return }
// test if glass parts match
if (glass.glassLocation === answeredGlass.glassLocation && glass.glassName === answeredGlass.glassName) {
let answerString = "";
// loop through answeredQuestions for matches
answeredGlass.answeredQuestions.forEach((aq) => {
if (!aq.questionNum || !aq.selectedAnswerText) { return }
// determine which answer was previously chosen
const chosenAns = glass.questions[aq.questionNum-1].answers.find((a) => {
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
});
// set the answerString to use for answerSelected
if (chosenAns.nextQuestionSequence) {
answerString = `${aq.questionNum}|nextQuestion|${chosenAns.nextQuestionSequence}|${chosenAns.answerText}`
} else {
answerString = `${aq.questionNum}|answer|${chosenAns.answerResult}|${chosenAns.answerText}`
}
// mark this question as answered (question-chain will read this)
glass.questions[aq.questionNum-1].answerSelected = answerString;
// mark this question as suppressed if needed (question-chain uses this)
if (aq.suppressQuestion) { glass.questions[aq.questionNum-1].suppressQuestion = true }
});
// advance the currentGlassIndex
self.currentGlassIndex = i;
const answerResult = (answeredGlass.partNum) ? answeredGlass.partNum : answeredGlass.result;
// the above logic for answerResult covers all 3 ___-questions page scenarios
// add answerData to current glass
glass.answerData = {
answerResult: answerResult,
answeredQuestions: answeredGlass.answeredQuestions
}
}
});
// Set up watch for each set of glass questions
// (updated when all questions for a glass have been answered in question-chain)
self.$watch("selectedAnswers." + glass.key, (newValue) => {
if (newValue) {
self.handleAnswerUpdates(newValue);
}
}, {deep: true})
return glass;
},
// Can't use `this` because navigateForward is also called from vin-pages-mixin
async navigateForward(partsOrQuestions, vm) {
const self = vm ?? this;

230
src/mixins/vehicle-questions-mixin.spec.js
View file

@ -155,6 +155,126 @@ describe("vehicle-questions-mixin", () => {
});
});
describe("hasChildPartQuestions", () => {
test("has no child part questions => return false", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasChildPartQuestions = wrapper.vm.hasChildPartQuestions([
{
parts: [
{
childPartQuestions: []
}
]
}
])
// Assert
expect(hasChildPartQuestions).toBe(false);
});
test("has undefined child part questions => return false", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasChildPartQuestions = wrapper.vm.hasChildPartQuestions([])
// Assert
expect(hasChildPartQuestions).toBe(false);
});
test("has child part questions => return true", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasChildPartQuestions = wrapper.vm.hasChildPartQuestions([
{
parts: [
{
childPartQuestions: [
{
"questionSequence": 1,
"questionText": "Does the rubber seal around your windshield have a chrome strip running through it?",
"answers": [
{
"answerResult": "WKT D1106 C",
"answerText": "Yes",
"nextQuestionSequence": null
},
{
"answerResult": "WKT D1106 B",
"answerText": "No",
"nextQuestionSequence": null
}
]
}
]
}
]
}
])
// Assert
expect(hasChildPartQuestions).toBe(true);
});
});
describe("hasCapabilityQuestions", () => {
test("has no capability questions => return false", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasCapabilityQuestions = wrapper.vm.hasCapabilityQuestions([
{
parts: [
{
requiresCapabilityQuestions: false
}
]
}
])
// Assert
expect(hasCapabilityQuestions).toBe(false);
});
test("has undefined capability questions => return false", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasCapabilityQuestions = wrapper.vm.hasCapabilityQuestions([])
// Assert
expect(hasCapabilityQuestions).toBe(false);
});
test("has capability questions => return true", () => {
// Arrange
const { wrapper } = setupMocks({});
// Act
const hasCapabilityQuestions = wrapper.vm.hasCapabilityQuestions([
{
parts: [
{
requiresCapabilityQuestions: true
}
]
}
])
// Assert
expect(hasCapabilityQuestions).toBe(true);
});
});
describe("currentPageComesBeforePage", () => {
const testCases = [[fmgPageValues.PART_QUESTIONS, fmgPageValues.VEHICLE_PARTS, true],
[fmgPageValues.VEHICLE_PARTS, fmgPageValues.VEHICLE_PARTS, false],
@ -195,6 +315,94 @@ describe("vehicle-questions-mixin", () => {
})
});
describe("setupInitialData", () => {
describe("should always", () => {
test("return glass with new key attribute", async () => {
// Arrange
const { wrapper } = setupMocks({});
const glass = {
"glassName": "Single",
"glassLocation": "Windshield",
};
const i = 0;
// Act
const returnedGlass = await wrapper.vm.setupInitialData(glass, i);
// Assert
expect(returnedGlass).toMatchObject({"key": "Windshield-Single"});
});
});
describe("if no alreadyAnsweredQuestions", () => {
test("should return glass with answerData of null", async () => {
// Arrange
const glass = {
"glassName": "Single",
"glassLocation": "Windshield"
};
const i = 0;
const { wrapper } = setupMocks({});
// Act
const returnedGlass = await wrapper.vm.setupInitialData(glass, i);
// Assert
expect(returnedGlass).toMatchObject({"answerData": null});
});
});
describe("if alreadyAnsweredQuestions", () => {
test("should return glass with answerResult within answerData", async () => {
// Arrange
const glass = {
"glassName": "Single",
"glassLocation": "Windshield",
"questions": [
{
"questionSequence": 1,
"questionText": "Does the rubber seal around your windshield have a chrome strip running through it?",
"answers": [
{
"answerResult": "WKT D1106 C",
"answerText": "Yes",
"nextQuestionSequence": null
},
{
"answerResult": "WKT D1106 B",
"answerText": "No",
"nextQuestionSequence": null
}
]
}
],
};
const i = 0;
const alreadyAnsweredQuestions = [
{
"glassLocation": "Windshield",
"glassName": "Single",
"partNum": "WKT D1106 C",
"answeredQuestions": [
{
"questionText": "Does the rubber seal around your windshield have a chrome strip running through it?",
"selectedAnswerText": "Yes",
"questionNum": 1
}
]
}
];
const { wrapper } = setupMocks({});
// Act
const returnedGlass = await wrapper.vm.setupInitialData(glass, i, alreadyAnsweredQuestions);
// Assert
expect(returnedGlass.answerData).toMatchObject({"answerResult": "WKT D1106 C"});
});
});
});
describe("navigateForward", () => {
describe("should go to parts-questions", () => {
test("single glass location has part question => go to parts-questions", async () => {
@ -1160,6 +1368,18 @@ describe("vehicle-questions-mixin", () => {
expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalledWith(navigationScenarios.CLICKED_BACK_WITH_NO_QUESTIONS, {"query": {"fmgPage": fmgPageValues.QUOTE}})
})
test("current page is quote and there are capability questions => go to capability questions", () => {
// Arrange
const { wrapper } = setupMocks({ fmgPage: fmgPageValues.QUOTE });
wrapper.vm.hasCapabilityQuestions = jest.fn().mockReturnValue(true);
// Act
wrapper.vm.backButtonAction();
// Assert
expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalledWith(navigationScenarios.CLICKED_BACK_WITH_CAPABILITY_QUESTIONS, {"query": {"fmgPage": fmgPageValues.QUOTE}})
})
test("current page is quote and there are part questions and molding questions => go to molding questions", () => {
// Arrange
const { wrapper } = setupMocks({ fmgPage: fmgPageValues.QUOTE });
@ -1209,7 +1429,15 @@ function setupMocks({ fmgPage = fmgPageValues.VIN_LOOKUP }) {
const baseMixin = setupMocksForJsFiles({
actionList: [{
actionName: storeActions.GET_CAPABILITY_QUESTIONS,
data: [],
data: [
{
answers: [
{
answerResult1: "testing"
}
]
}
],
}]
});

4
src/mixins/vin-pages-mixin.js
View file

@ -1,14 +1,14 @@
import { storeActions } from "@/constants/store-actions.js";
import store from "@/store";
import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
import { saveOrder } from "@/helpers/heritage-integration/order-helper.js";
import { saveSession } from "@/helpers/heritage-integration/order-helper.js";
export default {
methods: {
async navigateForwardWithSingleCarMatch() {
// If we have not already saved a session, we need to save one now before the lengthy call to getPartsOrQuestions
if (!store.getters.applicationUser.savedSessionId) {
saveOrder();
saveSession();
}
const result = await this.dispatchStoreAction(storeActions.GET_PARTS_OR_QUESTIONS);

2
src/mixins/vin-pages-mixin.spec.js
View file

@ -10,7 +10,7 @@ jest.mock("@/helpers/heritage-integration/navigation-helper", () => ({
}));
jest.mock("@/helpers/heritage-integration/order-helper.js", () => ({
saveOrder: jest.fn()
saveSession: jest.fn()
}));
describe("vin-pages-mixin", () => {

20
src/router/index.js
View file

@ -11,7 +11,7 @@ import { getDeviceIdValue } from "@/helpers/heritage-integration/cookie-helper";
// Heritage integration
import { isSavedSessionStillActive } from "@/helpers/heritage-integration/session-helper";
import { updateOrCreateFunnelCookie, getFunnelCookie, updateSessionIdCookie } from "@/helpers/heritage-integration/cookie-helper";
import { loadOrderIfPresent, saveOrder } from "@/helpers/heritage-integration/order-helper";
import { loadSessionIfPresent, saveSession } from "@/helpers/heritage-integration/order-helper";
import { getPageToRouteExistingOrderTo, navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
import baseMixin from "@/mixins/base-mixin";
@ -23,6 +23,7 @@ import { applicationConfig } from "../constants/application-config";
// Components
import quote from "@/layouts/quote/quote.vue";
import datePicker from "@/common-components/date-picker/date-picker.vue";
const routes = [
{
@ -30,6 +31,11 @@ const routes = [
name: "quote",
component: quote,
},
{
path: "/date-picker", // This is a temporary route for testing.
name: "date-picker",
component: datePicker,
},
{
path: "/",
name: "root",
@ -56,11 +62,11 @@ const routes = [
// On entering the funnel "fresh", read cookie information, decide what to do next.
if (from.redirectedFrom === undefined) {
// clear the saveOrderPromise - if it exists in the vuex store but a new instance was created
// the saveOrderPromise will no longer point to a valid promise
baseMixin.methods.dispatchStoreAction(storeActions.RESET_SAVE_ORDER_PROMISE);
const loadOrderResponse = await loadOrderIfPresent();
const pageToRedirectTo = await getPageToRouteExistingOrderTo(to, loadOrderResponse);
// clear the saveSessionPromise - if it exists in the vuex store but a new instance was created
// the saveSessionPromise will no longer point to a valid promise
baseMixin.methods.dispatchStoreAction(storeActions.RESET_SAVE_SESSION_PROMISE);
const loadSessionResponse = await loadSessionIfPresent();
const pageToRedirectTo = await getPageToRouteExistingOrderTo(to, loadSessionResponse);
// If getPageToRouteExistingOrderTo determines that the return user needs to
// go back to heritage funnel, send them there and stop our current navigation.
@ -143,7 +149,7 @@ router.afterEach((to, from) => {
// If saving on navigation is requested, check for saved SessionId or EmailAddress to determine if saving is appropriate
if (eval(to.params.isSavingNavigation)) {
if (store.getters.applicationUser.savedSessionId || store.getters.order.customer?.emailAddress) {
saveOrder();
saveSession();
}
}

38
src/store/index.js
View file

@ -71,7 +71,7 @@ const getDefaultState = () => {
eventBus: [],
pageData: {},
savedSessionTimeout: getDateForSavedSessionTimeout(),
saveOrderPromise: null,
saveSessionPromise: null,
savedSessionId: null,
crmCustomerId: null,
lastPageVisited: null,
@ -230,8 +230,8 @@ export const mutations = {
},
// applicationUser MUTATIONS
updateSaveOrderPromise(state, saveOrderPromise) {
state.applicationUser.saveOrderPromise = saveOrderPromise;
updateSaveSessionPromise(state, saveSessionPromise) {
state.applicationUser.saveSessionPromise = saveSessionPromise;
},
updateSavedSessionId(state, savedSessionId) {
state.applicationUser.savedSessionId = savedSessionId;
@ -300,8 +300,8 @@ export const mutations = {
resetState(state) {
Object.assign(state, getDefaultState());
},
resetSaveOrderPromise(state) {
state.applicationUser.saveOrderPromise = null;
resetSaveSessionPromise(state) {
state.applicationUser.saveSessionPromise = null;
},
// Misc Mutations
updateStateWithOrderInformation(state, orderInformation) {
@ -535,15 +535,15 @@ export const actions = {
resetState(context) {
context.commit(storeMutations.RESET_STATE);
},
resetSaveOrderPromise(context) {
context.commit(storeMutations.RESET_SAVE_ORDER_PROMISE);
resetSaveSessionPromise(context) {
context.commit(storeMutations.RESET_SAVE_SESSION_PROMISE);
},
// Content API Actions
getRouteInfo(context, { pageName }) {
return globalMethods.callHttpClient({
method: endpoints.GetRouteInfo.method,
endpoint: endpoints.GetRouteInfo.url,
endpoint: endpoints.GetRouteInfo.url(applicationConfig.APPLICATION_ABBREVIATION),
payload: {
pageName: pageName,
},
@ -552,13 +552,13 @@ export const actions = {
getHomepageName(context) {
return globalMethods.callHttpClient({
method: endpoints.GetHomepageInfo.method,
endpoint: endpoints.GetHomepageInfo.url,
endpoint: endpoints.GetHomepageInfo.url(applicationConfig.APPLICATION_ABBREVIATION),
});
},
getPageData(context, { pageName }) {
return globalMethods.callHttpClient({
method: endpoints.GetPageData.method,
endpoint: `${endpoints.GetPageData.url}/${pageName}`,
endpoint: endpoints.GetPageData.url(applicationConfig.APPLICATION_ABBREVIATION, pageName),
payload: {},
});
},
@ -589,7 +589,7 @@ export const actions = {
},
// Misc Actions
updateStoreWithSaveOrderResponse(context, { referralNumber, referralDate, referralCorrelationId, eon, accountNumber, savedSessionId, crmCustomerId }) {
updateStoreWithSaveSessionResponse(context, { referralNumber, referralDate, referralCorrelationId, eon, accountNumber, savedSessionId, crmCustomerId }) {
context.commit(storeMutations.UPDATE_REFERRAL_NUMBER, referralNumber);
context.commit(storeMutations.UPDATE_REFERRAL_DATE, referralDate);
context.commit(storeMutations.UPDATE_REFERRAL_CORRELATION_ID, referralCorrelationId);
@ -778,8 +778,8 @@ export const actions = {
})
},
// Order API Actions
saveOrder(context) {
// Session API Actions
saveSession(context) {
const vehicle = context.getters.vehicle;
const damage = context.getters.damage;
const order = context.state.order;
@ -787,8 +787,8 @@ export const actions = {
const lineItems = context.state.order.lineItems;
return globalMethods.callHttpClient({
method: endpoints.SaveOrder.method,
endpoint: endpoints.SaveOrder.url,
method: endpoints.SaveSession.method,
endpoint: endpoints.SaveSession.url,
payload: {
vehicle: {
carId: vehicle.carId,
@ -835,10 +835,10 @@ export const actions = {
},
});
},
loadOrder(context, { referralNumber, referralDate, referralCorrelationId, accountNumber }) {
loadSession(context, { referralNumber, referralDate, referralCorrelationId, accountNumber }) {
return globalMethods.callHttpClient({
method: endpoints.LoadOrder.method,
endpoint: endpoints.LoadOrder.url,
method: endpoints.LoadSession.method,
endpoint: endpoints.LoadSession.url,
payload: {
referralNumber: referralNumber?.toString(),
referralDate: referralDate,
@ -846,7 +846,7 @@ export const actions = {
accountNumber: accountNumber?.toString()
},
}).then((response) => {
// clear the state if the existing EON does not equal what is returned from loadOrder
// clear the state if the existing EON does not equal what is returned from loadSession
if (context.state.order.eon && context.state.order.eon != response.data.eon) {
context.commit(storeMutations.RESET_STATE);
}

20
src/store/store.spec.js
View file

@ -595,7 +595,7 @@ describe("Actions", () => {
expect(response.data).toEqual({ imageUrl: "https://test.com" });
});
it("saveOrder action, returns order information", async () => {
it("saveSession action, returns order information", async () => {
// Arrange
const context = state;
@ -623,14 +623,14 @@ describe("Actions", () => {
});
// Act
const response = await actions.saveOrder(context);
const response = await actions.saveSession(context);
// Assert
expect(response.data).toEqual({ referralNumber: 123 });
});
it("loadOrder action, returns order information, calls mutation", async () => {
it("loadSession action, returns order information, calls mutation", async () => {
// Arrange
const context = state;
@ -643,14 +643,14 @@ describe("Actions", () => {
context.commit = commit;
// Act
const response = await actions.loadOrder(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
const response = await actions.loadSession(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
// Assert
expect(response.data).toEqual({ referralNumber: 123 });
expect(commit).toBeCalledWith(storeMutations.UPDATE_STATE_WITH_ORDER_INFORMATION, { "referralNumber": 123 });
});
it("loadOrder: state doesn't have EON => do not reset state", async () => {
it("loadSession: state doesn't have EON => do not reset state", async () => {
// Arrange
const context = state;
@ -665,14 +665,14 @@ describe("Actions", () => {
}
// Act
const response = await actions.loadOrder(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
const response = await actions.loadSession(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
// Assert
expect(response.data.eon).toEqual("123");
expect(context.commit).not.toBeCalledWith(storeMutations.RESET_STATE);
});
it("loadOrder eon doesn't match eon in state => reset state", async () => {
it("loadSession eon doesn't match eon in state => reset state", async () => {
// Arrange
const context = state;
@ -688,14 +688,14 @@ describe("Actions", () => {
}
// Act
const response = await actions.loadOrder(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
const response = await actions.loadSession(context, { referralNumber: "123", referralDate: new Date().toUTCString(), referralCorrelationId: "xxx-xxx-xxx" });
// Assert
expect(response.data.eon).toEqual("123");
expect(context.commit).toBeCalledWith(storeMutations.RESET_STATE);
});
it("updateStoreWithSaveOrderResponse, should call commit six times", () => {
it("updateStoreWithSaveSessionResponse, should call commit six times", () => {
// Arrange
const context = state;
const commit = jest.fn();
@ -703,7 +703,7 @@ describe("Actions", () => {
context.commit = commit;
// Act
actions.updateStoreWithSaveOrderResponse(context,
actions.updateStoreWithSaveSessionResponse(context,
{
referralNumber: "123",
referralDate: new Date().toUTCString(),

2
vue.config.js
View file

@ -1,5 +1,5 @@
process.env.VUE_APP_CONSUMER_CF_DISTRO =
"https://digitalapi.dev.sagaws.net";
"https://digitalapi.dev.safelite.io";
process.env.VUE_APP_HERITAGE_FUNNEL =
"http://localhost:38000/default.aspx";
process.env.VUE_APP_GOOGLE_PLACES_API_KEY =