2019-09-19 17:06:29 -04:00
|
|
|
import _ from 'underscore';
|
2019-08-01 01:28:15 -04:00
|
|
|
|
2019-08-28 02:52:14 -04:00
|
|
|
const DEFAULT_SNOWPLOW_OPTIONS = {
|
|
|
|
namespace: 'gl',
|
|
|
|
hostname: window.location.hostname,
|
|
|
|
cookieDomain: window.location.hostname,
|
|
|
|
appId: '',
|
|
|
|
userFingerprint: false,
|
|
|
|
respectDoNotTrack: true,
|
|
|
|
forceSecureTracker: true,
|
|
|
|
eventMethod: 'post',
|
|
|
|
contexts: { webPage: true },
|
2019-09-18 10:02:45 -04:00
|
|
|
formTracking: false,
|
|
|
|
linkClickTracking: false,
|
2019-08-28 02:52:14 -04:00
|
|
|
};
|
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
const eventHandler = (e, func, opts = {}) => {
|
|
|
|
const el = e.target.closest('[data-track-event]');
|
|
|
|
const action = el && el.dataset.trackEvent;
|
|
|
|
if (!action) return;
|
|
|
|
|
|
|
|
let value = el.dataset.trackValue || el.value || undefined;
|
|
|
|
if (el.type === 'checkbox' && !el.checked) value = false;
|
|
|
|
|
|
|
|
const data = {
|
|
|
|
label: el.dataset.trackLabel,
|
|
|
|
property: el.dataset.trackProperty,
|
|
|
|
value,
|
|
|
|
context: el.dataset.trackContext,
|
|
|
|
};
|
|
|
|
|
|
|
|
func(opts.category, action + (opts.suffix || ''), _.omit(data, _.isUndefined));
|
|
|
|
};
|
|
|
|
|
|
|
|
const eventHandlers = (category, func) => {
|
|
|
|
const handler = opts => e => eventHandler(e, func, { ...{ category }, ...opts });
|
|
|
|
const handlers = [];
|
|
|
|
handlers.push({ name: 'click', func: handler() });
|
|
|
|
handlers.push({ name: 'show.bs.dropdown', func: handler({ suffix: '_show' }) });
|
|
|
|
handlers.push({ name: 'hide.bs.dropdown', func: handler({ suffix: '_hide' }) });
|
|
|
|
return handlers;
|
2019-08-01 01:28:15 -04:00
|
|
|
};
|
|
|
|
|
|
|
|
export default class Tracking {
|
2019-08-23 03:11:26 -04:00
|
|
|
static trackable() {
|
|
|
|
return !['1', 'yes'].includes(
|
|
|
|
window.doNotTrack || navigator.doNotTrack || navigator.msDoNotTrack,
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2019-08-01 01:28:15 -04:00
|
|
|
static enabled() {
|
2019-08-23 03:11:26 -04:00
|
|
|
return typeof window.snowplow === 'function' && this.trackable();
|
2019-08-01 01:28:15 -04:00
|
|
|
}
|
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
static event(category = document.body.dataset.page, action = 'generic', data = {}) {
|
2019-08-01 01:28:15 -04:00
|
|
|
if (!this.enabled()) return false;
|
|
|
|
// eslint-disable-next-line @gitlab/i18n/no-non-i18n-strings
|
|
|
|
if (!category) throw new Error('Tracking: no category provided for tracking.');
|
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
const { label, property, value, context } = data;
|
|
|
|
const contexts = context ? [context] : undefined;
|
|
|
|
return window.snowplow('trackStructEvent', category, action, label, property, value, contexts);
|
2019-08-01 01:28:15 -04:00
|
|
|
}
|
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
static bindDocument(category = document.body.dataset.page, documentOverride = null) {
|
|
|
|
const el = documentOverride || document;
|
|
|
|
if (!this.enabled() || el.trackingBound) return [];
|
2019-08-01 01:28:15 -04:00
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
el.trackingBound = true;
|
2019-08-01 01:28:15 -04:00
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
const handlers = eventHandlers(category, (...args) => this.event(...args));
|
|
|
|
handlers.forEach(event => el.addEventListener(event.name, event.func));
|
|
|
|
return handlers;
|
2019-08-01 01:28:15 -04:00
|
|
|
}
|
|
|
|
|
2019-11-27 04:06:29 -05:00
|
|
|
static mixin(opts = {}) {
|
2019-09-19 17:06:29 -04:00
|
|
|
return {
|
2019-11-27 04:06:29 -05:00
|
|
|
computed: {
|
|
|
|
trackingCategory() {
|
|
|
|
const localCategory = this.tracking ? this.tracking.category : null;
|
|
|
|
return localCategory || opts.category;
|
|
|
|
},
|
|
|
|
trackingOptions() {
|
|
|
|
return { ...opts, ...this.tracking };
|
|
|
|
},
|
2019-09-19 17:06:29 -04:00
|
|
|
},
|
|
|
|
methods: {
|
2019-11-27 04:06:29 -05:00
|
|
|
track(action, data = {}) {
|
|
|
|
const category = data.category || this.trackingCategory;
|
|
|
|
const options = {
|
|
|
|
...this.trackingOptions,
|
|
|
|
...data,
|
|
|
|
};
|
|
|
|
Tracking.event(category, action, options);
|
2019-09-19 17:06:29 -04:00
|
|
|
},
|
|
|
|
},
|
2019-08-01 01:28:15 -04:00
|
|
|
};
|
|
|
|
}
|
|
|
|
}
|
2019-08-28 02:52:14 -04:00
|
|
|
|
|
|
|
export function initUserTracking() {
|
|
|
|
if (!Tracking.enabled()) return;
|
|
|
|
|
2019-09-19 17:06:29 -04:00
|
|
|
const opts = { ...DEFAULT_SNOWPLOW_OPTIONS, ...window.snowplowOptions };
|
2019-08-28 02:52:14 -04:00
|
|
|
window.snowplow('newTracker', opts.namespace, opts.hostname, opts);
|
|
|
|
|
2019-09-18 10:02:45 -04:00
|
|
|
window.snowplow('enableActivityTracking', 30, 30);
|
|
|
|
window.snowplow('trackPageView'); // must be after enableActivityTracking
|
|
|
|
|
|
|
|
if (opts.formTracking) window.snowplow('enableFormTracking');
|
|
|
|
if (opts.linkClickTracking) window.snowplow('enableLinkClickTracking');
|
2019-09-19 17:06:29 -04:00
|
|
|
|
|
|
|
Tracking.bindDocument();
|
2019-08-28 02:52:14 -04:00
|
|
|
}
|