From 56ca8c56a2d1c1e65cf8e4bd5dfbdfacc244266a Mon Sep 17 00:00:00 2001
From: Ankit Panchal <apanchal@gitlab.com>
Date: Thu, 30 Nov 2023 09:03:02 +0000
Subject: [PATCH] Remove extra and context from FE Internal event code and
documentation
---
.../javascripts/tracking/internal_events.js | 27 ++++-------
.../quick_start.md | 28 ++---------
.../related_items_tree/store/actions.js | 9 ++--
.../related_items_tree/store/actions_spec.js | 8 +---
.../frontend/tracking/internal_events_spec.js | 48 ++-----------------
5 files changed, 24 insertions(+), 96 deletions(-)
diff --git a/app/assets/javascripts/tracking/internal_events.js b/app/assets/javascripts/tracking/internal_events.js
index d5bc428934c3b..a6d14bfbfd817 100644
--- a/app/assets/javascripts/tracking/internal_events.js
+++ b/app/assets/javascripts/tracking/internal_events.js
@@ -13,24 +13,17 @@ const InternalEvents = {
/**
*
* @param {string} event
- * @param {object} data
*/
- trackEvent(event, data = {}) {
- const { context, ...rest } = data;
-
- const defaultContext = {
- schema: SERVICE_PING_SCHEMA,
- data: {
- event_name: event,
- data_source: 'redis_hll',
- },
- };
- const mergedContext = context ? [defaultContext, context] : defaultContext;
-
+ trackEvent(event) {
API.trackInternalEvent(event);
Tracking.event(GITLAB_INTERNAL_EVENT_CATEGORY, event, {
- context: mergedContext,
- ...rest,
+ context: {
+ schema: SERVICE_PING_SCHEMA,
+ data: {
+ event_name: event,
+ data_source: 'redis_hll',
+ },
+ },
});
this.trackBrowserSDK(event);
},
@@ -41,8 +34,8 @@ const InternalEvents = {
mixin() {
return {
methods: {
- trackEvent(event, data = {}) {
- InternalEvents.trackEvent(event, data);
+ trackEvent(event) {
+ InternalEvents.trackEvent(event);
},
},
};
diff --git a/doc/development/internal_analytics/internal_event_instrumentation/quick_start.md b/doc/development/internal_analytics/internal_event_instrumentation/quick_start.md
index 3d8decd61529d..c5388754babab 100644
--- a/doc/development/internal_analytics/internal_event_instrumentation/quick_start.md
+++ b/doc/development/internal_analytics/internal_event_instrumentation/quick_start.md
@@ -69,6 +69,10 @@ If a `project` but no `namespace` is provided, the `project.namespace` is used a
### Frontend tracking
+Any frontend tracking call automatically passes the values `user.id`, `namespace.id`, and `project.id` from the current context of the page.
+
+If you need to pass any further properties, such as `extra`, `context`, `label`, `property`, and `value`, you can use the [deprecated snowplow implementation](https://docs.gitlab.com/16.4/ee/development/internal_analytics/snowplow/implementation.html). In this case, please let us know about your specific use-case in our [feedback issue for Internal Events](https://gitlab.com/gitlab-org/analytics-section/analytics-instrumentation/internal/-/issues/690).
+
#### Vue components
In Vue components, tracking can be done with [Vue mixin](https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/javascripts/tracking/internal_events.js#L29).
@@ -152,27 +156,3 @@ Sometimes we want to send internal events when the component is rendered or load
= render Pajamas::ButtonComponent.new(button_options: { data: { event_tracking_load: 'true', event_tracking: 'i_devops' } }) do
= _("New project")
```
-
-### Props
-
-Apart from `eventName`, the `trackEvent` method also supports `extra` and `context` props.
-
-`extra`: Use this property to append supplementary information to GitLab standard context.
-`context`: Use this property to attach an additional context, if needed.
-
-The following example shows how to use the `extra` and `context` props with the `trackEvent` method:
-
-```javascript
-this.trackEvent('i_code_review_user_apply_suggestion', {
- extra: {
- projectId : 123,
- },
- context: {
- schema: 'iglu:com.gitlab/design_management_context/jsonschema/1-0-0',
- data: {
- 'design-version-number': '1.0.0',
- 'design-is-current-version': '1.0.1',
- },
- },
-});
-```
diff --git a/ee/app/assets/javascripts/related_items_tree/store/actions.js b/ee/app/assets/javascripts/related_items_tree/store/actions.js
index f0ec820a65e30..a8b6a7f04e3ab 100644
--- a/ee/app/assets/javascripts/related_items_tree/store/actions.js
+++ b/ee/app/assets/javascripts/related_items_tree/store/actions.js
@@ -26,8 +26,8 @@ import { processQueryResponse, formatChildItem, gqClient } from '../utils/epic_u
import * as types from './mutation_types';
-const trackEpicActivity = (params = {}) => {
- InternalEvents.trackEvent(trackingAddedIssue, { extra: params });
+const trackEpicActivity = () => {
+ InternalEvents.trackEvent(trackingAddedIssue);
};
export const setInitialConfig = ({ commit }, data) => commit(types.SET_INITIAL_CONFIG, data);
@@ -344,7 +344,7 @@ export const addItem = ({ state, dispatch, getters }) => {
issuable_references: state.pendingReferences,
})
.then(({ data }) => {
- trackEpicActivity({ namespace: state.parentItem?.groupId });
+ trackEpicActivity();
dispatch('receiveAddItemSuccess', {
// Newly added item is always first in the list
@@ -580,8 +580,7 @@ export const createNewIssue = ({ state, dispatch }, { issuesEndpoint, title }) =
return axios
.post(issuesEndpoint, { epic_id: epicId, title })
.then(({ data }) => {
- const { author, epic } = data;
- trackEpicActivity({ user: author?.id, namespace: epic?.group_id });
+ trackEpicActivity();
dispatch('receiveCreateIssueSuccess', data);
dispatch('fetchItems', {
diff --git a/ee/spec/frontend/related_items_tree/store/actions_spec.js b/ee/spec/frontend/related_items_tree/store/actions_spec.js
index 482037873111c..a58995f25f88a 100644
--- a/ee/spec/frontend/related_items_tree/store/actions_spec.js
+++ b/ee/spec/frontend/related_items_tree/store/actions_spec.js
@@ -1054,9 +1054,7 @@ describe('RelatedItemTree', () => {
actions.addItem({ state, dispatch: () => {}, getters });
await axios.waitForAll();
- expect(InternalEvents.trackEvent).toHaveBeenCalledWith(trackingAddedIssue, {
- extra: { namespace: 1 },
- });
+ expect(InternalEvents.trackEvent).toHaveBeenCalledWith(trackingAddedIssue);
});
it('should dispatch `requestAddItem` and `receiveAddItemFailure` actions on request failure', () => {
@@ -1681,9 +1679,7 @@ describe('RelatedItemTree', () => {
actions.createNewIssue({ state, dispatch: () => {} }, { issuesEndpoint, title: '' });
await axios.waitForAll();
- expect(InternalEvents.trackEvent).toHaveBeenCalledWith(trackingAddedIssue, {
- extra: { namespace: 2, user: 1 },
- });
+ expect(InternalEvents.trackEvent).toHaveBeenCalledWith(trackingAddedIssue);
});
beforeEach(() => {
diff --git a/spec/frontend/tracking/internal_events_spec.js b/spec/frontend/tracking/internal_events_spec.js
index 44a048a4b5f5a..295b08f4b1ca7 100644
--- a/spec/frontend/tracking/internal_events_spec.js
+++ b/spec/frontend/tracking/internal_events_spec.js
@@ -1,15 +1,9 @@
import API from '~/api';
-import { mockTracking } from 'helpers/tracking_helper';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import InternalEvents from '~/tracking/internal_events';
-import {
- GITLAB_INTERNAL_EVENT_CATEGORY,
- SERVICE_PING_SCHEMA,
- LOAD_INTERNAL_EVENTS_SELECTOR,
-} from '~/tracking/constants';
+import { LOAD_INTERNAL_EVENTS_SELECTOR } from '~/tracking/constants';
import * as utils from '~/tracking/utils';
import { Tracker } from '~/tracking/tracker';
-import { extraContext } from './mock_data';
jest.mock('~/api', () => ({
trackInternalEvent: jest.fn(),
@@ -41,26 +35,6 @@ describe('InternalEvents', () => {
expect(InternalEvents.trackBrowserSDK).toHaveBeenCalledTimes(1);
expect(InternalEvents.trackBrowserSDK).toHaveBeenCalledWith(event);
});
-
- it('trackEvent calls tracking.event functions with correct arguments', () => {
- const trackingSpy = mockTracking(GITLAB_INTERNAL_EVENT_CATEGORY, undefined, jest.spyOn);
-
- InternalEvents.trackEvent(event, { context: extraContext });
-
- expect(trackingSpy).toHaveBeenCalledTimes(1);
- expect(trackingSpy).toHaveBeenCalledWith(GITLAB_INTERNAL_EVENT_CATEGORY, event, {
- context: [
- {
- schema: SERVICE_PING_SCHEMA,
- data: {
- event_name: event,
- data_source: 'redis_hll',
- },
- },
- extraContext,
- ],
- });
- });
});
describe('mixin', () => {
@@ -68,17 +42,13 @@ describe('InternalEvents', () => {
const Component = {
template: `
<div>
- <button data-testid="button1" @click="handleButton1Click">Button 1</button>
- <button data-testid="button2" @click="handleButton2Click">Button 2</button>
+ <button data-testid="button" @click="handleButton1Click">Button</button>
</div>
`,
methods: {
handleButton1Click() {
this.trackEvent(event);
},
- handleButton2Click() {
- this.trackEvent(event, extraContext);
- },
},
mixins: [InternalEvents.mixin()],
};
@@ -90,20 +60,10 @@ describe('InternalEvents', () => {
it('this.trackEvent function calls InternalEvent`s track function with an event', async () => {
const trackEventSpy = jest.spyOn(InternalEvents, 'trackEvent');
- await wrapper.findByTestId('button1').trigger('click');
-
- expect(trackEventSpy).toHaveBeenCalledTimes(1);
- expect(trackEventSpy).toHaveBeenCalledWith(event, {});
- });
-
- it("this.trackEvent function calls InternalEvent's track function with an event and data", async () => {
- const data = extraContext;
- const trackEventSpy = jest.spyOn(InternalEvents, 'trackEvent');
-
- await wrapper.findByTestId('button2').trigger('click');
+ await wrapper.findByTestId('button').trigger('click');
expect(trackEventSpy).toHaveBeenCalledTimes(1);
- expect(trackEventSpy).toHaveBeenCalledWith(event, data);
+ expect(trackEventSpy).toHaveBeenCalledWith(event);
});
});
--
GitLab