we use Grafana Faro in an Angular App. It is working great but we want to see console.error as errors in the Shipped Faro Frontend Dashboard. I thought that is easy and I just send an Exception whenever there is an error log:
let faro: Faro | null = null;
/**
* Export Grafana Faro instance. Instance needs to be initiated first by initializeGrafanaFaro
*/
export const getFaro = () => faro;
/**
* Will be called during Angular APP Initializing
* and is responsible for the initialization of grafanas web sdk - faro.
*/
export function initializeGrafanaFaro() {
// ...
return async () => {
// ...
// Initialize faro
faro = initializeFaro({
// ...
// Modify log item before sending
beforeSend: (item) => {
// Check if entry point is a console event
if (item.type !== TransportItemType.LOG) {
return;
}
// Check if the console event is console.error
const { message, level } = item.payload as LogEvent;
if (level !== LogLevel.ERROR) {
return item;
}
faro.api.pushError(new Error(message));
return item;
},
// ...
});
// ...
};
}
Unfortunately it ignores faro.api.pushError(new Error(message)); in the beforeSend function.
Anyone with an idea why this does not work or how we can see the console.error logs as error in the shipped Faro Dashboard?
If enabled, Faro can capture console.* messages and send them as logs.
If you want to send it as an error, you need to use the pushError API as you already did in the example.
However, using it in the before send hook will not work.
This hook is only meant to mutate the Faro data immediately before it leaves Faro.
So if you want to capture console.errors as an error signal, you need to manually call pushError at the place where the console.error log is used.
console.error();
faro.api.pushError();
We got this request multiple times in the last weeks.
Maybe you would like open a feature requests on the Faro repository?
Another suggestion, not sure if can fit your use case:
Angular has the option to inject a global error handler.
What you can do is injecting the global error handler, throwing an exception instead of using console.error and handle it in the global handler where you cab push the Faro error and print the log to the console.
Here’s a doc from the community on how to use the global error handler.
