CSR-762 Remove pushing GA on autoselect

src/App.vue

@@ -11,48 +11,12 @@
 </template>
 
 <script>
-// TODO KO glass-part-question has nested button questions
+import { handleChildFocus } from "@/helpers/analytics-helper"
-// TODO KO selectedValues - make consistent for checkbox and radio if possible
 export default {
     name: "app",
-    data() {
-        return {
-            lastFocusedInputGroupName: "",
-            onFocusCallback: null,
-        };
-    },
     methods: {
-        handleChildFocus(e) {
+        handleChildFocus: handleChildFocus
-            const targetType = e.target.type;
+    }
-            if (targetType !== "radio" && targetType !== "checkbox") {
-                this.handleInputFocus({
-                    groupName: null,
-                });
-            }
-        },
-        handleInputFocus(e) {
-            if (
-                e &&
-                this.lastFocusedInputGroupName !== e.groupName &&
-                this.onFocusCallback
-            ) {
-                this.onFocusCallback();
-            }
-        },
-        handleInputBlur(e) {
-            if (e) {
-                this.lastFocusedInputGroupName = e.groupName;
-                this.onFocusCallback = e.onFocusCallback;
-            }
-        },
-    },
-    watch: {
-        $route: {
-            handler() {
-                this.lastFocusedInputGroup = null;
-            },
-        },
-    },
 };
 </script>
 

src/common-components/base-input-button/base-input-button.vue

@@ -26,6 +26,10 @@
 import { useField } from "vee-validate";
 import { toRef } from "vue";
 import { queryStrings } from "@/constants/query-strings";
+import {
+    handleInputFocus,
+    handleInputBlur,
+} from "@/helpers/analytics-helper";
 import inputButtonWrapperMixin from "../../mixins/input-button-wrapper-mixin";
 
 export default {
@@ -59,7 +63,6 @@ export default {
         isRequired: Boolean,
         lastValuePushedToGa: [String, Number],
         setLastValuePushedToGa: Function,
-        shouldPushClickEventToGAOnMount: Boolean,
     },
     data() {
         return {
@@ -68,11 +71,7 @@ export default {
     },
     mounted() {
         if (this.isChecked) {
-            if (this.shouldPushClickEventToGAOnMount) {
+            this.handleChange(this.modelValue);
-                this.handleEventAction(this.eventTypes.MOUNT)
-            } else {
-                this.handleChange(this.modelValue);
-            }
         }
     },
     methods: {
@@ -92,7 +91,6 @@ export default {
                     case this.eventTypes.CLICK:
                     case this.eventTypes.ENTER:
                     case this.eventTypes.SPACE:
-                    case this.eventTypes.MOUNT:
                         this.handleClick(e);
                         this.handlePushClickEventToGACheck(
                             this.eventTypes.CLICK
@@ -130,12 +128,12 @@ export default {
             this.$emit("update:modelValue", this.valueToEmit);
         },
         handleFocus() {
-            this.$root.handleInputFocus({
+            handleInputFocus({
                 groupName: this.groupName,
             });
         },
         handleBlur() {
-            this.$root.handleInputBlur({
+            handleInputBlur({
                 groupName: this.groupName,
                 onFocusCallback: this.handlePushClickEventToGACheck,
             });
@@ -192,7 +190,6 @@ export default {
                 ENTER: "enter",
                 SPACE: "space",
                 CLICK: "click",
-                MOUNT: "mount"
             };
         },
     },

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

@@ -52,7 +52,6 @@
                             :selectOnKeypress="selectOnKeypress"
                             :lastValuePushedToGa="lastValuePushedToGa"
                             :setLastValuePushedToGa="setLastValuePushedToGa"
-                            :shouldPushClickEventToGAOnMount="shouldPushClickEventToGAOnMount"
                             v-model="selectedValues"
                             />
                         <!-- For nested questions -->
@@ -122,7 +121,6 @@ export default {
             type: Boolean,
             default: true,
         },
-        shouldPushClickEventToGAOnMount: Boolean
     },
     data() {
         return {

src/helpers/analytics-helper.js

@@ -0,0 +1,34 @@
+let lastFocusedInputGroupName = "";
+let onFocusCallback = null;
+
+const handleChildFocus = (e) => {
+    const targetType = e.target.type;
+    if (targetType !== "radio" && targetType !== "checkbox") {
+        handleInputFocus({
+            groupName: null,
+        });
+    }
+}
+
+const handleInputFocus = (e) => {
+    if (
+        e &&
+        lastFocusedInputGroupName !== e.groupName &&
+        onFocusCallback
+    ) {
+        onFocusCallback();
+    }
+}
+
+const handleInputBlur = (e) => {
+    if (e) {
+        lastFocusedInputGroupName = e.groupName;
+        onFocusCallback = e.onFocusCallback;
+    }
+}
+
+export {
+    handleChildFocus,
+    handleInputFocus,
+    handleInputBlur
+}

src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue

@@ -27,9 +27,7 @@
                                 isRequired
                                 :groupName="`${glassLocation}-${glassName}-${selectedTint}`"
                                 :validationRules="partValidationRules"
-                                :shouldPushClickEventToGAOnMount="
+                                />
-                                    shouldPushClickEventToGAOnMount
-                                " />
                         </div>
                     </div>
                 </buttonQuestion>
@@ -57,7 +55,6 @@ export default {
             glassColorQuestion: "",
             glassFeatureQuestion: "",
             selectedTint: "",
-            shouldPushClickEventToGAOnMount: true,
         };
     },
     props: {
@@ -224,7 +221,6 @@ export default {
             this.$nextTick(() => {
                 if (this.modelValue !== undefined) {
                     // Populate button-question model-value if parts data already exists in VueX
-                    this.shouldPushClickEventToGAOnMount = false;
                     this.selectedTint = this.modelValue?.color
                 }
             });

src/mixins/analytics-mixin.js

@@ -48,6 +48,8 @@ export default {
     pushEventToGA(category, action, label, pushToLogApp = false, valueToLogType = null) {
       const currentPageName = getPageNameByQueryString();
       const labelToLog = getValueToLog(label, valueToLogType);
+
+      console.log("PUSHING: ", labelToLog)
       const eventToBePushed = {
         'event': GaEvents.GENERIC_EVENT,
         'category': category,
@@ -140,7 +142,7 @@ export default {
     
     noSession() {
       return getSessionKeyValue() === 0 || getSessionIdValue() === '00000000-0000-0000-0000-000000000000';
-    }
+    },
   },
   computed: {
     analyticsPageEvents() {

src/mixins/input-button-wrapper-mixin.js

@@ -22,7 +22,6 @@ export default {
         },
         lastValuePushedToGa: [String, Number],
         setLastValuePushedToGa: Function,
-        shouldPushClickEventToGAOnMount: Boolean,
     },
     computed: {
         selectedValue: {