Add latest changes from gitlab-org/gitlab@master

4 files changed, 41 insertions, 0 deletions

diff --git a/app/assets/javascripts/tracking/constants.js b/app/assets/javascripts/tracking/constants.js
index 0e440750fdb..d0447fa167c 100644
--- a/app/assets/javascripts/tracking/constants.js
+++ b/app/assets/javascripts/tracking/constants.js
@@ -19,6 +19,7 @@ export const DEFAULT_SNOWPLOW_OPTIONS = {
 
 export const ACTION_ATTR_SELECTOR = '[data-track-action]';
 export const LOAD_ACTION_ATTR_SELECTOR = '[data-track-action="render"]';
+export const INTERNAL_EVENTS_SELECTOR = '[data-event-tracking]';
 
 export const URLS_CACHE_STORAGE_KEY = 'gl-snowplow-pseudonymized-urls';
 
diff --git a/app/assets/javascripts/tracking/index.js b/app/assets/javascripts/tracking/index.js
index 6494838abac..7c2cd6fde27 100644
--- a/app/assets/javascripts/tracking/index.js
+++ b/app/assets/javascripts/tracking/index.js
@@ -69,4 +69,6 @@ export function initDefaultTrackers() {
 
   Tracking.bindDocument();
   Tracking.trackLoadEvents();
+
+  InternalEvents.bindInternalEventDocument();
 }
diff --git a/app/assets/javascripts/tracking/internal_events.js b/app/assets/javascripts/tracking/internal_events.js
index 56453373bbf..16cbb3e86e1 100644
--- a/app/assets/javascripts/tracking/internal_events.js
+++ b/app/assets/javascripts/tracking/internal_events.js
@@ -2,6 +2,8 @@ import API from '~/api';
 
 import Tracking from './tracking';
 import { GITLAB_INTERNAL_EVENT_CATEGORY, SERVICE_PING_SCHEMA } from './constants';
+import { Tracker } from './tracker';
+import { InternalEventHandler } from './utils';
 
 const InternalEvents = {
   /**
@@ -33,6 +35,24 @@ const InternalEvents = {
       },
     };
   },
+  /**
+   * Attaches event handlers for data-attributes powered events.
+   *
+   * @param {HTMLElement} parent - element containing data-attributes
+   * @returns {Object} handler - object containing name of the event and its corresponding function
+   */
+  bindInternalEventDocument(parent = document) {
+    if (!Tracker.enabled() || parent.internalEventsTrackingBound) {
+      return [];
+    }
+
+    // eslint-disable-next-line no-param-reassign
+    parent.internalEventsTrackingBound = true;
+
+    const handler = { name: 'click', func: (e) => InternalEventHandler(e, this.track_event) };
+    parent.addEventListener(handler.name, handler.func);
+    return handler;
+  },
 };
 
 export default InternalEvents;
diff --git a/app/assets/javascripts/tracking/utils.js b/app/assets/javascripts/tracking/utils.js
index cc0d7e7a44a..7cbc0f1843e 100644
--- a/app/assets/javascripts/tracking/utils.js
+++ b/app/assets/javascripts/tracking/utils.js
@@ -6,6 +6,7 @@ import {
   LOAD_ACTION_ATTR_SELECTOR,
   URLS_CACHE_STORAGE_KEY,
   REFERRER_TTL,
+  INTERNAL_EVENTS_SELECTOR,
 } from './constants';
 
 export const addExperimentContext = (opts) => {
@@ -69,6 +70,23 @@ export const createEventPayload = (el, { suffix = '' } = {}) => {
   };
 };
 
+export const createInternalEventPayload = (el) => {
+  const { eventTracking } = el?.dataset || {};
+
+  return eventTracking;
+};
+
+export const InternalEventHandler = (e, func) => {
+  const el = e.target.closest(INTERNAL_EVENTS_SELECTOR);
+
+  if (!el) {
+    return;
+  }
+  const event = createInternalEventPayload(el);
+
+  func(event);
+};
+
 export const eventHandler = (e, func, opts = {}) => {
   const actionSelector = `${ACTION_ATTR_SELECTOR}:not(${LOAD_ACTION_ATTR_SELECTOR})`;
   const el = e.target.closest(actionSelector);