Merge remote-tracking branch 'origin/develop' into feature/CSR-550

jest.config.js

@@ -34,7 +34,7 @@ module.exports = {
   testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
   coverageThreshold: {
     global: {
-      statements: 85,
+      statements: 84,
       // Got the go ahead from Mark to temporarily lower this. Taking out initialize component made the year,make,model and style coverage drop a bit. Once unit tests for license plate lookup, vin lookup and address lookup are in the coverage should go back up to 90
     },
   },

src/common-components/button-question/button-question.vue

@@ -40,7 +40,7 @@
           </div>
       </fieldset>
     </div>
-    <div class="row form-test-error">
+    <div class="row form-test-error mt-1">
         <error-message :name="groupName" v-if="!suppressError"></error-message>
     </div>
   </div>
@@ -134,7 +134,7 @@ export default {
       return answer.Name ? answer.Name : answer;
     },
     handleCheckedChanged(val) {
-      
+
       this.pushEventToGA(this.$route.query[queryStrings.FMG_PAGE], this.GaActions.CLICKED, val.value, true);
 
       if(this.isMultiSelect && this.selectedValues) {

src/common-components/textbox-question/textbox-question.vue

@@ -19,6 +19,7 @@
 			:validationRules="validationRules"
 			@change="handleChange"
 			@blur="handleChange"
+			:maxlength="maxLength ? maxLength : '999'"
 		/>
 		<div v-show="errorMessage" class="row my-2 form-test-error">
 			<span class="d-inline-flex mt-0" role="alert">{{ errorMessage }}</span>
@@ -55,6 +56,7 @@ export default {
 		validationRules: String,
 		semiAggressiveValidation: Boolean,
 		cmsWidgetName: String,
+		maxLength: String,
 	},
 	setup(props) {
 		const propsClone = Object.assign({}, props);

src/constants/analytics.js

@@ -26,6 +26,7 @@ const GaLabels = {
   ERROR: 'Error',
   LICENSE_PLATE_LOOKUP: 'License_Plate_Look_Up',
   VIN_LOOKUP: 'Vin_Look_Up', 
+  ADDRESS_LOOKUP: 'Address_Look_up', 
 };
 
 

src/layouts/address-lookup/address-lookup.vue

@@ -150,6 +150,16 @@ export default {
 				this.$route
 			);
 		},
+		attachCustomEvents() { 
+       this.prependActionToMethod(this, this.forwardButtonAction, () => {
+      this.pushEventToGA(
+          this.$route.query[this.queryStrings.FMG_PAGE],
+          this.GaActions.SUBMITTED,
+          this.GaLabels.ADDRESS_LOOKUP,
+          true
+     );
+      });
+	},
 		getRegistrationAddressFromStore() {
 			return store.getters.vehicle.registration.address;
 		},
@@ -356,6 +366,9 @@ export default {
 			}
 		}
 	},
+	mounted() {
+    this.attachCustomEvents();
+  },
 	computed: {
 		AlertNonServiceableZipHeader(){
 			const zipCode = this.serviceZipCode ? this.serviceZipCode : this.customerQuestions.addressQuestions.zipCode;

src/layouts/license-plate-lookup/license-plate-lookup.spec.js

@@ -87,7 +87,6 @@ describe("license-plate-lookup.vue", () => {
 
     //Assert
     expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
-
   });
 });
 

src/layouts/license-plate-lookup/license-plate-lookup.vue

@@ -24,7 +24,7 @@
               v-model="registrationZip"
               inputId="zip"
               mask="#####"
-              validationRules="zip-required"
+              validationRules="zip-required|zip-format"
             />
           </div>
         </div>
@@ -54,6 +54,7 @@
               v-model="serviceZip"
               inputId="serviceZip"
               validationRules="zip-required|zip-format"
+              semiAggressiveValidation
             />
           </div>
         </div>
@@ -87,56 +88,25 @@ import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/common-components/textbox-question/textbox-question";
 import loadingModal from '@/common-components/loading-modal/loading-modal.vue';
 // Supporting files
-import {
-  fetchCmsContentForPage
-} from "@/helpers/cms-content-helper";
-import {
-   settleAllPromises
-} from "@/helpers/layout-helper";
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { settleAllPromises } from "@/helpers/layout-helper";
 import store from "@/store";
 import baseMixin from "@/mixins/base-mixin.js";
-import {
-   storeActions
-} from "@/constants/store-actions";
-import {
-   storeMutations
-} from "@/constants/store-mutations";
-import {
-   errorMessages
-} from "@/constants/error-messages";
-import {
-  navigateAfterSaveToHeritageFunnel
-} from "@/helpers/heritage-integration/navigation-helper";
-import {
-  getDamageString,
-  isGlassAvailableForCarId,
-} from "@/helpers/damage-helper";
-import {
-   required,
-    regex,
-} from "@/helpers/validation-rules";
-import {
-   Form,
-    defineRule,
-} from "vee-validate";
+import { storeActions } from "@/constants/store-actions";
+import { storeMutations } from "@/constants/store-mutations";
+import { errorMessages } from "@/constants/error-messages";
+import { navigateAfterSaveToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
+import { getDamageString, isGlassAvailableForCarId, } from "@/helpers/damage-helper";
+import { required, regex, } from "@/helpers/validation-rules";
+import { Form, defineRule, } from "vee-validate";
 
 // DEFINE VALIDATION RULES
-defineRule(
-  "license-plate-required",
-  required(errorMessages.LICENSE_PLATE_REQUIRED)
-);
+defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
 defineRule("zip-required", required(errorMessages.REGISTRATION_ZIP_REQUIRED));
-defineRule(
-  "email-address-required",
-  required(errorMessages.EMAIL_ADDRESS_REQUIRED)
-);
-defineRule(
-  "email-address-format",
-  regex(
-    /^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,})$/,
-    errorMessages.EMAIL_ADDRESS_FORMAT
-  )
-);
+defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
+defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
+defineRule("email-address-format", regex(/^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,})$/, errorMessages.EMAIL_ADDRESS_FORMAT));
+
 export default {
   name: "license-plate-lookup",
   async beforeRouteEnter(to, from, next) {
@@ -229,12 +199,12 @@ export default {
     },
     attachCustomEvents() {
       this.prependActionToMethod(this, this.forwardButtonAction, () => {
-        this.pushEventToGA(
+      this.pushEventToGA(
           this.$route.query[this.queryStrings.FMG_PAGE],
           this.GaActions.SUBMITTED,
           this.GaLabels.LICENSE_PLATE_LOOKUP,
           true
-        );
+       );
       });
     },
     getLicensePlateFromStore() {

src/layouts/vin-lookup/vin-lookup.vue

@@ -24,6 +24,7 @@
               disableAutoFill
               validationRules="vin-required|vin-format"
               :isDisabled="isVinFieldReadOnly"
+              maxLength="17"
             />
           </div>
         </div>
@@ -41,7 +42,7 @@
               mask="#####"
               isRequired
               disableAutoFill
-              validationRules="zip-required"
+              validationRules="zip-required|zip-format"
             />
           </div>
         </div>
@@ -141,29 +142,12 @@ import { Form, defineRule } from "vee-validate";
 import { navigateAfterSaveToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
 
 // DEFINE VALIDATION RULES
-defineRule(
-  "zip-required",
-  required(errorMessages.SERVICE_ZIP_REQUIRED)
-);
-defineRule(
-  "email-address-required",
-  required(errorMessages.EMAIL_ADDRESS_REQUIRED)
-);
-defineRule(
-  "email-address-format",
-  regex(
-    /^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,})$/,
-    errorMessages.EMAIL_ADDRESS_FORMAT
-  )
-);
-defineRule(
-  "vin-required",
-  required(errorMessages.VIN_REQUIRED)
-);
-defineRule(
-  "vin-format",
-  regex(/^[A-HJ-NPR-Z0-9]{17}$/, errorMessages.VIN_FORMAT)
-);
+defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
+defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
+defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
+defineRule("email-address-format", regex(/^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,})$/, errorMessages.EMAIL_ADDRESS_FORMAT));
+defineRule("vin-required", required(errorMessages.VIN_REQUIRED));
+defineRule("vin-format", regex(/^[A-HJ-NPR-Z0-9]{17}$/, errorMessages.VIN_FORMAT));
 
 export default {
   name: "vin-lookup",
@@ -200,6 +184,9 @@ export default {
       vinPopulatedOnPageLoad: this.getVinFromStore()?.length > 0,
     };
   },
