Blazor form submit clicking enter needs to be pressed twice and when input focus it does not work at first time

Is there an existing issue for this?

[X] I have searched the existing issues

Describe the bug

When EditForm's input is focused, two clicks are needed for submit button to do anything.

 public partial class BillableCategoryEditComponent : ComponentBase
 {
     /// <summary>
     /// Gets or sets the model.
     /// </summary>
     /// <value>
     /// The model.
     /// </value>
     [Parameter]
     public BillableCategory? Model { get; set; }

     /// <summary>
     /// Raises the Close event.
     /// </summary>
     /// <value>
     /// The on close.
     /// </value>
     [Parameter]
     public EventCallback OnClose { get; set; }

     /// <summary>
     /// Gets or sets the on save.
     /// </summary>
     /// <value>
     /// The on save.
     /// </value>
     [Parameter]
     public EventCallback OnSave { get; set; }

     /// <summary>
     /// Gets or sets the form modified.
     /// </summary>
     /// <value>
     /// The form modified.
     /// </value>
     [Parameter]
     public EventCallback FormModified { get; set; }

     /// <summary>
     /// Gets or sets the current edit context.
     /// </summary>
     /// <value>
     /// The current edit context.
     /// </value>
     private EditContext? CurrentEditContext { get; set; }

     /// <summary>
     /// Called on paramater set.
     /// </summary>
     /// <param name="parameters"></param>
     protected override void OnParametersSet()
     {
         if (Model != null)
         {
             CurrentEditContext = new EditContext(Model);
             CurrentEditContext.OnFieldChanged += EditContext_OnFieldChanged;
         }
         base.OnParametersSet();
     }

     /// <summary>
     /// Edits the context on field changed.
     /// </summary>
     /// <param name="sender">The sender.</param>
     /// <param name="e">The <see cref="Microsoft.AspNetCore.Components.Forms.FieldChangedEventArgs"/> instance containing the event data.</param>
     private async void EditContext_OnFieldChanged(object? sender,
         FieldChangedEventArgs e)
     {
         if (sender != null && Model != null)
         {
             await FormModified.InvokeAsync();
         }
     }

     private async Task HandleSubmit()
     {
         await OnSave.InvokeAsync();
     }
 }

@using Syncfusion.Blazor.Inputs

@if (Model != null && CurrentEditContext != null)
{
    <EditForm EditContext="@CurrentEditContext" OnValidSubmit="@HandleSubmit">
        <div class="modal-form">
            <div class="form-group">
                <SfTextBox ID="itemDescription"
                           Autocomplete="AutoComplete.Off"
                           Placeholder="Description"
                           TabIndex="1"
                           ShowClearButton="true"
                           @bind-Value="Model.Description" />
            </div>
            <DataAnnotationsValidator />
            <ValidationSummary />
        </div>

        <div class="modal-action">
            <div class="button-group">
                <button class="button primary" type="submit">Save</button>
                <button type="button" class="button cancel" @onclick="OnClose">Cancel</button>
            </div>
        </div>
    </EditForm>
}

Expected Behavior

When I press the Enter button when i am on input focus, the submit does not get triggered, but if I change the focus by using clicking somewhere else and then come back to the input again and then press the Enter button it does the submit that time, so the enter button has to be pressed twice with changing the focus.

There is some warning in console as well, not sure if that is already related to it when pressed first enter button with input focus

Form submission canceled because the form is not connected

Steps To Reproduce

No response

Exceptions (if any)

No response

.NET Version

.Net Core 8.0.303

Anything else?

No response

dotnet / aspnetcore