Developer's Reference - JavaScript - Logging
The Loupe Agent for TypeScript (and agents derived from it, like the Loupe Agent for Angular) provide a direct logging API that provides broadly similar capabilities to other Loupe agents.
The description
supports C# style string formatting parameters, which should be passed as an array in parameters
. For example:
loupe.information('Web', 'Event Occurred', 'User event occurred\r\nUser: {0}\r\nEvent: {1}',
[user.name, event.name]);
For errors and additional details you can use:
const err = new Error('Custom application error details');
loupe.error('Web', 'Error Occurred', 'An error occurred', null, err,
{user: user.name, state: app.state});
The additional details parameter can be either a string or a JSON object. The agent will attempt to parse stack traces and source details from the error, but to add source information manually you can use the MethodSourceInfo
:
const err = new Error('Custom application error details');
loupe.error('Web', 'Error Occurred', 'An error occurred', null, err,
{user: user.name, state: app.state},
new MethodSourceInfo('index.js', 'init', 47));
The primary logging API is split by message severity, with each individual message supporting:
- Category: A dot-delimited category typically indicating the application subsystem or logging category for this log message, useful when filtering logs.
- Caption: A one-line summary of the log message, typically without any instance-specific data substituted into it.
- Description: Optional. An unlimited length description which can be a format string followed by corresponding args.
Each log message also supports providing, which are all optional:
- Exception: Optional. The error details. This can be a string detailing the exception, an
Exception
object, or a JavaScript Error
object.
- Details: Optional. A JSON object, or string version of, with additional details to be logged and shown in the details in Loupe Desktop and Loupe Server. This is useful for passing contextual or state information that could be useful for diagnostics.
- MessageSourceInfo: Optional. Details of the file, method, line and column number. This allows source information to be passed without the performance overhead of working out the current file and line (eg by examining the stack, which may well be different with compressed source, especially if source maps are not being used).
For example:
//You can pass additional details on each log message which will be serialized
//and included in the Message Details of each message on the server.
const someObject = { name: "test", code: 123, nestedObj: { a: 1} };
loupe.verbose('Javascript', 'verbose caption', 'verbose description',
null, null, someObject, null);
loupe.information('Javascript', 'info caption', 'info description',
null, null, someObject, null);
loupe.warning('Javascript', 'warning caption', 'warning description',
null, null, someObject, null);
loupe.error('Javascript', 'error caption', 'error description',
null, null, someObject, null);
loupe.critical('Javascript', 'critical caption', 'critical description',
null, null, someObject, null);
For recording exceptions, particularly in a top-level error handler, we recommend the dedicated Loupe method recordException which takes:
- Exception: A JavaScript exception object to record with the message.
- Details: An object to serialize to JSON and record along with the message for additional context.
- Category: A dot-delimited category for this log message, useful when filtering logs.