02 December 2022
Blazor .NET 6 WASM MSAL authorization bug

The issue

Hi, let’s keep this a short one. On a project I had to deploy a Blazor WASM dotnet hosted application to a Linux Azure App Service. On my local machine I used the kestrel server for debug, everything worked fine there. Once deployed, the page did not respond to any interaction to login. In the application we used a custom account factory to enrich userdata from other resources. Because the application had overrides on all the Identity UI components, it did not show the standard event logs on the UI that is returned in the query parameters. Because of this I had no idea where to look, so I turned this back and extended the logging on the entire auth flow. On the browser or logging side there was no Noice, whatsoever. On top of that, it still worked and not a single event that indicated the issue or cause got logged when running it locally.

I hear you thinking: “What about google?”. Well, if you don’t know the question. Then how can you find the answer.

So, because my local machine is a windows machine, I created a docker compose and docker file to re-create the exact same environment setup as the Linux Azure App Service. And BINGO, same issue as the deploy in Azure. Not one step closer to cause or solution, but reproducing it was a win for my sanity and gave me opportunity to lower the logging level to trace and yes, after a few attempts I received a message

Unhandled exception rendering component: Cannot read properties of undefined (reading 'toLowerCase')

A google search later and found this closed issue. Where a few scrolls down, lied the answer.

Understanding why

In the Microsoft.Authentication.WebAssembly.Msal, a Null value is being lower cased. This is caused by a bug in the trimming logic that drops those required properties. That trimming is downsizing your blazor application for the web. Like minifying your js and css files, it trims unused code, unused dll’s and more within the blazor app. You can always set <PublishTrimmed>false</PublishTrimmed> in the client project, but why would you? Would you rather run a marathon up hill than a flat run? No, I do not.

The fix

  • In your Client project’s .csproj file, you need to add an exclusion for trimming. This basically says the compiler to exclude the package from being trimmed when it’s prepared for a Release build.
  <TrimmerRootAssembly Include="Microsoft.Authentication.WebAssembly.Msal" />

To test locally, don’t forget to clean your bin and obj project folders.

That’s it, fun times.

Save, commit and deploy.