Issue rendering the Dialog on .Net 8 - ServerRendered

[Gopichandar]

Contact Details

gopichandarbe@gmail.com

What happened?

I have followed the exact steps as mentioned. https://github.com/fgilde/MudBlazor.Extensions?tab=readme-ov-file#setting-up-mudblazorextensions

In using this on .Net 8 and running this in InteractiveServer render mode.

When I call a dialog,

var dialog = await DialogService.ShowEx("ShowDialog");

I got the following exception,

System.InvalidOperationException: JavaScript interop calls cannot be issued at this time. This is because the component is being statically rendered. When prerendering is enabled, JavaScript interop calls can only be performed during the OnAfterRenderAsync lifecycle method.
   at Microsoft.AspNetCore.Components.Server.Circuits.RemoteJSRuntime.BeginInvokeJS(Int64 asyncHandle, String identifier, String argsJson, JSCallResultType resultType, Int64 targetInstanceId)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, CancellationToken cancellationToken, Object[] args)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
   at MudBlazor.Extensions.Helper.JsRuntimeExtensions.IsNamespaceAvailableAsync(IJSRuntime js, String ns)
   at MudBlazor.Extensions.Helper.JsImportHelper.InitializeMudBlazorExtensionsCoreAsync(IJSRuntime runtime, Boolean force)
   at MudBlazor.Extensions.Helper.JsImportHelper.GetInitializedJsRuntime(Object field, IJSRuntime fallback)
   at MudBlazor.Extensions.DialogServiceExt.InjectOptionsAsync(IDialogReference dialogReference, DialogOptionsEx options)
   at MudBlazor.Extensions.DialogServiceExt.InjectOptionsAsync(Task`1 dialogReference, DialogOptionsEx options)
   at MudBlazor.Extensions.DialogServiceExt.ShowAndInject(IDialogService dialogService, Type type, String title, DialogOptionsEx options, DialogParameters parameters)
   at MudBlazor.Extensions.Core.MudExDialogReferenceExtensions.AsMudExDialogReferenceAsync[TComponent](Task`1 dialogReference)

Note: This is working fine in MudBlazor

Expected Behavior

Dialog should be should without app crash,

Screenshots

Reproduction link

No response

What application type are you referring to?

ServerRendered

Custom Application Type

No response

MudBlazor.Extension Version

*

MudBlazor Version

6.11.1

What browser are you using?

Chrome

Sample Solution

MudBlazorExt_Issue.zip

Pull Request

No response

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[fgilde]

Can you create and attach a sample solution containming this problem?

[Gopichandar]

Attacched the sample sln for reference @fgilde

MudBlazorExt_Issue.zip

[Gopichandar]

Also tried disabling the prerendering still issue exists.

[fgilde]

Where do you attached a sample? Didn't see it. one info. Ensure that you inject IDialogService not DialogService.

[Gopichandar]

MudBlazorExt_Issue.zip

[Gopichandar]

Hi @fgilde , can you check if you can see the attached zip?

[fgilde]

Yes thank you

[fgilde]

Ok I'll work on it. It's strange i I dont know why its working with .net6 or 7 but anyway. You can currently workaround it if you want with manually by passing the IJSRuntime like this

   [Inject]
   public IDialogService _dialogService { get; set; }

   [Inject]
   IJSRuntime JS { get; set; }

   private async Task OpenDialog()
   {
       DialogOptionsEx options = new DialogOptionsEx() {JsRuntime = JS};
       var dialog = await _dialogService.ShowEx<MyMudDialog>("Your Dialog Title", options);
   }

[Gopichandar]

Great. Thanks for the workaround.

[fgilde]

Ok bug is fixed in 1.7.80 MudBlazor.Extensions 1.7.80 Nuget

[DragoQCC]

I just wanted to say this issue was super helpful. I was injecting a DialogServs the IDialogService, and as soon as I put it into the IDialogService, it worked just fine.

[fgilde]

I'm very happy to hear that