Blazor Hybrid(MAUI)開発時のクライアントサイドエラー内容を確認する方法

ASP.NET Core Blazor Hybrid(MAUI Blazor)を用いたAndroidアプリ開発でエミュレーターや実機デバッグ中に

An unhandled error has occurred. Reload

のようなエラーが出たときに、エラーの内容を確認する方法。

今回はAndroid開発で説明していますが、iOS開発の場合も同等かと思います(未確認)。

対応

1. MauiProgram.csで開発ツールとデバッガが有効になっていることを確認する。

#if DEBUG
    builder.Services.AddBlazorWebViewDeveloperTools();
    builder.Logging.AddDebug();
#endif

2. MAUIアプリケーションをデバッグ起動する。

3. ChromeやEdgeなどChromium系ブラウザで以下のURLを開く。

   chrome://inspect/#devices

4. Remote Targetに表示されたデバッグしたいプロセスのinspectをクリックする。
   

5. ブラウザ開発で見慣れた開発ツールが表示されるのでコンソールでエラー内容を確認する。
   

以上です。