Class: Logger

Logger

Default constructor of the RootCause logger class. It accepts one configuration object. The only required key is applicationId which is available in the application settings.

For additional information on configuration, see also Logger configuration in general docs.

Usually you want to start monitoring errors on the page as early as possible (to catch exceptions from the page loading phase), that's why it is recommended to instatiate the RootCause logger right after the <meta> tags (see example below).

new Logger(config)

Name Type Description
config

Logger configuration
Example
     <!DOCTYPE html>
     <html>
     <head>
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">

     // Start monitoring as early as possible to capture page load errors
     <script src="https://app.therootcause.io/rootcause-full.js" type="text/javascript"></script>
     <script type="text/javascript">
     var logger = window.RC && new RC.Logger({
            // **Required**
            applicationId           : 'yourAppId',

            recordUserActions       : true,
            captureScreenshot       : true,

            maxNbrOfReportedErrors  : 1,
            logResourceLoadFailures : true,
            logAjaxRequests         : true
        });
     </script>
     ....
     ```

Mixes In

Members

addLogEntryfunction

Adds a custom log message entry to the session log data, sent to the server.

Example
var logger = window.RC && new RC.Logger({
...
});


logger.addLogEntry('something happened');


logger.addLogEntry({ type : 'warn', message : 'Cart total mismatch' });

addTagfunction

Adds a tag to the session data object

applicationIdString

The application identifier (required) for your web application, it can be found in the Settings page in the application dashboard.

autoStartBoolean

Set this option to true (default value) to start monitoring exceptions immediately after creation of the RC.Logger instance (recommended).

baseUrlString

The base url of the server handling the logging. It is set automatically and usually you don't need to specify this option.

blackoutSelectorString

A CSS selector identifying targets on the screen that should be hidden before a screenshot is taken. As per CSS syntax, you can specify several selectors, separated by a comma:

input.credit-card-number, input.credit-card-expire, input.api-key

See the also RC.Logger#captureScreenshot config.

captureArgumentsObject

An object containing function references to override, in order to capture arguments in case of an unhandled exception. The keys of the object should contain constructor "class" names and values - function names.

The class name is first resolved to a value. Normally it will be a function, and its prototype is taken, otherwise we operate on the value itself. Then we take the properties of the prototype (method of the class) and wrap them with try/catch override, which will also track the arguments, passed to the function.

If exception happens, the function arguments will be added to the exception report.

You can specify from which classes and methods to capture arguments with this config object. Alternatively you can specify it in the Application Settings UI (remember to enable the enableArgumentsCapturing option).

Example
         captureArguments : {
    "SomeClass"        : "methodName",
    "My.view.UserList" : "loadUser"
}
         ```

captureScreenshotBoolean

True to capture a screenshot of the page when an error occurs. If you need to hide some sensitive user information before taking the screenshot, use the blackoutSelector, onBeforeScreenshot and onAfterScreenshot configs.

clearTagsfunction

Clears all tags

dataObject

JavaScript object with any additional data to be included in the error report. Will be shown in the "Custom data" tab in the error detail page.

enableAjaxPlaybackBoolean

Set this option to true to log all Xhr interaction for further replay later at issue debugging time. This will also set logAjaxRequests:true and logAjaxResponses:true (currently only supported for XMLHttpRequest)

Default Value:
  • false

enableArgumentsCapturingBoolean

Set this option to true to load the overrides for arguments capturing, listed in the Application settings view. The overrides will be fetched with an XHR request.

See also captureArguments.

environmentString

An environment identifier for your application (´production´, ´test´, ´staging´ etc)

fixedErrorTextString

The text to show inside a toast box when an error occurs which has already been marked as Fixed. Only relevant when showNotificationOnError is true.

frameworkVersionString

A version identifier of any main javascript library or framework you are using in your application (e.g. "Angular 2.0.3"). If provided, will be included in the exception report. See also version

