CSR-762 Rename and move around GA logic

This commit is contained in:
Katie 2022-10-17 11:27:23 -04:00
parent 0e3b1d79b8
commit 132f39e2de
4 changed files with 41 additions and 41 deletions

View file

@ -5,17 +5,17 @@
name="route-fade" name="route-fade"
mode="out-in"> mode="out-in">
<!-- The above durations should be kept in sync with the global css class "fade-on-route-transition" --> <!-- The above durations should be kept in sync with the global css class "fade-on-route-transition" -->
<component :is="Component" @focusin="handleChildFocus" /> <component :is="Component" @focusin="handleAnyComponentFocus" />
</transition> </transition>
</router-view> </router-view>
</template> </template>
<script> <script>
import { handleChildFocus } from "@/helpers/analytics-helper" import { handleAnyComponentFocus } from "@/helpers/input-button-focus-helper"
export default { export default {
name: "app", name: "app",
methods: { methods: {
handleChildFocus: handleChildFocus handleAnyComponentFocus: handleAnyComponentFocus
} }
}; };
</script> </script>

View file

@ -26,7 +26,7 @@
import { useField } from "vee-validate"; import { useField } from "vee-validate";
import { toRef } from "vue"; import { toRef } from "vue";
import { queryStrings } from "@/constants/query-strings"; import { queryStrings } from "@/constants/query-strings";
import { handleInputFocus, handleInputBlur } from "@/helpers/analytics-helper"; import { handleButtonComponentFocus, handleInputComponentBlur } from "@/helpers/input-button-focus-helper";
import { inputButtonProps } from "@/common-components/base-input-button/button-functionality-props"; import { inputButtonProps } from "@/common-components/base-input-button/button-functionality-props";
export default { export default {
@ -100,14 +100,14 @@ export default {
this.$emit("update:modelValue", this.valueToEmit); this.$emit("update:modelValue", this.valueToEmit);
}, },
handleFocus() { handleFocus() {
handleInputFocus({ handleButtonComponentFocus({
groupName: this.groupName, groupName: this.groupName,
}); });
}, },
handleBlur() { handleBlur() {
handleInputBlur({ handleInputComponentBlur({
groupName: this.groupName, groupName: this.groupName,
onFocusCallback: this.handlePushClickEventToGACheck, onButtonQuestionLostFocusCallback: this.handlePushClickEventToGACheck,
}); });
}, },
handlePushClickEventToGACheck(source) { handlePushClickEventToGACheck(source) {

View file

@ -1,34 +0,0 @@
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
}

View file

@ -0,0 +1,34 @@
let lastFocusedInputGroupName = "";
let onButtonQuestionLostFocusCallback = null;
const handleAnyComponentFocus = (e) => {
const targetType = e.target.type;
if (targetType !== "radio" && targetType !== "checkbox") {
invokeButtonQuestionLostFocusCallback();
}
};
const handleButtonComponentFocus = (e) => {
if (e && lastFocusedInputGroupName !== e.groupName) {
invokeButtonQuestionLostFocusCallback();
}
};
const handleInputComponentBlur = (e) => {
if (e) {
lastFocusedInputGroupName = e.groupName;
onButtonQuestionLostFocusCallback = e.onButtonQuestionLostFocusCallback;
}
};
const invokeButtonQuestionLostFocusCallback = () => {
if (onButtonQuestionLostFocusCallback) {
onButtonQuestionLostFocusCallback();
}
};
export {
handleAnyComponentFocus,
handleButtonComponentFocus,
handleInputComponentBlur,
};