Add OnMounted component lifecycle event

[marinasundstrom]

Is there an existing issue for this?

• I have searched the existing issues

Is your feature request related to a problem? Please describe the problem.

I want to invoke JavaScript after a pre-rendered server component has been mounted in the browser. But I can't find a way to do it.

It used to be (with Razor Pages) that you did it in OnAfterRender which ran twice, and you checked firstRender. For Blazor Server, that meant that if it was true then you where running in the browser and was able to invoke JavaScript. While for WebAssembly you had to check for it to be false.

In Blazor Server in .NET 8, it doesn't work that way.

And this behavior is reasonable. It makes sense that when you have pre-rendered a server component you have already rendered it, and there is no need to call the lifecycle event method again.

To me it makes the most sense to add a new event method indicating that the code has been materialized or "mounted" in the browser.

Describe the solution you'd like

Add an OnMounted() lifecycle method that is executed after OnAfterRender has been executed the first time and the component has been added to the Browsers DOM and the SignalR connection is up and running

This will enable the to execute logic when the component has been mounted - like invoking JavaScript,

@inject IJSRuntime JS

<div id="obj">Hello</div>

@code 
{
    protected async Task OnMountedAsync()
    {
        // The component has been mounted in the DOM and is ready for interactivity.

        await JS.InvokeVoidAsync("hello");
    }
}

Additional context

No response

[marinasundstrom]

Perhaps related to this: #26794

[mkArtakMSFT]

In Blazor Server in .NET 8, it doesn't work that way.

Thanks for contacting us. It's not clear why OnAfterRender doesn't work for you. It should, as the event fires when the component is already rendered, and the interactivity is enabled. Can you please share more details about the "non-working" experience that you're facing.

[marinasundstrom]

@mkArtakMSFT I checked it out and you are right. It does work. I had just been playing with stuff over the course of a couple of previews so it was broken.