trackjs / trackjs-package Goto Github PK
View Code? Open in Web Editor NEWJavaScript Browser Error Monitoring Agent from TrackJS
Home Page: https://trackjs.com
License: Other
JavaScript Browser Error Monitoring Agent from TrackJS
Home Page: https://trackjs.com
License: Other
As part of my application i need to use web worker(s).
I looked into the documentation and it seems that i must have the window
object in order to configure TrackJS.
Please provide support for using and monitoring js errors on web workers.
Sometimes you want to look into trackjs
source code directly to understand what's going on.
With the actual state, it's minified and mangled - therefore it's boring and time consuming.
Hi I my company think to combine our react app with track js
currently, we make use of the trial version, and the track js didnt cutch this spesific network error (413),
I'd like it if you could help us,
thanks.
I recently started using the ember-cli trackjs addon and started getting this error. The addon added crossorigin="anonymous"
to the script tag. I'm not sure if this is actually an issue, but since it prevented the script from loading I though I'd bring it to your attention.
Access to Script at 'https://d2zah9y47r7bi2.cloudfront.net/releases/current/tracker.js'
from origin 'http://localhost:5000' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the
requested resource. Origin 'http://localhost:5000' is therefore not allowed access.
After upgrading to v3 whenever we call TrackJS.track() in our code it outputs a warning
TrackJS: agent must be installed t.js:55
we first load trackjs agent lib and then call TrackJS.install but something isn't entirely right
When I finally got react-native to load the "npm module" with config I ran into a an error that Image is not a function. Since ReactNative doesn't have a browser is there any way to polyfill Image to NoOp and still have the library work?
This line seems to throw: (new Image).src=this.trackerFaultEndpoint(a))
c.open(a,b)):c=null;return c},sendTrackerFault:function(a){this.throttle(a)||((new Image).src=this.trackerFaultEndpoint(a))},sendUsage:function(a){(new Image).src=this.usageEndpoint(a)},sendError:function(a,b){var c=this;if(!this.disabled&&!this.throttle(a))try{var d=this.getCORSRequest("POST",this.errorEndpoint(b));d.onreadystatechange=function(){4===d.readyState&&200!==d.status&&(c.disabled=!0)};d._trackJs=k;d.send(h.JSON.stringify(a))}catch(e){throw this.disabled=!0,e;}},throttle:function(a){var b=
I love TrackJS but am super bummed I can't use it in my new business ๐ฆ
After including this snippet in my page header (between the tags)
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-JX6YMC6L6X"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-JX6YMC6L6X');
</script>
<script data-consolejs-channel="16aca95e-4af3-a026-5531-f988d20c73f8" src="https://remotejs.com/agent/agent.js"></script>
I show this in https://remotejs.com/viewer/16aca95e-4af3-a026-5531-f988d20c73f8
Invalid escape sequence
value@https://remotejs.com/agent/agent.js:14:119320
value@https://remotejs.com/agent/agent.js:14:119447
value@https://remotejs.com/agent/agent.js:14:120198
A@https://remotejs.com/agent/agent.js:14:116061
e.cloneWindow@https://remotejs.com/agent/agent.js:14:124216
A/<@https://remotejs.com/agent/agent.js:14:30109
Not sure what to do to resolve.
dedupe
looks handy and it's in the docs. If it's real, could it be added to tracker.d.ts please? Also, what is its default?
Please export the TrackJS npm published module so that we can require it.
The following code should be supported:
var TrackJs = require("trackjs");
TrackJs.configure({
token: "token"
});
TrackJs.track("test")
Unfortunately TrackJS module on NPM seems to not export its content and use a trackJs
global variable, and also seems to require the token to be configured before lib loading, making call to configure with a token useless according to this warning
TrackJS could not find a token
I'm testing TrackJS and Errorception to see which fit best my needs.
Here's my integration:
<!-- Errorception -->
<script crossorigin>
(function(_,e,rr,s){_errs=[s];var c=_.onerror;_.onerror=function(){var a=arguments;_errs.push(a);
c&&c.apply(this,a)};var b=function(){var c=e.createElement(rr),b=e.getElementsByTagName(rr)[0];
c.src="//beacon.errorception.com/"+s+".js";c.async=!0;b.parentNode.insertBefore(c,b)};
_.addEventListener?_.addEventListener("load",b,!1):_.attachEvent("onload",b)})
(window,document,"script","token");
</script>
<!-- TrackJs -->
<script type="text/javascript">window._trackJs = { token: 'token' };</script>
<script type="text/javascript" src="//d2zah9y47r7bi2.cloudfront.net/releases/current/tracker.js" crossorigin></script>
It seems TrackJS overrides Errorception listener because only TrackJS receive the errors
<!-- TrackJs -->
<script type="text/javascript">window._trackJs = { token: 'token' };</script>
<script type="text/javascript" src="//d2zah9y47r7bi2.cloudfront.net/releases/current/tracker.js" crossorigin></script>
<!-- Errorception -->
<script crossorigin>
(function(_,e,rr,s){_errs=[s];var c=_.onerror;_.onerror=function(){var a=arguments;_errs.push(a);
c&&c.apply(this,a)};var b=function(){var c=e.createElement(rr),b=e.getElementsByTagName(rr)[0];
c.src="//beacon.errorception.com/"+s+".js";c.async=!0;b.parentNode.insertBefore(c,b)};
_.addEventListener?_.addEventListener("load",b,!1):_.attachEvent("onload",b)})
(window,document,"script","token");
</script>
By registering Errorception after TrackJS it works better because Errorception does not override onerror set by Trackjs but simply proxy it.
The latest 3.0 update breaks applications that are intended to run in both the browser and node - it's impossible to import
the package without it doing something with the window
.
It would be nice if errors that occurred above a frequency threshold made a Trello card in a board of your choosing. Rollbar has this feature and it's quite helpful.
The license file in trackjs-package doesn't appear to reference the code in the package itself, but instead appears to be a copy of the terms of service for trackjs.com. Can you please clarify what license covers the code in this package?
If the trackjs script is blocked by a tracker blocker, you'd likely get TrackJS is not defined
when attempting to call install
. Perhaps this:
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script>
<script>
TrackJS && TrackJS.install({
token: "..."
// for more configuration options, see https://docs.trackjs.com
});
</script>
We recently added TrackJS to an Angular 2 project and found that in some cases the view wasn't updating after HTTP requests. The HTTP success/fail handlers didn't appear to be running inside Angular's NgZone
. We were able to confirm this by either injecting the NgZone
service and wrapping the handlers' logic in ngZone.run(...)
, or injecting the ChangeDetectorRef
and running changeDetector.detectChanges()
, both of which fixed the issue. We're using Angular's Http
service, so it definitely should be running the handlers inside NgZone
, we shouldn't need to manually use NgZone
or ChangeDetectorRef
in this case.
Disabling the TrackJS tracker fixes the issue, but as far as we can tell this is a load order conflict with the TrackJS tracker because moving the tracker config and loader to the end of <body>
instead of <head>
also fixes the issue for us. We're using this as a temporary workaround but we'd ideally like to move the tracker back to <head>
so that we can catch errors that might happen during Angular's initialisation.
When import is used in typescript code
import { trackJs } from 'trackjs';
I am getting this error:
File '.../node_modules/trackjs/tracker.d.ts' is not a module
Many of the configuration options are not actually configurable after initialisation.
I would be very useful if we could do
trackJs.console.debug("a message", someObject)
Where the second parameter would be serialized.
Currently we need to either send two log messages, or serialize on our own.
I'm trying to use trackJs in Angular 2 with typescript / angular-cli, and am getting this error during the webpack bundling:
File '.../node_modules/trackjs/tracker.d.ts' is not a module.
I am importing trackjs as follows:
import { trackJs } from 'trackjs/tracker';
Any help? I'm relatively new to typescript...
As the documentation states (https://docs.trackjs.com/browser-agent/sdk-reference/agent-config/#consolewarn) the TrackJSInstallOptions.console
should also have the property warn
as an optional boolean
Hi,
your library has no license and my company needs one for each lib we use.... could you add one?
I have TrackJs disabled when our test suite is run, but TrackJs still attempts to look for a token and warns if one isn't found. Outputting in our logs (which isn't a problem, just a bit annoying)
---
Log: |
{ type: 'warn', text: '\'TrackJS could not find a token\'\n' }
...
GET https://cdn.trackjs.com/releases/3.0.0/tracker.js
returns Access Denied now, it used to work with all 2.x versions
we want to fetch a specific version of trackjs not always latest because we use integrity hashes
A little while ago we updated the tracker.js library to a version which added support for fetch
(2.8.0). After doing that, we started seeing a lot of errors with the message undefined undefined: undefined undefined
, marked as an "Ajax error".
After digging through the minified code a bit, I found the following lines within the fetch
-patch code:
return h.then(function(d) {
var e = a.get("n", h._tjsId);
e && (f.defaults(e, {
completedOn: f.isoNow(),
statusCode: d.status,
statusText: d.statusText
}), b.error && 400 <= d.status && c("ajax", e.statusCode + " " + e.statusText + ": " + e.method +
" " + e.url));
return d
})
This seems to be the culprit of the issue. I'm unsure if this is a bug in the tracker library or a bug on our side. I'm guessing maybe it is caused by an empty server Response
or similar.
Note that we are currently on the latest version of the tracker (2.8.4), but we still see the issue.
When running my app locally, I got TrackJs working in a browserify bundled file by setting token before init and by using the global variable. (see #2)
But then when I call trackJs.track("test") it tries to post the error to localhost, resulting in an error.
My server is localhost:9000, but the served html page for my SPA has a head base url = localhost:8080. I don't know at all why TrackJs would use this url instead of an hardcoded url to your API
The new types export a namespace, but should export a declared instance of an interface and expose it globally as well.
Something like this:
// Type definitions for TrackJS 3.0.0
// Project: https://github.com/TrackJS/trackjs-package
export interface TrackJSObject {
/**
* Adds a new key-value pair to the metadata store. If the key already exists
* it will be updated.
*
* @param {String} key
* @param {String} value
*/
addMetadata(key: string, value: string): void
/**
* Invokes the provided function within a try/catch wrapper that forwards
* the error to TrackJS.
*
* @param {Function} func The function to be invoked.
* @param {Object} context The context to invoke the function with.
* @param {...} Additional arguments passed to the function.
* @return {*} Output of the function.
*/
attempt(func: Function, context?: any, ...args: any[]): any
/**
* Configures the instance of TrackJS with the provided configuration.
*
* @param {Object} options The Configuration object to apply
* @returns {Boolean} True if the configuration was successful.
*/
configure(options: TrackJSConfigureOptions): boolean
/**
* Non-exposed browser console logging. Use this private console to prevent
* messages from being exposed into the standard browser console.
*/
console: {
/**
* Records context into the Telemetry log with normal severity
*
* @param {...} args Arguments to be serialized into the Telemetry log.
*/
log(...args: any[]): void
/**
* Records context into the Telemetry log with DEBUG severity
*
* @param {...} args Arguments to be serialized into the Telemetry log.
*/
debug(...args: any[]): void
/**
* Records context into the Telemetry log with INFO severity
*
* @param {...} args Arguments to be serialized into the Telemetry log.
*/
info(...args: any[]): void
/**
* Records context into the Telemetry log with WARN severity
*
* @param {...} args Arguments to be serialized into the Telemetry log.
*/
warn(...args: any[]): void
/**
* Records context into the Telemetry log with ERROR severity. If console
* errors are enabled, which is default, this will also transmit an error.
*
* @param {...} args Arguments to be serialized into the Telemetry log.
*/
error(...args: any[]): void
}
/**
* Running version of the tracker script
*/
hash: string
/**
* Installs the agent into the current browser document.
*
* @param options The configuration object to apply.
*/
install(options: TrackJSInstallOptions): boolean
/**
* Removes a key from the metadata store, if it exists.
*
* @param {String} key
*/
removeMetadata(key: string): void
/**
* Directly invokes an error to be sent to TrackJS.
*
* @param {Error|Object|String} error The error to be tracked. If error does
* not have a stacktrace, will attempt to generate one.
*/
track(error: Error | Object | String): void
/**
* Running version of the tracker script
*/
version: string
/**
* Returns a wrapped and watched version of the function to automatically
* catch any errors that may arise.
*
* @param {Function} func The function to be watched.
* @param {Object} context The context to invoke the function with.
* @return {Function} Wrapped function
*/
watch(func: Function, context?: any): Function
/**
* Wrap and watch all of the functions on an object that will
* automatically catch any errors that may arise.
*
* @param {Object} obj The Object containing functions to be watched
* @return {Object} Object now containing wrapped functions.
*/
watchAll(obj: Object): Object
}
/**
* String formatted as an ISO-8601 Date. Example 0000-00-00T00:00:00.000Z
*/
export interface ISO8601DateString extends String {}
/**
* Payload of an error sent to TrackJS. Useful when manipulating errors via
* the `onError` callback.
*/
export interface TrackJSErrorPayload {
/** Stack trace at time of asynchronous callback binding. */
bindStack?: string
/** Timestamp of the asynchronous callback binding. */
bindTime?: ISO8601DateString
/** Browser Console Telemetry */
console: {
/** Timestamp the event occurred */
timestamp: ISO8601DateString
/** Console severity of the event */
severity: string
/** Formatted message captured */
message: string
}[]
/** Context provided about the customer session */
customer: {
/** Customer application id */
application?: string
/** Unique Id describing the current page view */
correlationId: string
/** Customer-provided visitor session ID */
sessionId?: string
/** Customer token */
token: string
/** Customer-provided visitor user ID */
userId?: string
/** Customer-provided system version ID */
version?: string
}
/** How the error was captured. */
entry: string
/** Context about the browser environment */
environment: {
/** How long the visitor has been on the page in MS */
age: number
/** Other discovered JavaScript libraries on the DOM. */
dependencies: {[name: string]: string}
/** browser userAgent string */
userAgent: string
/** current window height */
viewportHeight: number
/** current window width */
viewportWidth: number
}
/** Custom environment metadata. */
metadata: {
/** metadata group name */
key: string
/** metadata value */
value: string
}[]
/** Error message */
message: string
/** Navigation Telemetry */
nav: {
/** Timestamp of the navigation event */
on: ISO8601DateString
/** Navigation method used. IE "replaceState" "setState" */
type: string
/** Previous URL */
from: string
/** New URL */
to: string
}[]
/** Network Telemetry */
network: {
/** Timestamp the request started */
startedOn: ISO8601DateString
/** Timestamp the request completed */
completedOn: ISO8601DateString
/** HTTP Method used */
method: string
/** URL Requested */
url: string
/** HTTP Status Code */
statusCode: number
/** HTTP Status Text */
statusText: string
/** Mechanism of network use. IE "fetch", "xhr" */
type: string
}[]
/** location of the browser at the time of the error */
url: string
/** stack trace */
stack: string
/** client-reported time the error occurred */
timestamp: ISO8601DateString
/** Visitor Action Telemetry */
visitor: {
/** timestamp the event occurred */
timestamp: ISO8601DateString
/** visitor action taken. "input" or "click" */
action: string
/** DOM element acted upon */
element: {
/** name of the element tag. IE "input" */
tag: string
/** hashmap of element attributes */
attributes: {[attributeName: string]: string}
/** value of the element */
value: {
/** Number of characters in the value */
length: number
/** Patterns describing the value. */
pattern: string
}
}
}[]
/** version of the tracker.js lib */
version: string
/** Number of messages throttled clientside */
throttled: number
}
/**
* Configuration options that can be passed to `trackJs.configure()`
*/
export interface TrackJSConfigureOptions {
/**
* Whether duplicate errors should be suppressed before sending.
* @default true
*/
dedupe?: boolean
/**
* Whether to attempt discovery of other JavaScript libs on the page.
* @default true
*/
dependencies?: boolean
/**
* Custom handler to be notified *before* an error is transmitted. Can be used
* to modify or ignore error data.
*/
onError?: (payload: TrackJSErrorPayload) => boolean
/**
* Custom handler for serializing non-string data in errors and telemetry
* events.
*/
serialize?: (what: any) => string
/**
* Id of the visitor session. Use this to correlate TrackJS
* Error reports with other reporting data.
*/
sessionId?: string
/**
* Id of the visitor. Use this to identify the current user for support.
*/
userId?: string
/**
* Id of the running application. Recommend to use either a SEMVER
* representation, or a VCS Hash Key.
*/
version?: string
}
/**
* Configuration options that are initialized from `window._trackJs`
*/
export interface TrackJSInstallOptions extends TrackJSConfigureOptions {
/**
* TrackJS Application token. Get this from `https://my.trackjs.com/Account/Applications`
*/
application?: string
callback?: {
/**
* Whether errors should be recorded when caught from callback functions.
* @default true
*/
enabled?: boolean
/**
* Whether stack traces should be generated at the time of invocation of an
* asynchronous action. This will produce stack traces similar to the
* "async" traces in Chrome Developer tools.
* There is a performance impact to enabling this. Confirm behavior in your
* application before releasing.
* default false.
*/
bindStack?: boolean
}
console?: {
/**
* Whether events should be recorded from the console.
* @default true
*/
enabled?: boolean
/**
* Whether console messages should be passed through to the browser console
* or hidden by TrackJS. Useful for removing debug messaging from production.
* @default true
*/
display?: boolean
/**
* Whether an error should be recorded by a call to `console.error`.
* @default true
*/
error?: boolean
/**
* Limit the console functions to be watched by whitelisting them here.
* @default ["log","debug","info","warn","error"]
*/
watch?: string[]
}
/**
* Whether the tracker script is enabled.
* @default true
*/
enabled?: boolean
network?: {
/**
* Whether events should be recorded from the network.
* @default true
*/
enabled?: boolean
/**
* Whether an error should be recorded by XHR responses with status code
* 400 or greater.
* @default true
*/
error?: boolean
}
/**
* Your account token. Get this from `https://my.trackjs.com/install`
*/
token: string
visitor?: {
/**
* Whether events should be recorded from the visitor actions.
* @default true
*/
enabled?: boolean
}
window?: {
/**
* Whether events should be recorded from globally unhandled errors.
* @default true
*/
enabled?: boolean
/**
* Whether events should be recorded from globally unhandled promise
* rejections, if supported.
* @default true
*/
promise?: boolean
}
}
declare var TrackJS: TrackJSObject
declare global {
var TrackJS: TrackJSObject | undefined
}
export {TrackJS}
Since you already provide a way for it to be configured post-initialisation please also provide a way to initialise the library without a token.
Use Case:
My build script (Ember CLI) concatenates all my bower_components
into a single file. I wish to configure the token at runtime depending on environment variables etc. My index.html is clean and I don't want to paste a snippet in there to preconfigure a token.
The error I get originates from here.
According to the documentation, this module only understands the data-token
attribute, but doesn't allow to set an application
:
window._trackJs = {
token: "................",
application: "MyApp"
// other configuration
}
We started to use AbortController
with fetch
and found new issue in trackjs package:
After some research I found that when fetch
is aborted it will be rejected with DOMException
https://fetch.spec.whatwg.org/#abort-fetch
https://github.com/github/fetch/blob/master/fetch.js#L446
but message in DOMException
is read only:
https://heycam.github.io/webidl/#idl-DOMException
https://developer.mozilla.org/en-US/docs/Web/API/DOMException/message
Could you please fix that
Hi,
I am using trackJs with my production application and after multiple hit and trial came to know that track js is blocking my page rendering with google webmaster so now i delayed the script loading and it worked fine for now but i know this is not the solution can u you please help me how to handle this case.
I am using reactJs 16.3 and i am loading my js inside didmount.
Thanks,
Pradeep
Background:
We use request abort feature and it cause a lot of network errors which doesn't make sense for us.
In theory it can be done via ignore rules, but it isn't really useful when we have multiple languages and browsers generate different messages.
I found in source code that you pass second argument into onError function which contains name of original error, in short term we will use it, but it would be better if you describe this argument or add name to payload.
I'm going to use this function to avoid abort errors:
(payload: TrackJSErrorPayload, err?: { name: string }) => {
return !(payload.entry === 'ajax' && err?.name === 'AbortError');
}
We're getting a the following error from a few logged out Chrome users:
Message:
Not a Product
It's pointing to the following places in the tracker script:
{anonymous} @ https://cdn.trackjs.com/releases/current/tracker.js 45:47 Why is This Here?
E @ https://cdn.trackjs.com/releases/current/tracker.js 5:415
Thanks! ๐
When TrackJS is included in our code, all console output appears to come from tracker.js:13
in DevTools. This makes it difficult to figure out where a problem might be and diagnose it via debugging, because there's nothing tying an output back to its generating lines of code.
This causes typescript error when trying to use isInstalled
.
My company is migrating our browser client to rust-wasm, and I'm wondering if there are any thoughts towards TrackJs supporting that environment?
Currently we are planning on just wrapping the TrackJs client to expose the API in rust, but a deeper integration would be nice.
Looks like sentry is doing it for native rust at least https://blog.sentry.io/2018/10/22/getting-started-with-rust-error-tracking
I'm trying out track.js (really cool by the way), but I'm running into a problem, and I think it's because I'm using Marionette.
I'm trying the trackAll approach with Backbone found here:
https://gist.github.com/toddhgardner/7487037
Should I add more exclusions for the Marionette methods?
Uncaught Error: TrackJS Caught: TypeError platform.min.js:7206
x.wrapErrorplatform.min.js:7221
function.a.(anonymous function).b.contains.a.(anonymous function)backbone.marionette.map:2328
e.CollectionView.e.View.extend.buildChildViewplatform.min.js:7221
function.a.(anonymous function).b.contains.a.(anonymous function)backbone.marionette.map:2259
e.CollectionView.e.View.extend.addChildplatform.min.js:7221
function.a.(anonymous function).b.contains.a.(anonymous function)backbone.marionette.map:2152
(anonymous function)lodash.underscore.min.js:7
(anonymous function)lodash.underscore.min.js:15
Dbackbone.js:966
Collection.(anonymous function)platform.min.js:7221
As per the doc
http://docs.trackjs.com/tracker/quickStart
https://my.trackjs.com/install
Using trackJs.track("...");
in the browser console doesn't work anymore and is returning Uncaught ReferenceError: trackJs is not defined(โฆ)
Using the cdn in case that matters
I am making a front-end api call to a third party service and want to use trackJs to log some data from the response. However, anytime I put trackJs.track(data_i_want) in the callback, then it doesn't actually track anything. Everything works as expected if I make the .track call pretty much anywhere else in the app except in the callback function
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.