Onclick event not working in Blazor Web Assembly 8.0

Hello everyone! I hope this video has helped solve your questions and issues. This video is shared because a solution has been found for the question/problem. I create videos for questions that have solutions. If you have any other issues, feel free to reach out to me on Instagram: www.instagram.com/ky.emrah

Below, you can find the text related to the question/problem. In the video, the question will be presented first, followed by the answers. If the video moves too fast, feel free to pause and review the answers. If you need more detailed information, you can find the necessary sources and links at the bottom of this description. I hope this video has been helpful, and even if it doesn't directly solve your problem, it will guide you to the source of the solution. I'd appreciate it if you like the video and subscribe to my channel!Onclick event not working in Blazor Web Assembly 8.0

I am studying a Blazor course and I noticed the button click event does not trigger on button click. I created a simple Blazor web assembly 8.0 project to confirm the issue. I noticed on button click nothing happened.
I added @rendermode InteractiveServer to my test page and also these methods to my program.cs, but nothing happened.
@rendermode InteractiveServer
program.cs
builder.Services.AddRazorComponents().AddInteractiveServerComponents()

app.MapRazorComponents App ().AddInteractiveServerRenderMode();

builder.Services.AddRazorComponents().AddInteractiveServerComponents()

app.MapRazorComponents App ().AddInteractiveServerRenderMode();

Program.cs
using BlazorApp1.Components;

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRazorComponents();
builder.Services.AddRazorComponents().AddInteractiveServerComponents();

var app = builder.Build();
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error", createScopeForErrors: true);
app.UseHsts();
}

app.MapRazorComponents App ().AddInteractiveServerRenderMode();
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseAntiforgery();
app.MapRazorComponents App ();
app.Run();

using BlazorApp1.Components;

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRazorComponents();
builder.Services.AddRazorComponents().AddInteractiveServerComponents();

var app = builder.Build();
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error", createScopeForErrors: true);
app.UseHsts();
}

app.MapRazorComponents App ().AddInteractiveServerRenderMode();
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseAntiforgery();
app.MapRazorComponents App ();
app.Run();

Test.razor
@page "/test"
@rendermode InteractiveServer
@inject IJSRuntime JsRuntime
h3 Test JavaScript Interop /h3
button type="button" @onclick="TestJsInterop" Click Me /button

@code {
private async Task TestJsInterop()
{
// Call the custom JS function showCustomAlert
await JsRuntime.InvokeVoidAsync("showCustomAlert", "Hello from custom JS interop!");
}
}

@page "/test"
@rendermode InteractiveServer
@inject IJSRuntime JsRuntime
h3 Test JavaScript Interop /h3
button type="button" @onclick="TestJsInterop" Click Me /button

@code {
private async Task TestJsInterop()
{
// Call the custom JS function showCustomAlert
await JsRuntime.InvokeVoidAsync("showCustomAlert", "Hello from custom JS interop!");
}
}

window.showCustomAlert = function (message) {
alert(message); // This is the native JS alert function
}

window.showCustomAlert = function (message) {
alert(message); // This is the native JS alert function
}

index.html
!DOCTYPE html
html lang="en"
head
meta charset="utf-8" /
meta name="viewport" content="width=device-width, initial-scale=1.0" /
title BlazorApp /title
base href="/" /
link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" /
link href="css/site.css" rel="stylesheet" /
/head
body
app
!-- The component rendered in InteractiveServer mode will be mounted here --
/app
script src="_framework/blazor.server.js" /script
script src="js/spp.js" /script

/body
/html

!DOCTYPE html
html lang="en"
head
meta charset="utf-8" /
meta name="viewport" content="width=device-width, initial-scale=1.0" /
title BlazorApp /title
base href="/" /
link href="css/bootSource of the question:
stackoverflow.com/questions/79032027

Question and source license information:
meta.stackexchange.com/help/licensing
stackoverflow.com/