Add raw Javascript tracking for Gitlab Internal events
What does this MR do and why?
Implements #414593 (closed)
Current Internal Events tracking solution only supports tracking via a vue mixin (see #410518 (closed)). However, in some cases it is needed to track events directly from arbitrary Frontend javascript code that does not reside within a component. In these cases the Mixin cannot be used.
So, In this MR I have created a module which can be used with raw JavaScript. This module is also used into InternalEventMixin
Add raw Javascript tracking for Gitlab Internal events
Changelog: added
Screenshots or screen recordings
How to set up and validate locally
- In GDK go to
http://127.0.0.1:3000/admin/dev_ops_reports
- Click on the
dev
tab, there will be two API calls of snowplow and/increment_unique_users
are being called - Before this change, we were calling snowplow tracking with Tracking Mixin, now it is being called with Internal Events module. There should not be any difference in the payload.
Before payload === After payload
Before:
{
"data": [
{
"cd": "30",
"cookie": "1",
"cs": "UTF-8",
"cx": "eyJzY2hlbWEiOiJpZ2x1OmNvbS5zbm93cGxvd2FuYWx5dGljcy5zbm93cGxvdy9jb250ZXh0cy9qc29uc2NoZW1hLzEtMC0wIiwiZGF0YSI6W3sic2NoZW1hIjoiaWdsdTpjb20uZ2l0bGFiL2dpdGxhYl9zdGFuZGFyZC9qc29uc2NoZW1hLzEtMC05IiwiZGF0YSI6eyJlbnZpcm9ubWVudCI6ImRldmVsb3BtZW50Iiwic291cmNlIjoiZ2l0bGFiLWphdmFzY3JpcHQiLCJwbGFuIjpudWxsLCJleHRyYSI6eyJuZXdfbmF2Ijp0cnVlfSwidXNlcl9pZCI6MSwibmFtZXNwYWNlX2lkIjpudWxsLCJwcm9qZWN0X2lkIjpudWxsLCJjb250ZXh0X2dlbmVyYXRlZF9hdCI6IjIwMjMtMDYtMjlUMTQ6MjE6MTMuMTgwWiIsImdvb2dsZV9hbmFseXRpY3NfaWQiOiIifX0seyJzY2hlbWEiOiJpZ2x1OmNvbS5naXRsYWIvZ2l0bGFiX3NlcnZpY2VfcGluZy9qc29uc2NoZW1hLzEtMC0wIiwiZGF0YSI6eyJldmVudF9uYW1lIjoiaV9hbmFseXRpY3NfZGV2X29wc19hZG9wdGlvbiIsImRhdGFfc291cmNlIjoicmVkaXNfaGxsIn19LHsic2NoZW1hIjoiaWdsdTpjb20uc25vd3Bsb3dhbmFseXRpY3Muc25vd3Bsb3cvd2ViX3BhZ2UvanNvbnNjaGVtYS8xLTAtMCIsImRhdGEiOnsiaWQiOiJlOGE5NTMyMC0xYjc4LTRlNzMtYmYzZS1kYWNjYTZkMWZlZmEifX0seyJzY2hlbWEiOiJpZ2x1OmNvbS5nb29nbGUuYW5hbHl0aWNzL2Nvb2tpZXMvanNvbnNjaGVtYS8xLTAtMCIsImRhdGEiOnt9fSx7InNjaGVtYSI6ImlnbHU6b3JnLnczL1BlcmZvcm1hbmNlVGltaW5nL2pzb25zY2hlbWEvMS0wLTAiLCJkYXRhIjp7Im5hdmlnYXRpb25TdGFydCI6MTY4ODA0ODQ2NDYyOCwicmVkaXJlY3RTdGFydCI6MCwicmVkaXJlY3RFbmQiOjAsImZldGNoU3RhcnQiOjE2ODgwNDg0NjQ2MzIsImRvbWFpbkxvb2t1cFN0YXJ0IjoxNjg4MDQ4NDY0NjMyLCJkb21haW5Mb29rdXBFbmQiOjE2ODgwNDg0NjQ2MzIsImNvbm5lY3RTdGFydCI6MTY4ODA0ODQ2NDYzMiwic2VjdXJlQ29ubmVjdGlvblN0YXJ0IjowLCJjb25uZWN0RW5kIjoxNjg4MDQ4NDY0NjMyLCJyZXF1ZXN0U3RhcnQiOjE2ODgwNDg0NjQ2MzUsInJlc3BvbnNlU3RhcnQiOjE2ODgwNDg0NzM0ODAsInJlc3BvbnNlRW5kIjoxNjg4MDQ4NDczNDgyLCJ1bmxvYWRFdmVudFN0YXJ0IjowLCJ1bmxvYWRFdmVudEVuZCI6MCwiZG9tTG9hZGluZyI6MTY4ODA0ODQ3MzQ5NCwiZG9tSW50ZXJhY3RpdmUiOjE2ODgwNDg0NzM1NzQsImRvbUNvbnRlbnRMb2FkZWRFdmVudFN0YXJ0IjoxNjg4MDQ4NDgyMzM3LCJkb21Db250ZW50TG9hZGVkRXZlbnRFbmQiOjE2ODgwNDg0ODIzMzgsImRvbUNvbXBsZXRlIjoxNjg4MDQ4NDgyNjM1LCJsb2FkRXZlbnRTdGFydCI6MTY4ODA0ODQ4MjYzNSwibG9hZEV2ZW50RW5kIjoxNjg4MDQ4NDgyNjM1fX0seyJzY2hlbWEiOiJpZ2x1Om9yZy5pZXRmL2h0dHBfY2xpZW50X2hpbnRzL2pzb25zY2hlbWEvMS0wLTAiLCJkYXRhIjp7ImlzTW9iaWxlIjpmYWxzZSwiYnJhbmRzIjpbeyJicmFuZCI6Ikdvb2dsZSBDaHJvbWUiLCJ2ZXJzaW9uIjoiMTEzIn0seyJicmFuZCI6IkNocm9taXVtIiwidmVyc2lvbiI6IjExMyJ9LHsiYnJhbmQiOiJOb3QtQS5CcmFuZCIsInZlcnNpb24iOiIyNCJ9XX19XX0",
"ds": "1728x729",
"dtm": "1688048539251",
"duid": "ba988420-e267-43fc-909e-58bd9b6f96b5",
"e": "se",
"eid": "78e4ef3e-d74b-437b-b3ba-8e51f1b00a51",
"lang": "en-GB",
"p": "web",
"res": "1728x1117",
"se_ac": "i_analytics_dev_ops_adoption",
"se_ca": "InternalEventTracking",
"sid": "33d81518-582e-4e84-9958-fc90cb95f99e",
"stm": "1688048539253",
"tna": "gl",
"tv": "js-3.9.0",
"tz": "Asia/Calcutta",
"url": "http://localhost:3000/admin/dev_ops_reports",
"vid": "1",
"vp": "1728x503"
}
],
"schema": "iglu:com.snowplowanalytics.snowplow/payload_data/jsonschema/1-0-4"
}
After:
{
"data": [
{
"cd": "30",
"cookie": "1",
"cs": "UTF-8",
"cx": "eyJzY2hlbWEiOiJpZ2x1OmNvbS5zbm93cGxvd2FuYWx5dGljcy5zbm93cGxvdy9jb250ZXh0cy9qc29uc2NoZW1hLzEtMC0wIiwiZGF0YSI6W3sic2NoZW1hIjoiaWdsdTpjb20uZ2l0bGFiL2dpdGxhYl9zdGFuZGFyZC9qc29uc2NoZW1hLzEtMC05IiwiZGF0YSI6eyJlbnZpcm9ubWVudCI6ImRldmVsb3BtZW50Iiwic291cmNlIjoiZ2l0bGFiLWphdmFzY3JpcHQiLCJwbGFuIjpudWxsLCJleHRyYSI6eyJuZXdfbmF2Ijp0cnVlfSwidXNlcl9pZCI6MSwibmFtZXNwYWNlX2lkIjpudWxsLCJwcm9qZWN0X2lkIjpudWxsLCJjb250ZXh0X2dlbmVyYXRlZF9hdCI6IjIwMjMtMDYtMjlUMTQ6MjY6MTEuNDA4WiIsImdvb2dsZV9hbmFseXRpY3NfaWQiOiIifX0seyJzY2hlbWEiOiJpZ2x1OmNvbS5naXRsYWIvZ2l0bGFiX3NlcnZpY2VfcGluZy9qc29uc2NoZW1hLzEtMC0wIiwiZGF0YSI6eyJldmVudF9uYW1lIjoiaV9hbmFseXRpY3NfZGV2X29wc19hZG9wdGlvbiIsImRhdGFfc291cmNlIjoicmVkaXNfaGxsIn19LHsic2NoZW1hIjoiaWdsdTpjb20uc25vd3Bsb3dhbmFseXRpY3Muc25vd3Bsb3cvd2ViX3BhZ2UvanNvbnNjaGVtYS8xLTAtMCIsImRhdGEiOnsiaWQiOiIzYjY2ODFhOC1hZjQ3LTQwMWQtODYwMi1lZjZkYzNhZjMzZjcifX0seyJzY2hlbWEiOiJpZ2x1OmNvbS5nb29nbGUuYW5hbHl0aWNzL2Nvb2tpZXMvanNvbnNjaGVtYS8xLTAtMCIsImRhdGEiOnt9fSx7InNjaGVtYSI6ImlnbHU6b3JnLnczL1BlcmZvcm1hbmNlVGltaW5nL2pzb25zY2hlbWEvMS0wLTAiLCJkYXRhIjp7Im5hdmlnYXRpb25TdGFydCI6MTY4ODA0ODc3MTE0NCwicmVkaXJlY3RTdGFydCI6MCwicmVkaXJlY3RFbmQiOjAsImZldGNoU3RhcnQiOjE2ODgwNDg3NzExNDYsImRvbWFpbkxvb2t1cFN0YXJ0IjoxNjg4MDQ4NzcxMTQ2LCJkb21haW5Mb29rdXBFbmQiOjE2ODgwNDg3NzExNDYsImNvbm5lY3RTdGFydCI6MTY4ODA0ODc3MTE0Niwic2VjdXJlQ29ubmVjdGlvblN0YXJ0IjowLCJjb25uZWN0RW5kIjoxNjg4MDQ4NzcxMTQ2LCJyZXF1ZXN0U3RhcnQiOjE2ODgwNDg3NzExNTEsInJlc3BvbnNlU3RhcnQiOjE2ODgwNDg3NzE1MTQsInJlc3BvbnNlRW5kIjoxNjg4MDQ4NzcxNTE2LCJ1bmxvYWRFdmVudFN0YXJ0IjoxNjg4MDQ4NzcxNTE4LCJ1bmxvYWRFdmVudEVuZCI6MTY4ODA0ODc3MTUxOCwiZG9tTG9hZGluZyI6MTY4ODA0ODc3MTUyMywiZG9tSW50ZXJhY3RpdmUiOjE2ODgwNDg3NzE2MDIsImRvbUNvbnRlbnRMb2FkZWRFdmVudFN0YXJ0IjoxNjg4MDQ4NzczMjA2LCJkb21Db250ZW50TG9hZGVkRXZlbnRFbmQiOjE2ODgwNDg3NzMyMDYsImRvbUNvbXBsZXRlIjoxNjg4MDQ4NzczNTAzLCJsb2FkRXZlbnRTdGFydCI6MTY4ODA0ODc3MzUwMywibG9hZEV2ZW50RW5kIjoxNjg4MDQ4NzczNTA0fX0seyJzY2hlbWEiOiJpZ2x1Om9yZy5pZXRmL2h0dHBfY2xpZW50X2hpbnRzL2pzb25zY2hlbWEvMS0wLTAiLCJkYXRhIjp7ImlzTW9iaWxlIjpmYWxzZSwiYnJhbmRzIjpbeyJicmFuZCI6Ikdvb2dsZSBDaHJvbWUiLCJ2ZXJzaW9uIjoiMTEzIn0seyJicmFuZCI6IkNocm9taXVtIiwidmVyc2lvbiI6IjExMyJ9LHsiYnJhbmQiOiJOb3QtQS5CcmFuZCIsInZlcnNpb24iOiIyNCJ9XX19XX0",
"ds": "1728x729",
"dtm": "1688048801054",
"duid": "9b946e08-c8da-4ef8-bed4-d3ba0cba2c5b",
"e": "se",
"eid": "fb2f8283-159f-49ce-aa73-f34a357f2a83",
"lang": "en-GB",
"p": "web",
"res": "1728x1117",
"se_ac": "i_analytics_dev_ops_adoption",
"se_ca": "InternalEventTracking",
"sid": "7beab3e5-c4e8-4bb0-9643-5276706cdabb",
"stm": "1688048801056",
"tna": "gl",
"tv": "js-3.9.0",
"tz": "Asia/Calcutta",
"url": "http://localhost:3000/admin/dev_ops_reports",
"vid": "1",
"vp": "1728x503"
}
],
"schema": "iglu:com.snowplowanalytics.snowplow/payload_data/jsonschema/1-0-4"
}
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by Ankit Panchal