Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

insights-js

Package Overview
Dependencies
Maintainers
1
Versions
21
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

insights-js - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

124

dist/insights-js.cjs.js

@@ -57,6 +57,14 @@ 'use strict';

var value = window.location.pathname;
if (hash)
value += window.location.hash;
if (search && !hash)
value += window.location.search;
var _hash = window.location.hash;
var _search = window.location.search;
if (hash && search) {
// the hash contains the search
value += _hash;
}
else if (hash) {
value += _hash.substr(0, _hash.length - _search.length);
}
else if (search) {
value += _search;
}
return { type: "path", value: value };

@@ -88,2 +96,5 @@ }

this.uniques = {};
// variables used when tracking pages
this.trackPageData = null;
this.trackPageChange = this.trackPageChange.bind(this);
}

@@ -98,2 +109,5 @@ /**

App.prototype.track = function (event) {
if (this.options.disabled) {
return Promise.resolve();
}
if (event.unique) {

@@ -119,2 +133,71 @@ var stringified = JSON.stringify(event);

};
/**
* Tracks page views. This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
App.prototype.trackPages = function (options) {
if (this.trackPageData) {
return this.trackPageData.result;
}
// Start tracking page changes
var interval = setInterval(this.trackPageChange, 2000);
// Calculate the data
var _a = options || {}, _b = _a.unique, unique = _b === void 0 ? true : _b, _c = _a.hash, hash = _c === void 0 ? false : _c, _d = _a.search, search = _d === void 0 ? false : _d;
this.trackPageData = {
unique: unique,
hash: hash,
search: search,
path: path(hash, search).value,
count: 1,
result: {
stop: function () {
clearInterval(interval);
}
}
};
// Track the first/current page view
this.trackSinglePage();
return this.trackPageData.result;
};
App.prototype.trackPageChange = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, hash = _a.hash, search = _a.search;
var newPath = path(hash, search).value;
if (newPath !== this.trackPageData.path) {
this.trackPageData.path = newPath;
this.trackPageData.count++;
this.trackSinglePage();
}
};
App.prototype.trackSinglePage = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, unique = _a.unique, path = _a.path, count = _a.count;
var params = {
path: path,
referrer: referrer(),
locale: locale(),
screenType: screenType()
};
if (unique && count === 1) {
params.unique = "Yes";
}
this.track({
id: "page-view",
parameters: params
});
};
return App;

@@ -128,3 +211,5 @@ }());

* @param projectId The project for which to initialize the library
* @param options The options
* @param options The options to use
*
* @returns The default app
*/

@@ -135,3 +220,5 @@ function init(projectId, options) {

}
apps.push(new App(projectId, options));
var result = new App(projectId, options);
apps.push(result);
return result;
}

@@ -149,3 +236,27 @@ /**

}
/**
* Tracks page views using the default app.
* This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`.
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
function trackPages(options) {
var app = apps[0];
if (!app)
throw new Error("No intialized apps!");
return app.trackPages(options);
}
exports.App = App;
exports.apps = apps;

@@ -155,1 +266,2 @@ exports.init = init;

exports.track = track;
exports.trackPages = trackPages;

@@ -53,6 +53,14 @@ // not supported by the server just yet!

var value = window.location.pathname;
if (hash)
value += window.location.hash;
if (search && !hash)
value += window.location.search;
var _hash = window.location.hash;
var _search = window.location.search;
if (hash && search) {
// the hash contains the search
value += _hash;
}
else if (hash) {
value += _hash.substr(0, _hash.length - _search.length);
}
else if (search) {
value += _search;
}
return { type: "path", value: value };

@@ -84,2 +92,5 @@ }

this.uniques = {};
// variables used when tracking pages
this.trackPageData = null;
this.trackPageChange = this.trackPageChange.bind(this);
}

@@ -94,2 +105,5 @@ /**

App.prototype.track = function (event) {
if (this.options.disabled) {
return Promise.resolve();
}
if (event.unique) {

@@ -115,2 +129,71 @@ var stringified = JSON.stringify(event);

};
/**
* Tracks page views. This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
App.prototype.trackPages = function (options) {
if (this.trackPageData) {
return this.trackPageData.result;
}
// Start tracking page changes
var interval = setInterval(this.trackPageChange, 2000);
// Calculate the data
var _a = options || {}, _b = _a.unique, unique = _b === void 0 ? true : _b, _c = _a.hash, hash = _c === void 0 ? false : _c, _d = _a.search, search = _d === void 0 ? false : _d;
this.trackPageData = {
unique: unique,
hash: hash,
search: search,
path: path(hash, search).value,
count: 1,
result: {
stop: function () {
clearInterval(interval);
}
}
};
// Track the first/current page view
this.trackSinglePage();
return this.trackPageData.result;
};
App.prototype.trackPageChange = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, hash = _a.hash, search = _a.search;
var newPath = path(hash, search).value;
if (newPath !== this.trackPageData.path) {
this.trackPageData.path = newPath;
this.trackPageData.count++;
this.trackSinglePage();
}
};
App.prototype.trackSinglePage = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, unique = _a.unique, path = _a.path, count = _a.count;
var params = {
path: path,
referrer: referrer(),
locale: locale(),
screenType: screenType()
};
if (unique && count === 1) {
params.unique = "Yes";
}
this.track({
id: "page-view",
parameters: params
});
};
return App;

@@ -124,3 +207,5 @@ }());

* @param projectId The project for which to initialize the library
* @param options The options
* @param options The options to use
*
* @returns The default app
*/

