maui: [regression/8.0.0-preview.7.8842] .NET Maui Blazor App throws "No interop methods are registered for renderer" javascript exception

Description

When creating a new .NET Maui Blazor App in 8.0.100-preview.7.23376.3 and running it results in the following javascript exception when navigating or clicking on the counter button.

Open the dev tools to see the exception:

blazor.webview.js:1  Uncaught Error: No interop methods are registered for renderer 0
    at k (blazor.webview.js:1:13290)
    at blazor.webview.js:1:13196
    at T (blazor.webview.js:1:13379)
    at N (blazor.webview.js:1:13170)
    at x.dispatchGlobalEventToAllElements (blazor.webview.js:1:15755)
    at x.onGlobalEvent (blazor.webview.js:1:14948)

Steps to Reproduce

Create a new .NET Maui Blazor App and target .NET 8 preview (8.0.100-preview.7.23376.3)
Run the app on e.g. Windows Machine
Open the dev tools
Navigate through the menu and you notice the exception
But its easiest to see on the Counter page and clicking the Click Me button

Link to public reproduction project repository

No response

Version with bug

8.0.100-preview.7.23376.3

Last version that worked well

8.0.0-preview.6.8686

Affected platforms

Windows, and others

Affected platform versions

net8.0-windows10.0.19041.0

Did you find any workaround?

https://github.com/dotnet/maui/issues/16609#issuecomment-1672166849

Relevant log output

blazor.webview.js:1  Uncaught Error: No interop methods are registered for renderer 0
    at k (blazor.webview.js:1:13290)
    at blazor.webview.js:1:13196
    at T (blazor.webview.js:1:13379)
    at N (blazor.webview.js:1:13170)
    at x.dispatchGlobalEventToAllElements (blazor.webview.js:1:15755)
    at x.onGlobalEvent (blazor.webview.js:1:14948)

About this issue

Original URL
State: closed
Created a year ago
Reactions: 3
Comments: 22 (13 by maintainers)

Most upvoted comments

Note: .NET 8 RC1 is available and does not require any workaround

.NET 8 RC1 blog post is here with download details: https://devblogs.microsoft.com/dotnet/announcing-dotnet-8-rc1/

But if you’re still on .NET 8 Preview 7, continue reading for the workaround…

Workaround for .NET 8 Preview 7

For anyone encountering this issue in .NET 8 Preview 7 (released August 8th, 2023), here’s how you can work around it in your apps.

Background

A change was made to Blazor in .NET 8 Preview 7 to enable new Blazor Server and WebAssembly rendering scenarios. Unfortunately there is a bug that affects all Blazor Hybrid scenarios (the BlazorWebView control in .NET MAUI, WPF, and WinForms). The bug causes events such as button clicks in the BlazorWebView control to fail.

Workaround steps

Download the file blazor.webview.net8-p7fix.zip, decompress the ZIP, and add the blazor.webview.net8-p7fix.js in it to your app’s wwwroot folder
Edit your app’s wwwroot/index.html file and change the _framework/blazor.webview.js reference to instead point to the new file you added:
```
<script src="blazor.webview.net8-p7fix.js" autostart="false"></script>
```
(Note that the exact filename/sub-folder don’t matter, so you can rename the file, as long as it doesn’t conflict with any other existing file in your app.)
You should now be able to build/run/publish your app on all .NET MAUI platforms

This is already fixed for the next pre-release of .NET 8. When you update to the next pre-release of .NET 8, you will need to delete the file that you added and also change back the <script ...> reference in index.html.

If anyone here tries out this workaround and is successful (or not), please let us know. Thanks!

Eilon on Sep 14, 2023

The workaround was successful for me! Thanks for that! 🎉

Fydar on Aug 10, 2023