revisions based on PR feedback

This commit is contained in:
Katie Kroell 2023-09-15 14:58:09 -04:00
parent 96462fd087
commit f21a75f5d7
3 changed files with 68 additions and 59 deletions

View file

@ -30,12 +30,22 @@ describe('policyEndorsements.vue', () => {
// Assert // Assert
expect(siteSubHeader.exists()).toBe(true); expect(siteSubHeader.exists()).toBe(true);
}); });
test('Should render buttonQuestion component', () => { test('Should render schoolProperty buttonQuestion component', () => {
// Arrange // Arrange
const wrapper = shallowMount(policyEndorsements, getMountOptions()); const wrapper = shallowMount(policyEndorsements, getMountOptions());
// Act // Act
const buttonQuestion = wrapper.findComponent({ ref: 'endorsementQuestion' }); const buttonQuestion = wrapper.findComponent({ ref: 'schoolPropertyQuestion' });
// Assert
expect(buttonQuestion.exists()).toBe(true);
});
test('Should render parkingLot buttonQuestion component', () => {
// Arrange
const wrapper = shallowMount(policyEndorsements, getMountOptions());
// Act
const buttonQuestion = wrapper.findComponent({ ref: 'parkingLotQuestion' });
// Assert // Assert
expect(buttonQuestion.exists()).toBe(true); expect(buttonQuestion.exists()).toBe(true);
@ -85,7 +95,6 @@ describe('policyEndorsements.vue', () => {
expect(wrapper.vm.$router.navigate) expect(wrapper.vm.$router.navigate)
.toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined); .toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
}); });
// *TO DO: once service is ready, revise this test to ensure data is saved to the store
test('Forward button clicked saves endorsement question answers', () => { test('Forward button clicked saves endorsement question answers', () => {
// Arrange // Arrange
const mountOptions = getMountOptions({ const mountOptions = getMountOptions({
@ -96,13 +105,14 @@ describe('policyEndorsements.vue', () => {
plugins: [createTestingPinia()] plugins: [createTestingPinia()]
} }
}); });
const wrapper = shallowMount(policyEndorsements, mountOptions); const wrapper = shallowMount(policyEndorsements, mountOptions);
// Act // Act
wrapper.vm.forwardButtonAction(); wrapper.vm.forwardButtonAction();
// Assert // Assert
expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalled(); expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalledWith(wrapper.vm.questionAnswersArray);
}); });
}); });
}); });

View file

