How to prevent javascript errors after upgrading Mudblazor

How to prevent javascript errors after upgrading Mudblazor

Mudblazor is an awesome library to quickly make professional looking Blazor component. As you might expect, it’s fully based on Css/Javascript. Since your browser caches css/javascript, upgrading Mudblazor can cause issues.

An error like this might be shown in the browser console

Unhandled exception rendering component: "Cannot read properties of null (reading 'addEventListener')
TypeError: Cannot read properties of null (reading 'addEventListener')
    at MudElementReference.addOnBlurEvent (../_content/MudBlazor/MudBlazor.min.js:53:9) 
    at ../_framework/blazor.server.js:1:304

A simple solution is to CTRL-F5 your app but this is not something which is very user-friendly.

The solution is very simple, in your _host.cshtml (older templates) or app.razor, simple add the version of the mudblazor included.

<link href="_content/MudBlazor/MudBlazor.min.css?v=8.5.0" rel="stylesheet" />
<script src="_content/MudBlazor/MudBlazor.min.js?v=8.5.1"></script>

This will force the browser to reload these components and your end users will have no issues.

Leave a Reply

Your email address will not be published. Required fields are marked *