Simply and perfection when debugging in Blazor and Xamarin

We have developed an App Logger to help detect errors and bugs in your Blazor and (soon) Xamarin apps. With every exception, the App Logger provides structured insight in all relevant information on both the client and server side of your apps and the connections between that information. Simple!
In addition, our App Logger generates a clear and informative error message for the user.

Our tool is versatile

Of course, several debug tools already exist, including Microsoft Application Insights. But we wanted more. So, we built a tool that also reveals:

• what the user did in the App directly before the exception occurred;
• what the relation between an exception in the client (Blazor/Xamarin) and an exception on the server (ASP.NET) is;
• which exception occurred for which user: one click provides all the relevant information concerning that user.

Additionally, our tool provides the user with a clear error message.

How it works without our App Logger

Blazor has a built-in, standard implementation called the ILogger, that shows the exception in the debug window (which it doesn’t log!) and the following error message to the user:

So, while you’re debugging, you’re able to see what went wrong. But that won’t do you any good if the bug occurs for the user.

Developers want to be able to give users clear information about the error that occurred. But not one available solution provides developers with that possibility. That is, until our App Logger.

Straightforward

To discover if, and if so, which exceptions occur as a result of something a user might have done you need more information.

We have built an ILogger implementation (which we’ve called App Logger) that logs exceptions to an Azure service. It also logs the user’s id, which enables you to look for errors through every user’s logs individually. The logger can be installed for both the client (Blazor/Xamarin) and the server, so you can look through the logging at every user individually.

Aside from exceptions, other events can be logged as well, such as which pages a user has visited, which buttons the user clicked – as detailed as you want it to be. You can choose which components to turn on and off per user as you see fit, so that when a problem occurs the logging will show you what the user was doing at the exact same time the problem occurred. All of this of course with the user’s permission to protect their privacy.

In addition to our App Logger we have developed a Blazor app that can access and look through logged exceptions and events grouped by user. We’ve called this app App Log Reader.

Clear error message for users

We wanted to provide the user with clear error messages. To achieve this, we’ve made an ILogger implementation to which an IErrorService can be added. This IErrorService can show an error message should an unhandled exception occur, and this exception is logged. The content of the MainLayout is then replaced with our much more informative popup:

The user receives an error number and the developer or helpdesk can use that number and the App Log Reader to easily get to the root of the problem. If the issue is related to the server it is transmitted to the API which will then record the error number of the server-exception into the exception. Our App Logger combines all these separate pieces of information and this is exactly what makes it so unique.

If a fatal exception occurs while the page is rendering, Blazor isn’t always able to render the MainLayout with the error message again. To put it simply: if the error causes the entire App to crash, it obviously can’t show an error message. Fortunately, we know out of experience that this isn’t very likely to happen. Furthermore, even if it were to happen, the exception has already been logged, as well as the user id, so the cause of the issue can be traced back with our App Log Reader.

I want it!

Do you want to use our App Logger? We’re available to help you implement it (or for anything else you might need concerning Blazor). Indulge yourself! Let’s work together; call or email us today.