MudSelectExtended no longer rendering selected item(s) when ValuePresenter is "ValuePresenter.Chip""

[PlayerModu]

MudSelectExtended no longer rendering selected item(s) when ValuePresenter is "ValuePresenter.Chip". It shows the selected item(s) when set to ValuePresenter.Text

Notes:
blazor server
.NET 7 application
MudBlazor.Extensions 6.4.6
MudBlazor 6.2.0

[PlayerModu]

Just seen and verified that setting ChipVariant="Variant.Filled on the component seems to resolve the issue and the chip is rendering again. I'm assuming it defaults to not render if this isn't set now on the component as we didn't have this previously?

[PlayerModu]

I'm still seeing weird issues with the Chip rendering. Some components render the Chip fine and then others (with no discernable differences in their component param configuration) don't render the chip unless I click on it again to see the popover menu of available options, then the chip disappears when I click off. Have there been any other issues raised with the Chip rendering?

[mckaragoz]

Do you have an example? I can work on it

[PlayerModu]

I'll try and get a working example that is dummy code and I can share, will update here when I can

[TeaBreakTom]

@mckaragoz I've been trying and failing to replicate/understand this issue for a couple of days but so far I've been unsuccessful as it's very difficult to debug. Here's what we know:

• At this point in MudSelectExtended.razor, the chips aren't rendered because the Items collection is empty:

<MudChipSet Class="d-flex flex-wrap mud-width-full" Style="row-gap: 4px" AllClosable="ChipCloseable" OnClose="ChipClosed">
    @foreach (var item in Items?.Where(x => SelectedValues.Contains(x.Value)))
    {
        <MudChip Class="@ChipClass" Value="item.Value" Text="@(string.IsNullOrEmpty(item.Text) ? Converter.Set(item.Value) : item.Text)" Color="@Color" Size="@ChipSize" Variant="@ChipVariant" />
    }
</MudChipSet>

• The ItemCollection property never loses its contents, only Items/_items.
• The chip only disappears when the popover is closed. If you open it up, the chip appears.
• The component always renders multiple times, and Items/_items is only empty on the last render.
• There is no discernible reason why this happens to some components but not others. We have several almost identical MudSelectExtended components on a page, yet only one of them has this issue. We have several others in different pages in our project, but again, it seems to be quite random which components are affected.
• The problem occurs reliably every time in the affected components.

I appreciate that it's impossible for you to debug it without an example so I thought I would post all the information we have so far in the hope that you might have some suggestions about where to look? If you can point us in the right direction we might be able to fix it and create a PR.

[mckaragoz]

@TeaBreakTom thanks for all the info. SelectExtended takes the values and items from ListExtended, and ListExtended has couples of suppression to have correct value within the dozens of re-renders. These suppressions are really helpful to fix bugs on original component. And as you said these suppressions make debug nearly impossible. Maybe we can change the design a bit with bind:after but MudBlazor still support net 6 and we can't add this for now.

I think SelectedItem and SelectedItems are unnecessary, because the items are MudListItemExtended, not MudSelectItemExtended i think we need some kind of converter/updater that when a selected item changed, it also changes the Items and also ItemCollection maybe.

[digitaldias]

I have the same issue.
MudBlazor: 6.2.2
CodeBeam.MudBlazor.Extensions: 6.4.9
Project targets .Net 7

                <MudSelectExtended
                    T="TestValue" 
                    ItemCollection="TestValues"
                    SelectedValues="SelectedTsSearchBoxItems"
                    Label="@(isMultiSelect ? "Multiple selection" : "Single selection")"
                    ToStringFunc="@(v => v.Value)"
                    Variant="Variant.Text"
                    ValuePresenter="MudExtensions.Enums.ValuePresenter.Chip"
                    ChipCloseable="true"
                    ChipVariant="MudBlazor.Variant.Filled"
                    ChipSize="MudBlazor.Size.Small"
                    MultiSelection="@isMultiSelect" />

Values are:

    public record TestValue(int Number, string Value);

    List<TestValue>? TestValues{ get; set; }
    IEnumerable<TestValue> SelectedTsSearchBoxItems{ get; set; }

    protected override void OnInitialized()
    {
        TestValues = Enumerable.Range(0, 1000)
            .Select(n => new TestValue(n, $"Value-{n.ToString("0000")}"))
            .ToList();
        base.OnInitialized();
    }

The selection disappears when you finish searching, all the chips are gone. When you then go back to search for more items and click on something new, ALL the chips appear at once until you close the search again / lose focus.

Finally: I selected value 647 first, then dropped focus. Then I came back to the list and selected value 3 and 7. You can see that it now shows my last selection (as long as the MudSelectExtended has focus), but it does NOT show the 647 value. I can confirm that all 3 values are selected in the SelectedTsSearchBoxItems collection.

Would love to see this one fixed. We're delivering a design for a customer in 2 weeks, and hopefully, this one has been ironed out by then :)

[mckaragoz]

@digitaldias it look like we see the bugs especially on ItemCollection approach. You can use RenderFragment approach as a workaround.

<MudSelectExtended
                    T="TestValue" 
                    SelectedValues="SelectedTsSearchBoxItems"
                    Label="@(isMultiSelect ? "Multiple selection" : "Single selection")"
                    ToStringFunc="@(v => v.Value)"
                    Variant="Variant.Text"
                    ValuePresenter="MudExtensions.Enums.ValuePresenter.Chip"
                    ChipCloseable="true"
                    ChipVariant="MudBlazor.Variant.Filled"
                    ChipSize="MudBlazor.Size.Small"
                    MultiSelection="@isMultiSelect">
    @foreach (var val in TestValues)
    {
        <MudSelectItemExtended Value="val" Text="@val.Value" />
    }

</MudSelectExtended>

[mckaragoz]

@digitaldias and i think you have a problem in here SelectedValues="SelectedTsSearchBoxItems"

You should use two way bind like @bind-SelectedValues="SelectedTsSearchBoxItems"

[mckaragoz]

• The ItemCollection property never loses its contents, only Items/_items.
• The chip only disappears when the popover is closed. If you open it up, the chip appears.

@TeaBreakTom i changed the _items like this, probably fix an issue, but its not the only bug.

if (ItemCollection != null)
{
    foreach (var item in ItemCollection.Where(x => SelectedValues.Contains(x)))
    {
         <MudChip Class="@ChipClass" Value="@item" Text="@Converter.Set(item)" Color="@Color" Size="@ChipSize" Variant="@ChipVariant" />
    }
}
else
{
     foreach (var item in Items?.Where(x => SelectedValues.Contains(x.Value)) ?? new List<MudSelectItemExtended<T>>())
     {
           <MudChip Class="@ChipClass" Value="item.Value" Text="@(string.IsNullOrEmpty(item.Text) ? Converter.Set(item.Value) : item.Text)" Color="@Color" Size="@ChipSize" Variant="@ChipVariant" />
     }
}

[TeaBreakTom]

@mckaragoz I've just tested and it does indeed fix this bug!