Blazor не может изменить параметр выбора после выбора элемента вручную более одного раза

У меня есть страница бритвы с компонентом blazor на стороне сервера, где я разрешаю пользователю выбрать опцию, используя функцию более подробного поиска, которая запускается на отдельной вкладке с использованием JSInvoke и localStorage. Работает хорошо, пока пользователь не выберет пустую опцию, она перестает работать. никаких ошибок не сообщается. asp.net 6.0 л.т. Я тестирую самые последние версии Chrome и Edge по состоянию на третий квартал 2024 года.

Для меня очевидно, что если вы используете раскрывающийся список для выбора опции более одного раза, поиск перестает работать.

шаги для воспроизведения случая проблемы 1:

• используйте раскрывающийся список, чтобы выбрать опцию 200, не используя функцию поиска.
• используйте раскрывающийся список, чтобы выбрать пустой первый вариант в списке [выбрать]
• используйте кнопку поиска, чтобы выбрать опцию 100 (ничего не происходит)

шаги для воспроизведения случая проблемы 2:

• используйте раскрывающийся список, чтобы выбрать опцию 100, не используя функцию поиска
• используйте раскрывающийся список, чтобы выбрать опцию 200, не используя функцию поиска.
• используйте кнопку поиска, чтобы выбрать опцию 100 (ничего не происходит)

рабочий случай 1:

• используйте раскрывающийся список, чтобы выбрать опцию 200, не используя функцию поиска.
• используйте кнопку поиска, чтобы выбрать опцию 100 (работает)

рабочий случай 2:

• используйте кнопку поиска, чтобы выбрать опцию 100 (работает)

Пример проекта с ошибкой в ​​GIT https://github.com/tet-web-dev/dropdownOptionLookup

Главная страница бритвы:

<div class = "text-center">
    <h1 class = "display-4">Welcome</h1>
    <component type = "typeof(lookup.Components.AppWorkspace)" render-mode = "Server"  />
</div>
@section Scripts{
    <script>
        let _dotNetObject;
        let lookupWindow;
        var FormScripts = FormScripts || {};
        FormScripts.openLookup = function (o) {
            _dotNetObject = o.objRef
            if (lookupWindow)
                lookupWindow.close();
            lookupWindow = window.open('@Url.Page("LookUp")' )
        }

        window.addEventListener('storage', (event) => {
        if (event.storageArea != localStorage) return;

        if (event.key === 'selected_item') {
            var selected_value = localStorage.getItem('selected_item');
            _dotNetObject.invokeMethodAsync('LookupItemSelect', selected_value);

            localStorage.setItem('selected_item', '0');
            lookupWindow.close();
        }
    });
</script>

Родительский компонент Blazor:

@using Microsoft.JSInterop
@inject NavigationManager NavManager
@inject IJSRuntime JSRuntime
@implements IDisposable;

<h3>App Workspace</h3>

<button class = "btn btn-link" onclick = "@(() => LookupClick())">[Lookup]</button>
<SelectWithLookup @ref = "ActiveLookup" Options = "Options"  />

@code {
DotNetObjectReference<AppWorkspace> ObjectReference;
[Parameter]
public List<SelectOption> Options { get; set; } = new() { new SelectOption() { Id = 100, Text = "Option 100" }, new SelectOption() { Id = 200, Text = "Option 200" } };

private SelectWithLookup ActiveLookup { get; set; } = new();
public List<SelectWithLookup> selects = new List<SelectWithLookup>();

SelectWithLookup SelectRef
{
    set { selects.Add(value); }
}

[JSInvokable("LookupItemSelect")]
public async Task LookupItemSelect(string Id)
{
    await ActiveLookup.LookupSelect(int.Parse(Id));
    StateHasChanged();
}

private async Task LookupClick()
{
    ObjectReference = DotNetObjectReference.Create(this);
    await JSRuntime.InvokeVoidAsync("FormScripts.openLookup", new { objRef = 
    ObjectReference });
}

public void Dispose()
{
        GC.SuppressFinalize(this);
        if (ObjectReference != null)
        {
            ObjectReference.Dispose();
        }
    }
}

Детский компонент Blazor:

<select class = "form-control mb-3" >
    <option value = "0">[Select]</option>
    @if (Options is not null)
    {
        @foreach (var item in Options.OrderBy(z => z.Text))
        {
            <option value = "@item.Id" selected = "@item.IsSelected">@item.Text</option>
        }
    }
</select>

@code {

[Parameter]
public List<SelectOption> Options { get; set; }

public async Task LookupSelect(int id)
{
    Options.ForEach(x =>
    {
        if (id == x.Id)
            {
                x.IsSelected = true;
            }
            else
            {
                x.IsSelected = false;
            }
        });
        StateHasChanged();
    }

    [Parameter]
    public EventCallback<SelectWithLookup> LookupClickEvent { get; set; }

    private async Task LookupClick(SelectWithLookup s)
    {
        await LookupClickEvent.InvokeAsync(s);
    }

}