@@ -131,3 +216,5 @@ function init(projectId, options) {

}
apps.push(new App(projectId, options));
var result = new App(projectId, options);
apps.push(result);
return result;
}

@@ -145,3 +232,26 @@ /**

}
/**
* Tracks page views using the default app.
* This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`.
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
function trackPages(options) {
var app = apps[0];
if (!app)
throw new Error("No intialized apps!");
return app.trackPages(options);
}
export { apps, init, parameters, track };
export { App, apps, init, parameters, track, trackPages };

@@ -59,6 +59,14 @@ (function (global, factory) {

var value = window.location.pathname;
if (hash)
value += window.location.hash;
if (search && !hash)
value += window.location.search;
var _hash = window.location.hash;
var _search = window.location.search;
if (hash && search) {
// the hash contains the search
value += _hash;
}
else if (hash) {
value += _hash.substr(0, _hash.length - _search.length);
}
else if (search) {
value += _search;
}
return { type: "path", value: value };

@@ -90,2 +98,5 @@ }

this.uniques = {};
// variables used when tracking pages
this.trackPageData = null;
this.trackPageChange = this.trackPageChange.bind(this);
}

@@ -100,2 +111,5 @@ /**

App.prototype.track = function (event) {
if (this.options.disabled) {
return Promise.resolve();
}
if (event.unique) {

@@ -121,2 +135,71 @@ var stringified = JSON.stringify(event);

};
/**
* Tracks page views. This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
App.prototype.trackPages = function (options) {
if (this.trackPageData) {
return this.trackPageData.result;
}
// Start tracking page changes
var interval = setInterval(this.trackPageChange, 2000);
// Calculate the data
var _a = options || {}, _b = _a.unique, unique = _b === void 0 ? true : _b, _c = _a.hash, hash = _c === void 0 ? false : _c, _d = _a.search, search = _d === void 0 ? false : _d;
this.trackPageData = {
unique: unique,
hash: hash,
search: search,
path: path(hash, search).value,
count: 1,
result: {
stop: function () {
clearInterval(interval);
}
}
};
// Track the first/current page view
this.trackSinglePage();
return this.trackPageData.result;
};
App.prototype.trackPageChange = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, hash = _a.hash, search = _a.search;
var newPath = path(hash, search).value;
if (newPath !== this.trackPageData.path) {
this.trackPageData.path = newPath;
this.trackPageData.count++;
this.trackSinglePage();
}
};
App.prototype.trackSinglePage = function () {
if (!this.trackPageData)
return;
var _a = this.trackPageData, unique = _a.unique, path = _a.path, count = _a.count;
var params = {
path: path,
referrer: referrer(),
locale: locale(),
screenType: screenType()
};
if (unique && count === 1) {
params.unique = "Yes";
}
this.track({
id: "page-view",
parameters: params
});
};
return App;

@@ -130,3 +213,5 @@ }());

* @param projectId The project for which to initialize the library
* @param options The options
* @param options The options to use
*
* @returns The default app
*/

@@ -137,3 +222,5 @@ function init(projectId, options) {

}
apps.push(new App(projectId, options));
var result = new App(projectId, options);
apps.push(result);
return result;
}

@@ -151,3 +238,27 @@ /**

}
/**
* Tracks page views using the default app.
* This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`.
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
function trackPages(options) {
var app = apps[0];
if (!app)
throw new Error("No intialized apps!");
return app.trackPages(options);
}
exports.App = App;
exports.apps = apps;

@@ -157,2 +268,3 @@ exports.init = init;

exports.track = track;
exports.trackPages = trackPages;

@@ -159,0 +271,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

@@ -10,2 +10,7 @@ /**

ignoreErrors?: boolean;
/**
* When `true`, all calls are disabled.
* This flag is useful to disable the tracking based on the environment/URL.
*/
disabled?: boolean;
}

