This post was most recently updated on March 25th, 2023.
2 min read.This article explains how to fix your Blazor Hybrid MAUI application (built with Blazor Webassembly, using MAUI to build & publish for multiple different platforms like Windows, Android and iOS at once) not starting up, but throwing an unexpected error instead, an error message being somewhat along the lines of “Failed to compare two elements in the array.”
What fun, right?
Problem
Table of Contents
Okay, so it’s pretty frustrating: your app won’t start, no breakpoints will be hit, nothing useful will be shown in the app and debugging console is not showing any errors.
Oh, but luckily – there WAS an error in the browser console! Let’s take a look:
Failed to compare two elements in the array. at System.Collections.Generic.ArraySortHelper`1.Sort(Span`1 keys, IComparer`1 comparer) at System.Array.Sort[T](T[] array, Int32 index, Int32 length, IComparer`1 comparer) at System.Collections.Generic.List`1.Sort(Int32 index, Int32 count, IComparer`1 comparer) at Microsoft.AspNetCore.Components.RouteTableFactory.Create(Dictionary`2 templatesByHandler) at Microsoft.AspNetCore.Components.RouteTableFactory.Create(List`1 componentTypes) at Microsoft.AspNetCore.Components.RouteTableFactory.Create(RouteKey routeKey) at Microsoft.AspNetCore.Components.Routing.Router.RefreshRouteTable() at Microsoft.AspNetCore.Components.Routing.Router.Refresh(Boolean isNavigationIntercepted) at Microsoft.AspNetCore.Components.Routing.Router.SetParametersAsync(ParameterView parameters) NotifyUnhandledException @ blazor.webview.js:1
Uhh… What does that tell us?
Reason
Ok – so taking a look at the error, we have a stack trace that kind of helps.
I mean – it doesn’t have a proper error message or anything. The app fails to compare some elements, without telling what specific elements and where.
But the stack has a clue – RouteTableFactory. The duplicate is in the internal list of Routes Blazor manages for your MAUI application.
Solution
Check your routes for duplicates. It’s a bit annoying you don’t get a proper error message, but you can just ctrl+shift+f “@Page” in Visual Studio to get a list of all Page-directives, which are probably the likeliest way to set a route to cause duplicates (since you set them per-component).
I have no idea where my duplicate route had appeared (I mean, who would copy-paste a component with routes from the internet?), but since my app was small, it was easy enough to spot the duplicates.
That said, if your @Page directives are fine, take a look at your MauiProgram.cs or Program.cs to see if you’re issuing some conflicting directives there.
Hope this helps :)
References
- How to find out dependency versions in your .csproj files using PowerShell? - September 26, 2023
- node build throwing “error:0308010C:digital envelope routines::unsupported”? Let’s fix it! - September 19, 2023
- “This app can’t run on your PC” dialog when you’re building your app in Visual Studio - September 12, 2023