From 597db2547b7aa0ca1a83cc221f1d763f18c26b57 Mon Sep 17 00:00:00 2001 From: hiteshkumar87 Date: Fri, 9 Feb 2024 16:58:39 +0530 Subject: [PATCH] Email optional make email optional --- src/constants/experiments.js | 1 + .../textbox-question/textbox-question.vue | 8 +++++++- .../address-lookup/address-lookup.spec.js | 13 +++++++++++++ src/layouts/address-lookup/address-lookup.vue | 6 +++++- .../customer-questions/customer-questions.vue | 5 ++++- src/layouts/estimate/estimate.spec.js | 19 +++++++++++++++---- src/layouts/estimate/estimate.vue | 5 +++-- .../license-plate-lookup.spec.js | 13 ++++++++++++- .../license-plate-lookup.vue | 4 +++- src/layouts/vin-lookup/vin-lookup.spec.js | 7 +++++++ src/layouts/vin-lookup/vin-lookup.vue | 5 +++-- src/mixins/vin-pages-mixin.js | 13 ++++++++++++- 12 files changed, 85 insertions(+), 14 deletions(-) diff --git a/src/constants/experiments.js b/src/constants/experiments.js index b702b11bb..18ca6387d 100644 --- a/src/constants/experiments.js +++ b/src/constants/experiments.js @@ -8,6 +8,7 @@ const experimentSettings = { DISPLAY_AVAILABILITY_INDICATORS: "DisplayAvailabilityIndicators", PIA_EXPERIENCE: "PIA Experience", SUBMIT_ORDER_ENABLE_PIA: "SubmitOrder_Enable_PIA", + IS_EMAIL_OPTIONAL: "isEmailOptional", }; const experimentTriggers = { diff --git a/src/digital-components/textbox-question/textbox-question.vue b/src/digital-components/textbox-question/textbox-question.vue index e30b7563e..2bc8071af 100644 --- a/src/digital-components/textbox-question/textbox-question.vue +++ b/src/digital-components/textbox-question/textbox-question.vue @@ -125,6 +125,10 @@ export default { hideInput: Boolean, centerErrorMessage: Boolean, keyDownHandler: Function, + isEmailOptional: { + type: Boolean, + default: false, + }, }, setup(props) { const uuid = uuidv4(); @@ -202,7 +206,9 @@ export default { }, computed: { questionText() { - return this.getCmsContent(this.cmsWidgetName, "QuestionText"); + return this.isEmailOptional + ? this.getCmsContent(this.cmsWidgetName, "QuestionText") + " (optional)" + : this.getCmsContent(this.cmsWidgetName, "QuestionText"); }, value: { get: function () { diff --git a/src/layouts/address-lookup/address-lookup.spec.js b/src/layouts/address-lookup/address-lookup.spec.js index cce68d793..731e664dc 100644 --- a/src/layouts/address-lookup/address-lookup.spec.js +++ b/src/layouts/address-lookup/address-lookup.spec.js @@ -10,6 +10,7 @@ import { storeMutations } from "@/constants/store-mutations"; import { navigationScenarios } from "@/router/router-constants/navigation-scenarios"; import store from "@/store"; import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper"; +import { experimentSettings } from "@/constants/experiments"; jest.mock("@/helpers/damage-helper", () => ({ isGlassAvailableForCarId: jest.fn().mockImplementation(() => true), @@ -641,6 +642,17 @@ describe("address-lookup.vue", () => { }); }); +const mockMixin = { + methods: { + getSettingValue: jest.fn((settingName) => { + if (settingName === experimentSettings.IS_EMAIL_OPTIONAL) { + return "true"; + } + return "false"; + }), + }, +}; + function setupMocks({ isZipValid = true, isZipServiceable = true, @@ -709,6 +721,7 @@ function setupMocks({ }, }, }, + mixins: [mockMixin], }) ); diff --git a/src/layouts/address-lookup/address-lookup.vue b/src/layouts/address-lookup/address-lookup.vue index de0e8d5aa..807bdc5ce 100644 --- a/src/layouts/address-lookup/address-lookup.vue +++ b/src/layouts/address-lookup/address-lookup.vue @@ -20,7 +20,11 @@ - + + :isRequired="!isEmailOptional" + :validationRules="validationRules" + :isEmailOptional="isEmailOptional" />
@@ -79,6 +81,7 @@ export default { }), }, validationRules: String, + isEmailOptional: Boolean, }, computed: { customerModel: { diff --git a/src/layouts/estimate/estimate.spec.js b/src/layouts/estimate/estimate.spec.js index 7d395e88d..8ccc7446f 100644 --- a/src/layouts/estimate/estimate.spec.js +++ b/src/layouts/estimate/estimate.spec.js @@ -11,7 +11,7 @@ import { settleAllPromises } from "@/helpers/layout-helper.js"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import baseMixin from "../../mixins/base-mixin"; import { vinLookupMethodSelections } from "@/constants/vin-lookup-method-selections.js"; - +import { experimentSettings } from "@/constants/experiments"; // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), @@ -273,12 +273,24 @@ function setupMocks({ Answers: cmsAnswers, FunnelFooterWidget: FunnelFooterWidget, }; - + const mockMixin = { + methods: { + getSettingValue: jest.fn((settingName) => { + if (settingName === experimentSettings.IS_EMAIL_OPTIONAL) { + return "true"; + } + return "false"; + }), + }, + }; const apiPromise = Promise.resolve({ cmsContent }); settleAllPromises.mockImplementation(() => apiPromise); fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); - const mountOptions = getMountOptions({ ...mountOptionsMockData, mixins: [baseMixin] }); + const mountOptions = getMountOptions({ + ...mountOptionsMockData, + mixins: [baseMixin, mockMixin], + }); mountOptions["attachTo"] = document.body; const wrapper = shallowMount(estimate, mountOptions); @@ -286,6 +298,5 @@ function setupMocks({ wrapper.vm.getZipCodeData = jest .fn() .mockReturnValue({ isValid: true, isServiceable: true, state: "OH" }); - return { wrapper, apiPromise }; } diff --git a/src/layouts/estimate/estimate.vue b/src/layouts/estimate/estimate.vue index 410c4d325..d2766f730 100644 --- a/src/layouts/estimate/estimate.vue +++ b/src/layouts/estimate/estimate.vue @@ -52,9 +52,10 @@ cmsWidgetName="EmailAddressQuestionWidget" v-model="emailAddress" inputId="emailAddress" - isRequired + :isRequired="!IsEmailOptional" disableAutoFill - validationRules="email-address-required|email-address-format" /> + :validationRules="EmailValidationRules" + :isEmailOptional="IsEmailOptional" /> "loader.gif"); jest.mock("@/assets/img/windshield.png", () => "windshield.png"); @@ -691,12 +692,22 @@ function setupMocks({ ], }; + const mockMixin = { + methods: { + getSettingValue: jest.fn((settingName) => { + if (settingName === experimentSettings.IS_EMAIL_OPTIONAL) { + return "true"; + } + return "false"; + }), + }, + }; const apiPromise = Promise.resolve(apiResponses); settleAllPromises.mockImplementation(() => apiPromise); fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); - const mountOptions = getMountOptions(mountOptionsMockData); + const mountOptions = getMountOptions({ ...mountOptionsMockData, mixins: [mockMixin] }); mountOptions["attachTo"] = document.body; // append wrapper to document.body to test DOM methods const wrapper = shallowMount(licensePlateLookup, mountOptions); diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue index 811dbea7b..37d93cc8b 100644 --- a/src/layouts/license-plate-lookup/license-plate-lookup.vue +++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue @@ -34,7 +34,9 @@ cmsWidgetName="EmailAddressQuestionWidget" v-model="email" customInputId="email" - validationRules="email-address-required|email-address-format" /> + :isRequired="!IsEmailOptional" + :validationRules="EmailValidationRules" + :isEmailOptional="IsEmailOptional" /> diff --git a/src/layouts/vin-lookup/vin-lookup.spec.js b/src/layouts/vin-lookup/vin-lookup.spec.js index f25bc68db..1d7d3f493 100644 --- a/src/layouts/vin-lookup/vin-lookup.spec.js +++ b/src/layouts/vin-lookup/vin-lookup.spec.js @@ -3,6 +3,7 @@ import vinLookup from "./vin-lookup.vue"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js"; import { settleAllPromises } from "@/helpers/layout-helper.js"; +import { experimentSettings } from "@/constants/experiments"; import store from "@/store"; @@ -378,5 +379,11 @@ function mockOutStubFunctions(wrapper) { const mockMixin = { methods: { getCmsContent: jest.fn(() => "placeholder CMS content"), + getSettingValue: jest.fn((settingName) => { + if (settingName === experimentSettings.IS_EMAIL_OPTIONAL) { + return "true"; + } + return "false"; + }), }, }; diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue index c809bae70..ae197aeb0 100644 --- a/src/layouts/vin-lookup/vin-lookup.vue +++ b/src/layouts/vin-lookup/vin-lookup.vue @@ -53,8 +53,9 @@ cmsWidgetName="EmailAddressQuestionWidget" v-model="emailAddress" customInputId="emailAddress" - isRequired - validationRules="email-address-required|email-address-format" /> + :isRequired="!IsEmailOptional" + :validationRules="EmailValidationRules" + :isEmailOptional="IsEmailOptional" /> diff --git a/src/mixins/vin-pages-mixin.js b/src/mixins/vin-pages-mixin.js index a0a435000..e56b93e27 100644 --- a/src/mixins/vin-pages-mixin.js +++ b/src/mixins/vin-pages-mixin.js @@ -2,8 +2,19 @@ import { storeActions } from "@/constants/store-actions.js"; import store from "@/store"; import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin"; import { saveSession } from "@/helpers/heritage-integration/order-helper.js"; - +import { experimentSettings } from "@/constants/experiments"; export default { + computed: { + IsEmailOptional() { + const emailOptional = this.getSettingValue(experimentSettings.IS_EMAIL_OPTIONAL); + return emailOptional === "true"; + }, + EmailValidationRules() { + return this.IsEmailOptional + ? "email-address-format" + : "email-address-required|email-address-format"; + }, + }, methods: { async navigateForwardWithSingleCarMatch() { const pageName = this.$options?.name;