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

1. In GDK go to http://127.0.0.1:3000/admin/dev_ops_reports
2. Click on the dev tab, there will be two API calls of snowplow and /increment_unique_users are being called
3. 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.