“No suitable method found to override” error in Blazor/Razor pages

A screenshot of a series of errors in a Blazor application stating "No suitable method found to override"

I’ve run into an issue several times recently while working in Blazor where I’ll innocently try and run the application after some minor changes, only to be hit by a wall of errors seemingly out of nowhere:

ExamplePage.razor.cs(7, 29): [CS0115] 'ExamplePage.OnInitializedAsync()': no suitable method found to override
ExamplePage.razor.cs(12, 29): [CS0115] 'ExamplePage.OnAfterRenderAsync(bool)': no suitable method found to override
ExamplePage.razor.cs(17, 29): [CS0115] 'ExamplePage.OnParametersSetAsync()': no suitable method found to override
ExamplePage.razor.cs(22, 26): [CS0115] 'ExamplePage.SetParametersAsync(ParameterView)': no suitable method found to override

All of a sudden every single Razor component lifecycle function throughout the application is exploding and I’m left wondering how I managed to break things so spectacularly.

My approach to fixing this historically was:

Take a look at my local changes in Git
Try to tweak things to get it working again
Fail
Roll back everything and re-implement the change

It was frustrating and had wasted enough of my time over the past few months that I decided that I was going to figure it out once and for all, by gum.

Note: If you’re in a hurry the fix is quick and simple, so feel free to jump straight down to that section to skip my self-indulgent waffling.

Continue reading →

Null Reference Exception in Blazor Router

A screenshot of a stack trace produced from a .NET application. The main messages are "An unhandled exception occurred while processing the request. NullReferenceException: Object reference not set to an instance of an object. Microsoft.AspNetCore.Components.Routing.Router.Refresh(bool isNavigationIntercepted)". A full stack trace is visible below.

If you’ve used Blazor for a while you may have run into the following (pretty unhelpful) error message where the page router is throwing a NullReferenceException:

The worst part is that I always seem to run into this error after making a bunch of changes and then having no idea exactly what I did to break the build (yeah I know, I should probably run my code more while making changes).

I’ve managed to form a general idea of why the error is thrown and have found two concrete situations that reproducibly cause the issue, so I’ve finally written them down for when I inevitably run into this situation again!

Continue reading →

Applying Authorisation Rules to a Folder of Razor Components/Blazor Pages

A screenshot of a Blazor app designed to test/demonstrate different approaches to applying authorisation rules to razor components

There’s a lot of flexibility in how you can use authorisation rules in Razor components*, but a frustration of this approach is that it seems like you have to slap @attribute [Authorize(Policy = "PolicyName")] at the top or every page with no clear way of applying a given policy to a whole folder of .razor files. After much research and testing, I’ve found how to go about it!

Continue reading →

Calling .NET Instance Methods in ASP.NET Core Blazor Directly from JavaScript

I ran into an issue recently where I needed to call some C# code from JavaScript. The Microsoft documentation on JavaScript to .NET interop is very detailed and covers a lot of scenarios including the one that would seem to fit the bill (invoking instance methods), but my requirements meant that I couldn’t use this exact approach.

Continue reading →

UI Flashes after Migrating Blazor Projects To .NET 6

A table with the title of "Vegetables". There are three columns (Id, Product and Quantity) and 3 rows of example data.

The Problem

I’ve noticed an issue recently after upgrading a few Blazor projects from .NET 5 to .NET 6 where the UI flashes after every call to StateHasChanged. Something like this:

A table with the title of "Vegetables". There are three columns (Id, Product and Quantity) and 3 rows of example data. The Id field disappears and reappears once a second causing the table to visibily shift back and forth — Flash. Flash. Flash. Flash…

Yeah, that’s not annoying at all. Unfortunately it was happening in quite a few different places and was pretty darn noticeable, so it looked like I was going to have to dive in and figure out what exactly was causing this to go wrong (despite working perfectly in .NET 5)!

Continue reading →

Referencing Blazorise Theme Values in Custom CSS

A header image displaying two different div elements with two differently coloured shadows

Introduction

Blazorise is an excellent library that I’ve been using a lot lately. While it has great support for declaring custom visual themes, you’ll occasionally run into situations where what you’re trying to do isn’t fully supported.

Take this super contrived example: I want to set the shadow on a div to use the primary colour defined in my theme, but there’s no attribute in Blazorise to do this directly (at time of writing). I could hard-code the colour to the same hex value as what I’ve set in my theme, but not only is this generally bad practice (since it’s easy to update one value and not the other), it locks you into only one colour even though the theme can be modified dynamically during runtime. So how can we access our Blazorise theme values in custom CSS?

Continue reading →