@ -4,48 +4,50 @@
v-slot="{ meta }" v-slot="{ meta }"
@submit="onSubmit" @submit="onSubmit"
@invalidSubmit="onInvalidSubmit"> @invalidSubmit="onInvalidSubmit">
<div class="page-container-grouped-styles"> <div
class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative"> <div class="fade-on-route-transition position-relative">
<siteHeader <siteHeader
ref="siteHeader" ref="siteHeader"
cmsWidgetName="SiteHeaderWidget" /> cmsWidgetName="SiteHeaderWidget" />
<div class="container-fluid mt-0 px-5"> <div class="container-fluid mt-0 px-5">
<siteSubHeader <siteSubHeader
ref="siteSubHeader" ref="siteSubHeader"
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
class="mt-5" /> class="mt-5" />
<buttonQuestion <buttonQuestion
ref="endorsementQuestion" ref="schoolPropertyQuestion"
v-model="schoolPropertyAnswer" v-model="schoolPropertyAnswer"
class="radioQuestion windshield-chip-count-question mb-4" class="radioQuestion windshield-chip-count-question mb-4"
cmsWidgetName="SchoolPropertyQuestion" cmsWidgetName="SchoolPropertyQuestion"
:questionText="schoolPropertyQuestionText" :questionText="schoolPropertyQuestionText"
:answers="schoolPropertyAnswersFromCms" :answers="schoolPropertyAnswersFromCms"
groupName="schoolProperty" groupName="schoolProperty"
buttonID="schoolPropertyQuestion" buttonID="schoolPropertyQuestion"
buttonTypeString="listButtonHorizontal" buttonTypeString="listButtonHorizontal"
isRequired isRequired
:validationRules="rules.selectionRequired"> :validationRules="rules.selectionRequired">
</buttonQuestion> </buttonQuestion>
<buttonQuestion <buttonQuestion
v-model="parkingLotAnswer" ref="parkingLotQuestion"
class="radioQuestion windshield-chip-count-question" v-model="parkingLotAnswer"
cmsWidgetName="ParkingLotQuestion" class="radioQuestion windshield-chip-count-question"
:questionText="parkingLotQuestionText" cmsWidgetName="ParkingLotQuestion"
:answers="parkingLotAnswersFromCms" :questionText="parkingLotQuestionText"
groupName="parkingLot" :answers="parkingLotAnswersFromCms"
buttonID="parkingLotQuestion" groupName="parkingLot"
buttonTypeString="listButtonHorizontal" buttonID="parkingLotQuestion"
isRequired buttonTypeString="listButtonHorizontal"
:validationRules="rules.selectionRequired"> isRequired
</buttonQuestion> :validationRules="rules.selectionRequired">
<siteFooter </buttonQuestion>
ref="siteFooter" <siteFooter
class="pt-5" ref="siteFooter"
cmsWidgetName="SiteFooterWidget" class="pt-5"
:isForwardActionDisabled="!meta.valid" cmsWidgetName="SiteFooterWidget"
@forwardClicked="forwardButtonAction" :isForwardActionDisabled="!meta.valid"
@backClicked="backButtonAction" /> @forwardClicked="forwardButtonAction"
@backClicked="backButtonAction" />
</div> </div>
</div> </div>
</div> </div>
@ -95,6 +97,7 @@ export default {
emits: ['update:modelValue'], emits: ['update:modelValue'],
data() { data() {
return { return {
questionAnswersArray: [],
schoolPropertyAnswer: '', schoolPropertyAnswer: '',
parkingLotAnswer: '', parkingLotAnswer: '',
rules: { rules: {
@ -122,10 +125,8 @@ export default {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
}, },
async forwardButtonAction() { async forwardButtonAction() {
// manually creating the array for now, will revise once service returns questions // TO DO: remove hard coding and update data format once service returns endorsement questions
const questionAnswersArray = []; this.questionAnswersArray.push(
questionAnswersArray.push(
{ {
questionNum: 1, questionNum: 1,
questionText: this.schoolPropertyQuestionText, questionText: this.schoolPropertyQuestionText,
@ -139,7 +140,7 @@ export default {
); );
// save answers to store as order.policy.endorsementQuestionAnswers // save answers to store as order.policy.endorsementQuestionAnswers
useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray); useMainStore().saveEndorsementQuestionAnswers(this.questionAnswersArray);
return this.navigateForward(); return this.navigateForward();
}, },
@ -156,13 +157,13 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
:deep .subheader-primary { :deep .subheader-primary {
margin-bottom: 0.5rem; margin-bottom: map-get($spacers, 3);
} }
:deep .subheader-secondary { :deep .subheader-secondary {
p { p {
font-size: 0.875rem; font-size: $h6-font-size;
line-height: 1.5rem; line-height: map-get($spacers, 5);
} }
} }
@ -173,19 +174,19 @@ export default {
justify-content: left !important; justify-content: left !important;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
margin-bottom: 1.5rem; margin-bottom: map-get($spacers, 5);
} }
:deep .question-text { :deep .question-text {
& > span { & > span {
text-align: left; text-align: left;
line-height: 1.5rem; line-height: map-get($spacers, 5);
} }
margin-bottom: 0.5rem; margin-bottom: map-get($spacers, 2);
} }
:deep div.question-text.d-flex { :deep div.question-text.d-flex {
margin-top: 1rem; margin-top: map-get($spacers, 4);
} }
</style> </style>

View file

@ -118,11 +118,11 @@ export default {
? vehicle?.coverages[0].deductible ? vehicle?.coverages[0].deductible
: 0; : 0;
}, },
endorsementsForSelectedVehicle() { selectedVehicleHasEndorsements() {
const vehicle = this.policyVehicles.find((policyVehicle) => const vehicle = this.policyVehicles.find((policyVehicle) =>
policyVehicle?.vin === this.selectedVehicleVin); policyVehicle?.vin === this.selectedVehicleVin);
if (!vehicle) { if (!vehicle) {
return undefined; return false;
} }
return vehicle.endorsements?.length > 0; return vehicle.endorsements?.length > 0;
}, },
@ -206,12 +206,10 @@ export default {
{}, {},
{} {}
); );
} else if (this.endorsementsForSelectedVehicle) { } else if (this.selectedVehicleHasEndorsements) {
this.$router.navigate( this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS, this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
this.$route, this.$route
{},
{}
); );
} else { } else {
this.$router.navigate( this.$router.navigate(