@gitlab/application-sdk-browser
Advanced tools
Comparing version 0.2.0 to 0.2.2
{ | ||
"name": "@gitlab/application-sdk-browser", | ||
"version": "0.2.0", | ||
"version": "0.2.2", | ||
"description": "Client side Browser SDK for GitLab Application services", | ||
@@ -59,3 +59,3 @@ "license": "MIT", | ||
}, | ||
"gitHead": "814fb6f65dc14c91481ce0ecff25060f9b932145" | ||
"gitHead": "3130e29ece2d2d34cc0addca3755fbe263aefb72" | ||
} |
@@ -1,2 +0,2 @@ | ||
# GitLab Application SDK -Browser | ||
# GitLab Application SDK - Browser | ||
@@ -14,3 +14,5 @@ This SDK is for usage of GitLab Application Services with vanilla Javascript in Browser. | ||
``` | ||
OR | ||
OR | ||
``` | ||
@@ -34,6 +36,8 @@ npm i @gitlab/application-sdk-browser | ||
<script src="https://unpkg.com/@gitlab/application-sdk-js/dist/gl-sdk.min.js"></script> | ||
<script>window.glClient = window.glSDK.glClientSDK({ | ||
<script> | ||
window.glClient = window.glSDK.glClientSDK({ | ||
appId: 'YOUR_APP_ID', | ||
host: 'YOUR_HOST', | ||
});</script> | ||
}); | ||
</script> | ||
``` | ||
@@ -44,7 +48,7 @@ | ||
```html | ||
<script src="https://unpkg.com/@gitlab/application-sdk-js@0.0.5/dist/gl-sdk.min.js"></script> | ||
<script src="https://unpkg.com/@gitlab/application-sdk-js@0.0.5/dist/gl-sdk.min.js"></script> | ||
``` | ||
## Browser-SDK initialization options | ||
## Browser-SDK initialization options | ||
Apart from `appId` and `host`, the options below allow you to configure the Browser SDK. | ||
@@ -59,6 +63,8 @@ | ||
trackerId?: string; | ||
pagePingTracking?: boolean | { | ||
minimumVisitLength?: number; | ||
heartbeatDelay?: number; | ||
}; | ||
pagePingTracking?: | ||
| boolean | ||
| { | ||
minimumVisitLength?: number; | ||
heartbeatDelay?: number; | ||
}; | ||
plugins?: AllowedPlugins; | ||
@@ -68,15 +74,14 @@ } | ||
| Option | Description | | ||
|:----------------|:------------------------------------------------------------------------------------------------------------------------------------------| | ||
| `appId` | This is the ID given by the GitLab Project Analytics setup guide. This is used to make sure your data is sent to your analytics instance. | | ||
| `host` | This is the GitLab Project Analytics instance that is given by the setup guide. | | ||
| `hasCookieConsent` | To use cookies to identify unique users and record their full IP address. This is set to `false` by default. When `false`, users will be considered anonymous users. No cookies or other storage mechanisms will be used to identify users.| | ||
| `respectGlobalPrivacyControl` | To respect the user's [GPC](https://globalprivacycontrol.org/) configuration to permit or refuse tracking. This is set to `true` by default. When `false`, events will be emitted regardless of user configuration. | | ||
| `trackerId` | The tracker id - also known as tracker namespace. The `trackerId` is used to differentiate between multiple trackers running on the same page or application, as each tracker instance can be configured differently to capture different sets of data. This identifier helps ensure that the data sent to the collector is correctly associated with the correct tracker configuration. `Default trackerId value is set as gitlab`. | | ||
| `pagePingTracking` | Page ping is a feature that allows you to `track user engagement on your website or application by sending periodic events while a user is actively browsing a page.` Page pings provide valuable insight into how users interact with your content, such as how long they spend on a page, which sections they are viewing, and if they are scrolling or not. `pagePingTracking` can be boolean or an object. If true it enables page ping with default options. if false, it will not enable page ping tracking. it can also be an object containing two options : `minimumVisitLength` - The minimum time that must have elapsed before first heartbeat. `heartbeatDelay` - The interval at which the callback is fired. | | ||
| `plugins` | Specify which plugins to enable or disable. By default all plugins are enabled. | | ||
| Option | Description | | ||
| :---------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| `appId` | This is the ID given by the GitLab Project Analytics setup guide. This is used to make sure your data is sent to your analytics instance. | | ||
| `host` | This is the GitLab Project Analytics instance that is given by the setup guide. | | ||
| `hasCookieConsent` | To use cookies to identify unique users and record their full IP address. This is set to `false` by default. When `false`, users will be considered anonymous users. No cookies or other storage mechanisms will be used to identify users. | | ||
| `respectGlobalPrivacyControl` | To respect the user's [GPC](https://globalprivacycontrol.org/) configuration to permit or refuse tracking. This is set to `true` by default. When `false`, events will be emitted regardless of user configuration. | | ||
| `trackerId` | The tracker id - also known as tracker namespace. The `trackerId` is used to differentiate between multiple trackers running on the same page or application, as each tracker instance can be configured differently to capture different sets of data. This identifier helps ensure that the data sent to the collector is correctly associated with the correct tracker configuration. `Default trackerId value is set as gitlab`. | | ||
| `pagePingTracking` | Page ping is a feature that allows you to `track user engagement on your website or application by sending periodic events while a user is actively browsing a page.` Page pings provide valuable insight into how users interact with your content, such as how long they spend on a page, which sections they are viewing, and if they are scrolling or not. `pagePingTracking` can be boolean or an object. If true it enables page ping with default options. if false, it will not enable page ping tracking. it can also be an object containing two options : `minimumVisitLength` - The minimum time that must have elapsed before first heartbeat. `heartbeatDelay` - The interval at which the callback is fired. | | ||
| `plugins` | Specify which plugins to enable or disable. By default all plugins are enabled. | | ||
### Plugins | ||
### Plugins | ||
- `Form Tracking`: Form tracking detects three event types: `change_form`, `submit_form` and `focus_form`. This will add event listeners to all form elements and to all interactive elements inside forms (that is, all `input`, `textarea`, and `select` elements). **Note:** that events on password fields will not be tracked. | ||
@@ -86,7 +91,6 @@ | ||
| Context | Example | | ||
|----------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------------------------------------------| | ||
| [iglu:org.ietf/http_client_hints/jsonschema/1-0-0](https://github.com/snowplow/iglu-central/blob/master/schemas/org.ietf/http_client_hints/jsonschema/1-0-0) | `{"isMobile" : false, "brands" : [{"brand" : "Google Chrome", version : "89"}, {"brand" : "Chromium", version : "89"}]}`| | ||
| Context | Example | | ||
| ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------ | | ||
| [iglu:org.ietf/http_client_hints/jsonschema/1-0-0](https://github.com/snowplow/iglu-central/blob/master/schemas/org.ietf/http_client_hints/jsonschema/1-0-0) | `{"isMobile" : false, "brands" : [{"brand" : "Google Chrome", version : "89"}, {"brand" : "Chromium", version : "89"}]}` | | ||
- `Link Click Tracking`: With this plugin, the tracker will add click event listeners to all link elements. Link clicks are tracked as self-describing events. Each link-click event captures the link’s href attribute. The event also has fields for the link’s id, classes, and target (where the linked document is opened, such as a new tab or new window). | ||
@@ -99,2 +103,3 @@ | ||
`By default all the plugins are enabled`. These plugins can be enabled or disabled through the `plugins` object: | ||
```ts | ||
@@ -111,4 +116,4 @@ const tracker = glClientSDK({ | ||
}); | ||
``` | ||
``` | ||
## Methods | ||
@@ -121,7 +126,7 @@ | ||
```javascript | ||
glClient.identify(userId, userAttributes) | ||
glClient.identify(userId, userAttributes); | ||
``` | ||
| Property | Type | Description | | ||
|:-----------------|:----------------------------|:------------------------------------------------------------------------------| | ||
| :--------------- | :-------------------------- | :---------------------------------------------------------------------------- | | ||
| `userId` | `String` | The user identifier your application users to identify individual users. | | ||
@@ -135,7 +140,7 @@ | `userAttributes` | `Object`/`Null`/`undefined` | The user attributes that need to be added to the session and tracking events. | | ||
```javascript | ||
glClient.page(eventAttributes) | ||
glClient.page(eventAttributes); | ||
``` | ||
| Property | Type | Description | | ||
|:------------------|:----------------------------|:------------------------------------------------------------------| | ||
| :---------------- | :-------------------------- | :---------------------------------------------------------------- | | ||
| `eventAttributes` | `Object`/`Null`/`undefined` | The event attributes that need to be added to the pageview event. | | ||
@@ -148,15 +153,16 @@ | ||
```javascript | ||
glClient.track(eventName, eventAttributes) | ||
glClient.track(eventName, eventAttributes); | ||
``` | ||
| Property | Type | Description | | ||
|:------------------|:----------------------------|:-----------------------------------------------------------------| | ||
| `eventName` | `String` | The name of the custom event. | | ||
| :---------------- | :-------------------------- | :--------------------------------------------------------------- | | ||
| `eventName` | `String` | The name of the custom event. | | ||
| `eventAttributes` | `Object`/`Null`/`undefined` | The event attributes that need to be added to the tracked event. | | ||
### `trackError` | ||
Used to capture errors. This works only when the `errorTracking` plugin is enabled. As mentioned in [Plugins](#plugins) section, By default it is enabled. | ||
```javascript | ||
glClient.trackError(eventAttributes) | ||
glClient.trackError(eventAttributes); | ||
``` | ||
@@ -176,3 +182,3 @@ | ||
colno: error.columnNumber || 0, // The column number where the error occurred (e.g., 6) | ||
error: error // The Error object itself | ||
error: error, // The Error object itself | ||
}); | ||
@@ -182,4 +188,4 @@ } | ||
| Property | Type | Description | | ||
|:------------------|:----------------------------|:-----------------------------------------------------------------| | ||
| Property | Type | Description | | ||
| :---------------- | :------- | :------------------------------------------------------------------------------------------------------------------- | | ||
| `eventAttributes` | `Object` | The event attributes that need to be added to the tracked event. `messeage` is a mandatory key in `eventAttributes`. | | ||
@@ -189,9 +195,10 @@ | ||
`addCookieConsent` is used to allow tracking of user identifiers via cookies. By default `hasCookieConsent` is false and no user identifiers are passed. To enable tracking of user identifiers call the `addCookieConsent` method. This is not needed if you intialised the Browser SDK with `hasCookieConsent` set to true. | ||
`addCookieConsent` is used to allow tracking of user identifiers via cookies. By default `hasCookieConsent` is false and no user identifiers are passed. To enable tracking of user identifiers call the `addCookieConsent` method. This is not needed if you intialised the Browser SDK with `hasCookieConsent` set to true. | ||
```javascript | ||
glClient.addCookieConsent() | ||
glClient.addCookieConsent(); | ||
``` | ||
## Devkit | ||
If you want to use the Browser SDK with [devkit](https://gitlab.com/gitlab-org/analytics-section/product-analytics/devkit), follow [devkit-developement guide](https://gitlab.com/gitlab-org/analytics-section/product-analytics/gl-application-sdk-js/-/blob/main/packages/browser-sdk/docs/devkit-development.md). | ||
@@ -198,0 +205,0 @@ |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
203998
204