ignoreErrorMessageReRegExp

RegExp describing error messages to ignore

ignoreFileReRegExp

RegExp used to match file names, exceptions from which to ignore

ignoreUrlReRegExp

RegExp used to match URLs to ignore. For example, to avoid logging errors from your local machine, set this to /localhost/

logAjaxRequestsBoolean

Set this option to true to log all XHR requests and add them to the exception report (currently only supported for XMLHttpRequest)

Default Value:
  • false

logAjaxResponsesBoolean

Set this option to true to log all XHR responses and add them to the exception report (currently only supported for XMLHttpRequest)

Default Value:
  • false

logConsoleOutputArray.<String> Boolean

An array of strings specifying methods of the console object which should be tracked and added to the exception report.

Can be also provided as true - equivalent of [ 'debug', 'log', 'info', 'warn', 'error' ], or false - corresponds to []

logExceptionfunction

Call this to manually create an error report and send it to the server.

Example
         logger.logException(new Error("Something wrong"));
         ```

loggingErrorTextString

The text to show in the end user notification popups.

logRecorderErrorsfunction

´true´ to post debug information about internal RootCause errors to the RootCause developers. No user interaction data, cookies, screenshots or video is included in the report sent)

logResourceLoadFailuresBoolean

Set this option to true to add a log entry when a resource (CSS/JS/IMG) fails to load (e.g. status code 404).

maxNbrOfRecordedUserActionsNumber

The max amount of user actions to record per session, when this value is exceeded the event recorder will stop. Replaying a very long session with thousands of interaction could take a long time and may not be very useful as debugging context.

maxNbrOfReportedErrorsNumber

The max amount of javascript errors to log per session. Recommended value is 1 since following exceptions could be side effects of the initial error.

maxVideoDurationNumber

The amount of seconds after which the video recording will be stopped. If omitted, the video recording will continue until an error is logged. Video sessions not linked to any error/feedback are purged on a daily basis.

minFailureResponseStatusNumber

The lower HTTP status code to treat as an error. You can set this to 500 to only report about server errors. See https://developer.mozilla.org/en-US/docs/Web/HTTP/Status for more information

newErrorTextString

The text to show inside a toast box when a new error occurs. Only relevant when showNotificationOnError is true.

notificationBackgroundColorString

The background color to use in the end user notification popups.

notificationShowDurationNumber

Controls for how long the error notification toast should be displayed

notificationTextColorString

The text color to use in the end user notification popups.

onAfterScreenshotfunction

If provided, this function will be called after a screenshot is captured.

See also blackoutSelector, captureScreenshot

onBeforeLogfunction

A method called before an error is sent to the server. It receives an object with all the data gathered about an error. Return false from this function to ignore the error.

onBeforeScreenshotfunction

If provided, this function will be called before a screenshot is captured. You can use it to hide or obfuscate any sensitive data before the capture.

See also blackoutSelector, captureScreenshot

onErrorLogFailedfunction

A method called after an error (or feedback report) could not be logged. The method receives the server responseText, and an object with the error context that was sent to the server.

onErrorLoggedfunction

A method called after an error (or feedback report) has been successfully sent to the server. The method receives the server responseText, and an object with the error context that was sent to the server.

onStartfunction

onStopfunction

pausefunction

Resumes the error monitoring

pluginsArray.<Object>

An array of config objects defining plugins that provide additional error context for JS frameworks. Currently only the Angular plugin exists. See more here

processVideoFrameFnfunction

A method called once for every video frame recorded. Use this config to process or scrub out sensitive text from the video before it's sent. An array is passed to this method with:

[Type, TimeStamp, args...]

Where Type is a Number in the following enum:

0 setBaseUrl, 1 applyDomSnapshot, 2 applyPointerPosition, 3 applyPointerState, 4 applyElementValueChange, 5 applyElementCheckedChange, 6 applyWindowResize, 7 applyDomScroll, 8 applyDomMutation

recorderConfigObject

Configuration for the Siesta.Recorder.Recorder instance. See Siesta online docs for reference. Only relevant if #recordUserActions is true

recordSessionVideoBoolean

True to record the video of the user session. The video will allow you to see exactly what the user did in the browser.

For Live Replay, see also: recordUserActions

recordUserActionsBoolean

True to record user interactions such as mouse actions, key strokes, scrolls etc. The recorded user actions can be replayed later in the Replay Studio. See also #maxNbrOfRecordedUserActions which can be used to cap the amount of user actions recorded.

removeTagfunction

Removes a tag from the session data object

reproducedErrorTextString

The text to show inside a toast box when an error occurs that has been logged and Reproduced before in the RootCause.

Only relevant when showNotificationOnError is true.

resetfunction

Clears any recorded data.

resetOnHistoryChangeBoolean

Set to true to reset and restart logging if the page history entry changes. This can be useful if you have a large Single Page Application with multiple isolated subviews and routing uses the hash or History API.

resumefunction

Pauses the error monitoring

saveCookiesBoolean

Set this option to true to include user's cookies in the error data report. Including cookes increases chances for a successful session replay.

screenshotfunction

Takes a screenshot to be added to the report in case of an error.

showErrorDialogBoolean/Object

If set to true, there will be an error dialog shown before any information is sent to the server. In the dialog, the end user has to confirm that he/she wants to report the error. The user can also choose what user session information should be included in the report (screenshot, user actions, cookies, etc).

If provided as an object, the object will be used as a configuration object for the dialog instance: RC.ui.ConfirmationDialog

The dialog also has a text field for additional information to be included in the error report.

showFeedbackButtonBoolean/Object

Set this option to true to show the feedback button to collect manual feedback reports & feature requests from end users. After clicking on the button, a user will be able to select a rectangular region on the screen, highlighting the issue and provide some text describing it.

You can customize the feedback button by providing a config object instead.

Example
         var logger = new RC.Logger({
    showFeedbackButton : {
        text : 'GIVE FEEDBACK'
    },
    ...
});
         ```