@@ -134,2 +139,32 @@ /**

/**
* The options to use when tracking pages
*/
export interface TrackPagesOptions {
/**
* When `true`, tracks unique page views and the bounce rate in addition to total page views.
*
* `true` by default.
*/
unique?: boolean;
/**
* `true` to track the hash portion of the URL.
*
* `false` by default.
*/
hash?: boolean;
/**
* `true` to track the search portion of the URL.
*
* `false` by default.
*/
search?: boolean;
}
/**
* The object returned by `App.trackPages()`, used to stop tracking pages.
*/
export interface TrackPagesResult {
/** Stops the tracking of pages. */
stop(): void;
}
/**
* A class that contains a `projectId` and related configuration to track events painlessly.

@@ -141,2 +176,3 @@ */

private uniques;
private trackPageData;
constructor(projectId: string, options?: AppOptions);

@@ -151,2 +187,21 @@ /**

track(event: TrackEventPayload): Promise<void>;
/**
* Tracks page views. This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
trackPages(options?: TrackPagesOptions): TrackPagesResult;
private trackPageChange;
private trackSinglePage;
}
import * as parameters from "./parameters";
import { App, AppOptions, TrackEventPayload } from "./App";
import { App, AppOptions, TrackEventPayload, TrackPagesOptions, TrackPagesResult } from "./App";
export { parameters };
export { App };
export declare const apps: App[];

@@ -9,5 +10,7 @@ /**

* @param projectId The project for which to initialize the library
* @param options The options
* @param options The options to use
*
* @returns The default app
*/
export declare function init(projectId: string, options?: AppOptions): void;
export declare function init(projectId: string, options?: AppOptions): App;
/**

@@ -19,1 +22,19 @@ * Tracks an event using the default app, you must call `init()` before calling this.

export declare function track(event: TrackEventPayload): void;
/**
* Tracks page views using the default app.
* This method checks if the URL changed every so often and tracks new pages accordingly.
*
* **Important note on bounce rate and unique views:**
*
* This method does not store any cookie or local storage, it expects that you use a client-side router.
* e.g. `react-router`, `nextjs`'s router, etc...
* The bounce rate and unique views will not be accurate if you do not use a client-side router,
* in these cases, user `trackPages(false)` to disable tracking of the bounce rate and unique page views.
*
* By default, does not track the `location.hash` nor the `location.search`.
*
* @param options The options to use for the tracking
*
* @returns An object of the form `{ stop(): void }` to stop the tracking
*/
export declare function trackPages(options?: TrackPagesOptions): TrackPagesResult;

2