+  mounted() {
+    this.attachCustomEvents();
+  },
   watch: {
     vin() {
       this.$refs.funnelFooter.updateButtonText(
@@ -272,12 +259,12 @@ export default {
     getZipFromStore(){
       return store.getters.order.serviceLocation.zipCode;
     },
-    attachCustomEvents() {
+    attachCustomEvents() { 
       this.prependActionToMethod(this, this.forwardButtonAction, () => {
         this.pushEventToGA(
           this.$route.query[this.queryStrings.FMG_PAGE],
           this.GaActions.SUBMITTED,
-          this.GaLabels.VINLOOKUP,
+          this.GaLabels.VIN_LOOKUP,
           true
         );
       });

src/mixins/analytics-mixin.js

@@ -97,8 +97,9 @@ export default {
     },
     
     prependActionToMethod(object, method, actionToPrepend) {
-      const baseMethod = object[method.name];
-      object[method.name] = function () {
+      const baseMethodName = method.name.startsWith('bound ') ? method.name.substring(6) : method.name ; 
+      const baseMethod = object[baseMethodName]; 
+      object[baseMethodName] = function () {
         actionToPrepend.apply(this, arguments);
         return baseMethod.apply(object, arguments);
       };

src/mixins/analytics-mixin.spec.js

@@ -107,4 +107,17 @@ describe("analyticsMixin.js", () => {
     }]);
 
   });
+
+  test("Obj is not null after action prepended", () => {
+    //Arrange 
+    const obj = {baseMethodName:"testMethodName", data:"testData"}; 
+    const method = {name:"testMethodName", data:"testData" }
+    const action = "testAction"; 
+
+    //Act
+    analyticsMixin.methods.prependActionToMethod(obj, method, action);
+
+    //Assert
+    expect(obj!=null); 
+  });
 });

src/styles/common-error-styles.scss

@@ -88,12 +88,14 @@ html {
         border: 1px solid $gray-500;
         input:not(:focus) {
           + label {
+            border: none;
             box-shadow: 0 0 0 1px $gray-500;
             border-radius: .5rem;
           }
         }
         input:checked:focus {
           + label {
+            border: none;
             box-shadow: 0 0 0 2.5px $blue;
             border-radius: .5rem;
           }