showIconWhileRecordingBoolean/Object

True to show an icon to indicate to the user that the session is being recorded. You can configure a tooltip to show when hovering the icon too.

     ```markup
     var logger = window.RC && new RC.Logger({
showIconWhileRecording : {
    tooltip : 'NOTE: This session is being recorded for debugging purposes'
}

}); ```

showNotificationOnErrorBoolean

Set this option to true to show a popup to the end user when an error happens.

See also showErrorDialog

startfunction

Starts monitoring errors for the current window. Should be called manually, if you set autoStart to false.

stopfunction

Stops monitoring errors and cleans up the internal state.

tagsObject

An object with key-value pairs defining tags to log. The tags will be displayed in the exception report UI.

You can also add tags manually by calling addTag

treatFailedAjaxAsErrorBoolean

Set this option to true to treat ajax failures (404, 500 etc) as an unhandled exceptions and report them.

Default Value:
  • false

treatResourceLoadFailureAsErrorBoolean

Set this option to true to add send an error report when a resource (CSS/JS/IMG) fails to load (e.g. status code 404).

treatUnhandledPromiseRejectionAsErrorBoolean

Set this to false to not treat unhandled Promise rejections as errors.

userObject

JavaScript object containing information about the current user. The dashboard application shows name, email and imgUrl properties of this object by default, but you can add any additional data as well.

versionString/Number

A release version identifier for your application. If specified it will be included in the exception report.

Methods

destroyFeedbackButton()

Destroys the feedback button for the current session

init()

Overriden to log any entries stored in LocalStorage for errors that happened while offline

start()

Overriden to add XHR calls interceptors if needed

startVideoRecording()

Starts video recording (in supported browsers)

stop()

Overriden to remove XHR calls interceptors if needed

stopVideoRecording()

Stops video recording