package.json
{
"name": "insights-js",
"version": "0.2.0",
"version": "0.3.0",
"description": "Javascript client for getinsights.io",

@@ -5,0 +5,0 @@ "keywords": [],

@@ -76,5 +76,6 @@ # Insights-js

track({
id: "user-subscribed",
id: "user-registered",
parameters: {
plan: "Startup"
method: "google",
from: "top-link"
}

@@ -85,3 +86,3 @@ })

Here is the result in the dashboard:
![Event User Subscribed in dashboard](./images/user-subscribed.png)
![Event User Registered in dashboard](./images/user-registered.png)

@@ -109,3 +110,3 @@ ### Custom parameters

See the full list [in the API documentation](#parameters).
See the full list [in the parameters'API documentation](#parameters).

@@ -149,6 +150,45 @@ ### Untracking events

### Tracking page views
TODO
### Tracking on multiple projects
The calls to `init()` and `track()` are wrappers are methods on the `App` class.
You may instantiate any use one app per project - with or without the default App:
```js
import { App } from "insights-js"
// equivalent to init("project-1-id")
const app1 = new App("project-1-id")
const app2 = new App("project-2-id")
// will show up in project 1's dashboard
app1.track({
id: "user-registered",
parameters: {
method: "google",
from: "top-link"
}
})
// will show up in project 2's dashboard
app2.track({
id: "read-post",
parameters: {
// this will track the locale of the user, useful to know if we should translate our posts
locale: parameters.locale(),
// this will track the type of screen on which the user reads the post, useful for useability
screenSize: parameters.screenType()
}
})
```
## API
### init(projectId, options)
See the detailed API documentation [in the docs folder](./docs/README.md).
### `init(projectId, options)`
```ts

@@ -166,21 +206,59 @@ init(projectId: string, options?: InitOptions): void

_Optional_
_Default value:_ `{}`
| Option |  Default Value | Description |
| ------------ | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
| ignoreErrors | `false` | When set to `true` any error that may occur when tracking events will be ignored. It is reccomended to set this flag to `true` on production. |
`options.ignoreErrors: boolean`
_Optional_
_Default value:_ `false`
When set to `true` any error that may occur when tracking events will be ignored. It is reccomended to set this flag to `true` on production.
### track(event)
`options.disabled: boolean`
_Optional_
_Default value:_ `false`
When set to `true`, all calls are disabled.
This flag is useful to disable the tracking based on the environment or URL.
#### arguments
### `track(event)`
```ts
track(event: Event): Promise<void>
```
**arguments**
`event: Event`
_Mandatory_
The event to track
| Event attribute |  Default Value | Description |
| --------------- | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| id | | The id of the event to track, should be a human readable id in `kebab-case` |
| parameters | `{}` | A map of `key -> value` pairs. Getinsights keeps track of the number of events logged for each value. |
| unique | `false` | When true, check if a similar event (i.e. same id & same parameters), has already been logged **with the unique flag** in this session. If a similar event has already been logged, it skips it. |
| remove | `false` | Certain events last through time and may be undone or cancelled after they have been logged. For example, when tracking subscription to services or people. For these events, it is very useful to be able to know: when an event is tracked, when an event is marked as cancelled, the current number of active (`tracked - cancelled`) events. When this flag is set to `true`, the given event is marked as cancelled. |
`event.id: string`
_Mandatory_
The id of the event to track, should be a human readable id in `kebab-case`.
`event.parameters: { [key: string]: string }`
_Optional_
_Default value:_ `{}`
A map of `(key: string) -> (value: string)` pairs.
Getinsights keeps track of the number of events logged for each value.
You may also use the `parameters` variable to generate built-in values.
See the full list [in the parameters'API documentation](#parameters).
`event.unique: boolean`
_Optional_
_Default value:_ `false`
When true, check if a similar event (i.e. same id & same parameters), has already been logged **with the unique flag** in this session.
If a similar event has already been logged, it skips it.
`event.remove: boolean`
_Optional_
_Default value:_ `false`
Certain events last through time and may be undone or cancelled after they have been logged.
For example, when tracking subscription to services or people.
For these events, it is very useful to be able to know:
- when an event is tracked
- when an event is marked as cancelled
- the current number of active (`tracked - cancelled`) events.
When this flag is set to `true`, the given event is marked as cancelled.
**Examples:**

@@ -227,30 +305,54 @@

### `trackPage(options)`
```ts
trackPage(options?: TrackPageOptions): TrackPageResult
```
TODO
**arguments**
### Parameters
#### parameters.locale()
#### `parameters.locale()`
Tracks the `locale` of the current user, for example: `en-US`, `pt-BR` or `fr-FR`
Gets the `locale` of the current user, for example: `en-US`, `pt-BR` or `fr-FR`.
#### parameters.screenType()
#### `parameters.screenType()`
Tracks the type of screen the user is currently on:
Gets the type of screen the user is currently on, possible return values:
| Screen | Value | Description |
| --------- | ----- | ------------- |
| `<= 414` | `xs` | Mobile phone |
| `<= 800` | `s` | Tablet |
| `<= 1200` | `m` | Small laptop |
| `<= 1600` | `l` | Small desktop |
| `> 1600` | `xl` | Large desktop |
- `"xs"` if `screen width <= 414px`: Mobile phone
- `"s"` if `screen width <= 800px`: Tablet
- `"m"` if `screen width <= 1200px`: Small laptop
- `"l"` if `screen width <= 1600px`: Large laptop / small desktop
- `"xl"` if `screen width > 1600px`: Large desktop
#### parameters.referrer()
#### `parameters.referrer()`
Tracks the referrer of the user.
Gets the referrer of the user.
#### parameters.path()
For example `"https://google.com"` if the user came from Google.
Tracks the current path (segment of the URL after the domain) of the user.
#### `parameters.path(hash, search)`
```ts
path(hash?: boolean, search?: boolean)
```
Gets the current path (segment of the URL after the domain) of the user.
`hash?: boolean`
_Optional_
_Default value:_ `false`
When `true`, also returns the hash segment of the URL.
`search?: boolean`
_Optional_
_Default value:_ `false`
When `true`, also returns the search segment of the URL.
## License
MIT
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc