Blazor is refreshing the page by JsInteropt call (Using Babylon)

Question

I'm using Blazor with Babylon Js to use 3D objekts.
I'm trying to resize the 3D objekt by a user input (C# code). After the input i wanna call a JavaScript code by JsInteropt, it is called but not executed also the page is refreshing and after all the user input is gone.

Razor Page

@page "/"  
  
@inject IJSRuntime m_jSRuntime  
  
<h1>Rotating Cube</h1>  
<form>  
    <label>Kante A <input id="KanteA" type="text" size="8" @bind="kanteA" /></label>  
</form>  
<form>  
    <label>Kante B <input id="KanteB" type="text" size="8" @bind="kanteB" /></label>  
</form>  
<form>  
    <button id="btn Change" @onclick="click => ChangeSize()">Ändern</button>  
</form>  
  
@code  
{  
    double kanteA;   
    double kanteB;   
  
    public async Task ChangeSize()  
    {  
        try  
        {  
          await m_jSRuntime.InvokeAsync<Objekt>("babylonInterop.resizeBox");  
        }  
        catch  
        {  
            Console.Write("Error");  
        }  
    }  
}  

Resize Code

babylonInterop.resizeBox = function (kanteA, kanteB) {  
  
    mainscene.stopRenderLoop();  
  
    console.trace("2");  
  
    console.log(scene.getMeshByName("Box"))  
    var box = scene.getMeshByName("Box").setEnabled(true);  
  
    var kanteA = document.getElementById('KanteA').value  
    var kanteB = document.getElementById('KanteB').value  
      
    box = new BABYLON.Vector3(kanteA, kanteB, kanteA)  
    engine.resize();  
  
    return scene;  
};