Merge remote-tracking branch 'origin/develop' into feature/digital/SSR-1063

This commit is contained in:
Matt Caimi 2024-02-13 09:42:18 -05:00
commit 042dfd848b
13 changed files with 96 additions and 56 deletions

View file

@ -385,17 +385,10 @@ export default {
{},
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
} else if (useMainStore().issConfig.enableTPAFlow) {
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED,
this.$route,
{},
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
} else {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.TPANotEnabled());
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.RequestCallback());
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED,
navigationScenarios.CLICKED_FORWARD_WITH_NON_SAFELITE_SHOP,
this.$route,
{},
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }

View file

@ -117,7 +117,7 @@ export default {
span {
&.small {
font-size: 0.75rem;
font-size: $font-size-xsm;
color: $gray-550;
}
}

View file

@ -1,13 +1,14 @@
import { shallowMount } from '@vue/test-utils';
import { getMountOptions } from '@/helpers/unit-test-helper.js';
import widgetFields from '@/constants/cms-widget-fields.js';
import paymentMethodQuestion from '@/layouts/payment-method/payment-method-question/payment-method-question.vue';
import baseMixin from '@/mixins/base-mixin';
let cmsContent;
const mockCmsContent = {
QuestionText: 'Choose a payment option',
Answers: [
[widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT]: 'Choose a payment option',
[widgetFields.INPUT_QUESTION_WIDGET.ANSWERS]: [
{
Name: 'NameA',
Text: 'TextA',
@ -39,6 +40,7 @@ function setupMocks(customMountOptions) {
const mockMixin = {
methods: {
...baseMixin.methods,
getCmsContent: jest.fn((widgetName, cmsFieldName) => cmsContent[cmsFieldName])
}
};

View file

@ -49,7 +49,7 @@ export default {
return this.getCmsContent(this.cmsWidgetName, widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT);
},
paymentMethodAnswerData() {
const cmsData = this.getAnswersNullSafe(this.cmsWidgetName);
const cmsData = this.getInputQuestionWidgetAnswersNullSafe(this.cmsWidgetName);
return cmsData.map((answer) => ({
buttonLabel: answer.Text,
@ -59,17 +59,6 @@ export default {
buttonImage: answer.AnswerImageUrl
}));
}
},
methods: {
getAnswersNullSafe(widgetName) {
const rawData = this.getCmsContent(widgetName, widgetFields.INPUT_QUESTION_WIDGET.ANSWERS);
if (!rawData) {
return [];
}
return rawData;
}
}
};
</script>

View file

@ -53,14 +53,10 @@ import { useMainStore } from '@/store';
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import paymentMethods from '@/constants/payment-method-constants';
import globalRules from '@/constants/global-rules';
import { Form, defineRule } from 'vee-validate';
import { Form } from 'vee-validate';
import { required } from '@/helpers/validation-rules';
import errorMessages from '@/constants/error-messages';
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
defineRule(globalRules.OPTION_REQUIRED, required(errorMessages.OPTION_REQUIRED));
export default {
name: 'payment-method',
components: {
@ -210,9 +206,6 @@ export default {
this.$refs.siteFooter.updateButtonText(newValue);
},
async forwardButtonAction() {
// Multiple paths based on payment
console.log('forward button hit...');
await useMainStore().savePaymentMethodChoice(this.paymentMethod);
}
}

View file

@ -7,6 +7,7 @@ import { useMainStore } from '@/store';
import { shallowMount } from '@vue/test-utils';
import { getMountOptions } from '@/helpers/unit-test-helper.js';
import { getDamageDisplayContent } from '@/helpers/damage-review-content-generator.js';
import baseMixin from '@/mixins/base-mixin';
jest.mock('@/helpers/damage-review-content-generator.js', () => ({
getDamageDisplayContent: jest.fn(),
@ -16,6 +17,7 @@ jest.mock('@/helpers/damage-review-content-generator.js', () => ({
let cmsContent;
const mockMixin = {
methods: {
...baseMixin.methods,
getCmsContent: jest.fn((widgetName, cmsFieldName) => cmsContent?.[widgetName]?.[cmsFieldName] ?? '')
}
};

View file

@ -33,20 +33,14 @@ export default {
},
driverSideDamageAnswers() {
const answerContent = getLocationAnswer(damageLocationsSelected.DRIVER, this.locationAnswers);
return this.getAnswersNullSafe(answerContent?.SubWidgetName);
return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName);
},
passengerSideDamageAnswers() {
const answerContent = getLocationAnswer(damageLocationsSelected.PASSENGER, this.locationAnswers);
return this.getAnswersNullSafe(answerContent?.SubWidgetName);
return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName);
},
locationAnswers() {
return this.getAnswersNullSafe(this.damageLocationsWidgetName);
}
},
methods: {
getAnswersNullSafe(widgetName) {
const rawAnswers = this.getCmsContent(widgetName, 'Answers');
return rawAnswers || [];
return this.getInputQuestionWidgetAnswersNullSafe(this.damageLocationsWidgetName);
}
}
};

View file

@ -38,6 +38,8 @@
inputId="phoneNumber"
:cmsWidgetName="widget.phoneNumberQuestion"
isRequired
mask="###-###-####"
disableAutoFill
:validationRules="rules.phoneNumber" />
</template>
</modal>

View file

@ -11,6 +11,7 @@ import settleAllPromises from '@/helpers/layout-helper.js';
import widgetFields from '@/constants/cms-widget-fields.js';
import { toTitleCase, formatAddress, toDisplayPhoneNumber } from '@/helpers/text-helper.js';
import { getDamageDisplayContent } from '@/helpers/damage-review-content-generator.js';
import baseMixin from '@/mixins/base-mixin';
// Mock fetchCmsContentForPage
jest.mock('@/helpers/cms-content-helper', () => ({
@ -35,6 +36,12 @@ jest.mock('@/helpers/damage-review-content-generator.js', () => ({
// Mock our module for promises.
jest.mock('@/helpers/layout-helper.js', () => jest.fn());
const mockMixin = {
methods: {
...baseMixin.methods
}
};
function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRunAfterInitializingStore = () => {}) {
const mountOptions = getMountOptions({
router: {
@ -52,6 +59,7 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu
mountOptions.global.plugins = [testingPinia];
mountOptions.data = () => (initialData);
mountOptions.mixins = [mockMixin];
const apiResponses = { cmsContent: {} };
@ -775,14 +783,14 @@ describe('tpa-submit', () => {
[[], []],
[undefined, []],
[null, []]
])('getAnswersNullSafe', (rawAnswers, expected) => {
])('getInputQuestionWidgetAnswersNullSafe', (rawAnswers, expected) => {
// Arrange
const widgetName = 'WidgetName';
const { wrapper } = getMountedComponent();
wrapper.vm.getCmsContent = jest.fn().mockImplementationOnce(() => rawAnswers);
// Act
const result = wrapper.vm.getAnswersNullSafe(widgetName);
const result = wrapper.vm.getInputQuestionWidgetAnswersNullSafe(widgetName);
// Assert
expect(result).toEqual(expected);

View file

@ -208,15 +208,15 @@ export default {
return [line];
},
locationAnswers() {
return this.getAnswersNullSafe(this.widget.damageLocations);
return this.getInputQuestionWidgetAnswersNullSafe(this.widget.damageLocations);
},
driverSideDamageAnswers() {
const answerContent = getLocationAnswer(damageLocationsSelected.DRIVER, this.locationAnswers);
return this.getAnswersNullSafe(answerContent?.SubWidgetName);
return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName);
},
passengerSideDamageAnswers() {
const answerContent = getLocationAnswer(damageLocationsSelected.PASSENGER, this.locationAnswers);
return this.getAnswersNullSafe(answerContent?.SubWidgetName);
return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName);
},
getDamageLines() {
const { glassToReplace, isRepair } = useMainStore().order.damage;
@ -285,10 +285,6 @@ export default {
return null;
}
},
getAnswersNullSafe(widgetName) {
const rawAnswers = this.getCmsContent(widgetName, 'Answers');
return rawAnswers || [];
},
openContactDetailsModal() {
this.$refs.contactDetailsDrawer.openModal();
}

View file

@ -5,6 +5,7 @@ import vehicleCategories from '@/constants/vehicle-categories.js';
import queryStrings from '@/constants/query-strings';
import dynamicStrings from '@/constants/dynamic-strings';
import routerParams from '@/router/router-constants/router-params';
import widgetFields from '@/constants/cms-widget-fields.js';
export default {
data() {
@ -19,6 +20,10 @@ export default {
getCmsContent(widgetName, fieldName) {
return this.$root.cmsContentByWidget?.[widgetName]?.[fieldName] ? this.$root.cmsContentByWidget[widgetName][fieldName] : '';
},
getInputQuestionWidgetAnswersNullSafe(widgetName) {
const rawAnswers = this.getCmsContent(widgetName, widgetFields.INPUT_QUESTION_WIDGET.ANSWERS);
return rawAnswers || [];
},
getFooterInfoBoxHeight() {
const footerInfoBox = document.querySelector('.footer#infoBox');
return footerInfoBox ? footerInfoBox.offsetHeight : 0;

View file

@ -1,5 +1,6 @@
import baseMixin from '@/mixins/base-mixin';
import { shallowMount } from '@vue/test-utils';
import widgetFields from '@/constants/cms-widget-fields.js';
describe('base-mixin', () => {
it('should set and get cms content', () => {
@ -20,4 +21,63 @@ describe('base-mixin', () => {
const localThis = { cmsWidgetName: 'testWidget' };
expect(baseMixin.computed.cssClassNameForCmsWidget.call(localThis)).toBe('widget-name-testWidget');
});
it('getInputQuestionWidgetAnswersNullSafe returns an empty array when the input question widget has no answers', () => {
// Arrange
const widgetName = 'inputQuestionWidget';
const wrapper = shallowMount(baseMixin, {
propsData: {
cmsContentByWidget: {}
}
});
const cmsContent = {
[widgetName]: {
[widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT]: 'Choose an option',
[widgetFields.INPUT_QUESTION_WIDGET.ANSWERS]: []
}
};
wrapper.componentVM.setCmsContent(cmsContent);
// Act
const answers = wrapper.componentVM.getInputQuestionWidgetAnswersNullSafe(widgetName);
// Assert
expect(answers).not.toBeNull(); // Check that answers is not null
expect(Array.isArray(answers)).toBeTruthy(); // Check that answers is an array
expect(answers).toHaveLength(0); // Check that answers is empty
});
it('getInputQuestionWidgetAnswersNullSafe returns a non-empty array when the input question widget has answers', () => {
// Arrange
const widgetName = 'inputQuestionWidget';
const wrapper = shallowMount(baseMixin, {
propsData: {
cmsContentByWidget: {}
}
});
const cmsContent = {
[widgetName]: {
[widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT]: 'Choose an option',
[widgetFields.INPUT_QUESTION_WIDGET.ANSWERS]: [
{
Name: 'NameA',
Text: 'TextA'
},
{
Name: 'NameB',
Text: 'TextB'
}
]
}
};
wrapper.componentVM.setCmsContent(cmsContent);
// Act
const answers = wrapper.componentVM.getInputQuestionWidgetAnswersNullSafe(widgetName);
// Assert
expect(answers).not.toBeNull(); // Check that answers is not null
expect(Array.isArray(answers)).toBeTruthy(); // Check that answers is an array
expect(answers).not.toHaveLength(0); // Check that answers is not empty
});
});

View file

@ -509,11 +509,7 @@ const routingTable = () => [
destinationIssPageValue: issPageValues.SERVICE_LOCATION
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED,
destinationIssPageValue: issPageValues.TPA_SEARCH
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED,
scenario: navigationScenarios.CLICKED_FORWARD_WITH_NON_SAFELITE_SHOP,
destinationIssPageValue: issPageValues.BAILOUT_PAGE
},
{