CASH-376 fix for error message appearing when address modal is open

src/digital-components/modal/modal.vue

@@ -119,12 +119,14 @@ export default {
         },
         onModalOpened() {
             this.onModalOpenedCallback?.();
+            this.$emit("isModalOpened", true);
         },
         onModalClosed() {
             this.resetButtonStyle();
             this.onModalClosedCallback?.();
             if (this.suppressPageScroll)
                 document.querySelector("body").classList.remove("prevent-modal-scroll");
+            this.$emit("isModalOpened", false);
         },
         openModal() {
             if (this.suppressPageScroll)

src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue

@@ -97,6 +97,7 @@ export default {
         "updated-contains-military-base",
         "updated-bill-to-account-number",
         "setMobileLocationAndProceed",
+        "updated-modal-opened",
     ],
     data() {
         return {
@@ -228,6 +229,7 @@ export default {
         },
         setModalStatus(isOpened) {
             this.isModalOpened = isOpened;
+            this.$emit("updated-modal-opened", isOpened);
         },
         closeModal() {
             this.modal.closeModal();

src/layouts/service-location/service-location.spec.js

@@ -343,7 +343,7 @@ describe("service-location.vue", () => {
                     zipCode: "43054",
                 },
                 isVehicleProtected: true,
-                isMobileSelected: true,
+                isMobileSelectedAndModalClosed: true,
             };
             wrapper.vm.mobileLocationQuestions = mobileLocationQuestions;
 
@@ -356,7 +356,7 @@ describe("service-location.vue", () => {
                     zipCode: "61606",
                 },
                 isVehicleProtected: null,
-                isMobileSelected: false,
+                isMobileSelectedAndModalClosed: false,
             };
 
             // Act
@@ -459,7 +459,7 @@ describe("service-location.vue", () => {
                     zipCode: "",
                 },
                 isVehicleProtected: null,
-                isMobileSelected: false,
+                isMobileSelectedAndModalClosed: false,
             };
             wrapper.vm.mobileLocationQuestions = mobileLocationQuestions;
             const newMobileLocationQuestions = {
@@ -471,7 +471,7 @@ describe("service-location.vue", () => {
                     zipCode: "43054",
                 },
                 isVehicleProtected: true,
-                isMobileSelected: true,
+                isMobileSelectedAndModalClosed: true,
             };
 
             wrapper.vm.closeModalAction = jest.fn();
@@ -521,7 +521,7 @@ describe("service-location.vue", () => {
                     zipCode: "",
                 },
                 isVehicleProtected: null,
-                isMobileSelected: false,
+                isMobileSelectedAndModalClosed: false,
                 mobileFeePart: null,
             };
             wrapper.vm.mobileLocationQuestions = mobileLocationQuestions;
@@ -535,7 +535,7 @@ describe("service-location.vue", () => {
                     zipCode: "43081",
                 },
                 isVehicleProtected: true,
-                isMobileSelected: true,
+                isMobileSelectedAndModalClosed: true,
                 mobileFeePart: null,
             };
 
@@ -599,7 +599,7 @@ describe("service-location.vue", () => {
                     zipCode: "43081",
                 },
                 isVehicleProtected: "YesAnswer",
-                isMobileSelected: true,
+                isMobileSelectedAndModalClosed: true,
             };
 
             wrapper.vm.closeModalAction = jest.fn();

src/layouts/service-location/service-location.vue

@@ -98,6 +98,7 @@
                         @updated-serviceability="setServiceabilityDetails"
                         @updated-contains-military-base="setContainsMilitaryBase"
                         @updated-mobile-ctu="setCtuForMobile"
+                        @updated-modal-opened="setMobileLocationModalOpened"
                         validationRules="mobile-location-required"
                         ref="mobileLocationQuestions"
                         linkWidgetName="MobileLocationLinkWidget"
@@ -172,7 +173,7 @@ const MOBILE_FEE_PART_TYPE = "MOBILE FEE";
 // DEFINE VALIDATION RULES
 defineRule("mobile-location-required", (value) => {
     if (
-        value.isMobileSelected &&
+        value.isMobileSelectedAndModalClosed &&
         (!value.addressQuestions.streetAddress ||
             !value.addressQuestions.city ||
             !value.addressQuestions.state ||
@@ -211,6 +212,7 @@ export default {
             billToAccountNumber: null,
             shopProviderData: null,
             navigatingForward: false,
+            mobileLocationModalOpened: false,
         };
     },
     async beforeRouteEnter(to, from, next) {
@@ -301,7 +303,9 @@ export default {
                         zipCode: this.zipCode,
                     },
                     isVehicleProtected: this.isVehicleProtected,
-                    isMobileSelected: this.selectedAppointmentType === "Mobile",
+                    isMobileSelectedAndModalClosed:
+                        this.selectedAppointmentType === "Mobile" &&
+                        !this.mobileLocationModalOpened,
                 };
             },
         },
@@ -502,6 +506,9 @@ export default {
         setRecycleFeePart(recycleFeePart) {
             this.recycleFeePart = recycleFeePart;
         },
+        setMobileLocationModalOpened(isModalOpened) {
+            this.mobileLocationModalOpened = isModalOpened;
+        },
         //creating async function as the computed property can not directly handle asynchronous operations or promises.
         async setMobileLocationQuestions(newValue) {
             var newZipCode = newValue.addressQuestions.zipCode;