Quick start for Internal Event Tracking
In an effort to provide a more efficient, scalable, and unified tracking API, GitLab is deprecating existing RedisHLL and Snowplow tracking. Instead, we’re implementing a new track_event
(Backend) and trackEvent
(Frontend) method.
With this approach, we can update both RedisHLL counters and send Snowplow events without worrying about the underlying implementation.
In order to instrument your code with Internal Events Tracking you need to do three things:
- Define an event
- Define one or more metrics
- Trigger the event
Defining event and metrics
To create an event and metric definitions you can use the internal_events
generator.
This example creates an event definition for an event called project_created
and two metric definitions, which are aggregated every 7 and 28 days.
bundle exec rails generate gitlab:analytics:internal_events \
--time_frames=7d 28d \
--group=project_management \
--stage=plan \
--section=dev \
--event=project_created \
--unique=user.id \
--mr=https://gitlab.com/gitlab-org/gitlab/-/merge_requests/121544
Where:
-
time_frames
: Valid options are7d
and28d
if you provide aunique
value andall
for metrics withoutunique
. We are working to make7d
and28d
work for metrics withall
time frame in this issue. -
unique
: Valid options areuser.id
,project.id
, andnamespace.id
, as they are logged as part of the standard context. We are actively working on a way to define uniqueness on arbitrary properties sent with the event, such asmerge_request.id
.
Trigger events
Triggering an event and thereby updating a metric is slightly different on backend and frontend. Please refer to the relevant section below.
Backend tracking
To trigger an event, call the Gitlab::InternalEvents.track_event
method with the desired arguments:
Gitlab::InternalEvents.track_event(
"i_code_review_user_apply_suggestion",
user: user,
namespace: namespace,
project: project
)
This method automatically increments all RedisHLL metrics relating to the event i_code_review_user_apply_suggestion
, and sends a corresponding Snowplow event with all named arguments and standard context (SaaS only).
Frontend tracking
Vue components
In Vue components, tracking can be done with Vue mixin.
To implement Vue component tracking:
-
Import the
InternalEvents
library and call themixin
method:import { InternalEvents } from '~/tracking'; const trackingMixin = InternalEvents.mixin();
-
Use the mixin in the component:
export default { mixins: [trackingMixin], data() { return { expanded: false, }; }, };
-
Call the
trackEvent
method. Tracking options can be passed as the second parameter:this.trackEvent('i_code_review_user_apply_suggestion');
Or use the
trackEvent
method in the template:<template> <div> <button data-testid="toggle" @click="toggle">Toggle</button> <div v-if="expanded"> <p>Hello world!</p> <button @click="trackEvent('i_code_review_user_apply_suggestion')">Track another event</button> </div> </div> </template>
Raw JavaScript
For tracking events directly from arbitrary frontend JavaScript code, a module for raw JavaScript is provided. This can be used outside of a component context where the Mixin cannot be utilized.
import { InternalEvents } from '~/tracking';
InternalEvents.trackEvent('i_code_review_user_apply_suggestion');
Data-track attribute
This attribute ensures that if we want to track GitLab internal events for a button, we do not need to write JavaScript code on Click handler. Instead, we can just add a data-event-tracking attribute with event value and it should work. This can also be used with HAML views.
<gl-button
data-event-tracking="i_analytics_dev_ops_adoption"
>
Click Me
</gl-button>
Haml
= render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle', data: { event_tracking: 'action' }}) do
Internal events on render
Sometimes we want to send internal events when the component is rendered or loaded. In these cases, we can add the data-event-tracking-load="true"
attribute:
= render Pajamas::ButtonComponent.new(button_options: { data: { event_tracking_load: 'true', event_tracking: 'i_devops' } }) do
= _("New project")