From cbfd62e3a827cb56c67bc6c39fe1b0ce312618b5 Mon Sep 17 00:00:00 2001 From: Katie Date: Fri, 14 Oct 2022 15:07:59 -0400 Subject: [PATCH] CSR-762 Remove pushing GA on autoselect --- src/App.vue | 42 ++----------------- .../base-input-button/base-input-button.vue | 17 ++++---- .../button-question/button-question.vue | 2 - src/helpers/analytics-helper.js | 34 +++++++++++++++ .../glass-part-question.vue | 6 +-- src/mixins/analytics-mixin.js | 4 +- src/mixins/input-button-wrapper-mixin.js | 1 - 7 files changed, 48 insertions(+), 58 deletions(-) create mode 100644 src/helpers/analytics-helper.js diff --git a/src/App.vue b/src/App.vue index c934ee244..e43e85c84 100644 --- a/src/App.vue +++ b/src/App.vue @@ -11,48 +11,12 @@ diff --git a/src/common-components/base-input-button/base-input-button.vue b/src/common-components/base-input-button/base-input-button.vue index c7c2291ce..e58e826cc 100644 --- a/src/common-components/base-input-button/base-input-button.vue +++ b/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.handleEventAction(this.eventTypes.MOUNT) - } else { - this.handleChange(this.modelValue); - } + 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" }; }, }, diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index eb198c93f..1b75e8d9d 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -52,7 +52,6 @@ :selectOnKeypress="selectOnKeypress" :lastValuePushedToGa="lastValuePushedToGa" :setLastValuePushedToGa="setLastValuePushedToGa" - :shouldPushClickEventToGAOnMount="shouldPushClickEventToGAOnMount" v-model="selectedValues" /> @@ -122,7 +121,6 @@ export default { type: Boolean, default: true, }, - shouldPushClickEventToGAOnMount: Boolean }, data() { return { diff --git a/src/helpers/analytics-helper.js b/src/helpers/analytics-helper.js new file mode 100644 index 000000000..b03d86191 --- /dev/null +++ b/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 +} \ No newline at end of file diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue index 14f707818..d45c8cddb 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue @@ -27,9 +27,7 @@ isRequired :groupName="`${glassLocation}-${glassName}-${selectedTint}`" :validationRules="partValidationRules" - :shouldPushClickEventToGAOnMount=" - shouldPushClickEventToGAOnMount - " /> + /> @@ -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 } }); diff --git a/src/mixins/analytics-mixin.js b/src/mixins/analytics-mixin.js index 6eb18e462..4ff24f968 100644 --- a/src/mixins/analytics-mixin.js +++ b/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() { diff --git a/src/mixins/input-button-wrapper-mixin.js b/src/mixins/input-button-wrapper-mixin.js index eae27c2fe..628ccec96 100644 --- a/src/mixins/input-button-wrapper-mixin.js +++ b/src/mixins/input-button-wrapper-mixin.js @@ -22,7 +22,6 @@ export default { }, lastValuePushedToGa: [String, Number], setLastValuePushedToGa: Function, - shouldPushClickEventToGAOnMount: Boolean, }, computed: { selectedValue: {