Using Command and ComboBox is not working in SettingsExpander.Items

[ghost1372]

Describe the bug

if we use MvvM Command in ComboBox and SettingsExpander.Items, The command is not executed.

Steps to reproduce

this is my xaml:

<wuc:SettingsExpander Description="Choose Icon Pack to display for the season number"
                                  Header="Icon Pack"
                                  IsExpanded="True">
                <wuc:SettingsExpander.Items>
                    <wuc:SettingsCard Description="Choose Icon Pack to display for the season number"
                                      Header="Icon Pack"
                                      HeaderIcon="{wuc:BitmapIcon Source=Assets/Fluent/iconPack.png}">
                        <ComboBox Name="cmbIconPack">
                            <ComboBoxItem Content="Glyph" Tag="Glyph" />
                            <ComboBoxItem Content="Fluent" Tag="Fluent" />
                            <i:Interaction.Behaviors>
                                <ic:EventTriggerBehavior EventName="SelectionChanged">
                                    <ic:EventTriggerBehavior.Actions>
                                        <ic:InvokeCommandAction Command="{x:Bind ViewModel.IconPackChangedCommand}" CommandParameter="{Binding ElementName=cmbIconPack}" />
                                    </ic:EventTriggerBehavior.Actions>
                                </ic:EventTriggerBehavior>
                            </i:Interaction.Behaviors>
                        </ComboBox>
                    </wuc:SettingsCard>
                </wuc:SettingsExpander.Items>
            </wuc:SettingsExpander>

if i dont use SettingsExpander.Items everything is working normal, but if i use SettingsExpander.Items command is not working

### Expected behavior

command should be working!

### Screenshots

_No response_

### Code Platform

- [ ] UWP
- [X] WinAppSDK / WinUI 3
- [ ] Web Assembly (WASM)
- [ ] Android
- [ ] iOS
- [ ] MacOS
- [ ] Linux / GTK

### Windows Build Number

- [ ] Windows 10 1809 (Build 17763)
- [ ] Windows 10 1903 (Build 18362)
- [ ] Windows 10 1909 (Build 18363)
- [ ] Windows 10 2004 (Build 19041)
- [ ] Windows 10 20H2 (Build 19042)
- [ ] Windows 10 21H1 (Build 19043)
- [X] Windows 11 21H2 (Build 22000)
- [ ] Other (specify)

### Other Windows Build number

_No response_

### App minimum and target SDK version

- [ ] Windows 10, version 1809 (Build 17763)
- [ ] Windows 10, version 1903 (Build 18362)
- [ ] Windows 10, version 1909 (Build 18363)
- [ ] Windows 10, version 2004 (Build 19041)
- [ ] Other (specify)

### Other SDK version

_No response_

### Visual Studio Version

2022

### Visual Studio Build Number

_No response_

### Device form factor

Desktop

### Additional context

_No response_

### Help us help you

No, I'm unable to contribute a solution.

[ghost1372]

@michael-hawker @niels9001

[michael-hawker]

@ghost1372 can you clarify what you mean by "if i dont use SettingsExpander.Items everything is working normal, but if i use SettingsExpander.Items command is not working"?

Also, what version of WinUI 3 are you using?

This seems like it'd be an issue with scope and binding vs. specific to the control itself. Do you see the command has been bound to the property?

Can you setup a repro of the problem in the https://github.com/michael-hawker/WinUI2Plus3Template? And see if the same problem occurs in UWP as well? (@Arlodotexe we should link to this template in the issue template for folks)

[ghost1372]

@michael-hawker The SettingsExpander has four parts for placing items:

Items ItemsHeader ItemsFooter Content

Placing items in the ItemsHeader, ItemsFooter and Content works well, But placing items in the Items section does not work.

i am using latest version: 1.3.1 and today i tested with 1.3.2.

Do you see the command has been bound to the property?

Do you mean this?

this is a winui 3 sample repro.

App22.zip

i tested in uwp and is not working too.

[leoshusar]

I actually think ItemsRepeater might be the culprit here.

I modified the repro to show the behavior difference between ItemsRepeater and ItemsControl:

<ItemsControl ItemsSource="{x:Bind ViewModel.Items}">
    <ItemsControl.ItemTemplate>
        <DataTemplate x:DataType="x:String">
            <ComboBox Name="cmbTest1">
                <ComboBoxItem Content="TextBlock" Tag="TextBlock" />
                <ComboBoxItem Content="HyperLink" Tag="HyperLink" />
                <i:Interaction.Behaviors>
                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                        <ic:EventTriggerBehavior.Actions>
                            <ic:InvokeCommandAction Command="{Binding ElementName=PageRoot, Path=ViewModel.Test1Command}" CommandParameter="{Binding ElementName=cmbTest1}" />
                        </ic:EventTriggerBehavior.Actions>
                    </ic:EventTriggerBehavior>
                </i:Interaction.Behaviors>
            </ComboBox>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

<ItemsRepeater Grid.Column="1" ItemsSource="{x:Bind ViewModel.Items}">
    <ItemsRepeater.ItemTemplate>
        <DataTemplate x:DataType="x:String">
            <ComboBox Name="cmbTest1">
                <ComboBoxItem Content="TextBlock" Tag="TextBlock" />
                <ComboBoxItem Content="HyperLink" Tag="HyperLink" />
                <i:Interaction.Behaviors>
                    <ic:EventTriggerBehavior EventName="SelectionChanged">
                        <ic:EventTriggerBehavior.Actions>
                            <ic:InvokeCommandAction Command="{Binding ElementName=PageRoot, Path=ViewModel.Test2Command}" CommandParameter="{Binding ElementName=cmbTest2}" />
                        </ic:EventTriggerBehavior.Actions>
                    </ic:EventTriggerBehavior>
                </i:Interaction.Behaviors>
            </ComboBox>
        </DataTemplate>
    </ItemsRepeater.ItemTemplate>
</ItemsRepeater>

And this is what happens:

https://github.com/CommunityToolkit/Labs-Windows/assets/13891066/aa78f395-23d7-440f-b755-13884730cca8

App22.zip

I'm using {Binding ElementName=PageRoot, Path=ViewModel.XxxCommand} because of the different scope. The binding inside ItemsControl works as intended, but the literally copypasted XAML, inside ItemsRepeater, doesn't work at all.

[ghost1372]

@michael-hawker can you please fix this issue?

[niels9001]

@leoshusar @ghost1372 Am I understanding correctly that this bug also appears in a standalone ItemsRepeater vs. ItemsControl?

If so, this seems to be an ItemsRepeater bug - I'd recommend filing an issue in the WinUI repo (might be that there's an existing issue already, but couldn't find it).

[michael-hawker]

Yes, I remember now, there is an issue for this that already exists in the WinUI repo here: https://github.com/microsoft/microsoft-ui-xaml/issues/560 (Also probably related: https://github.com/microsoft/microsoft-ui-xaml/issues/2508)

I'll post on the issue with a link to @leoshusar's great repro project, thanks!

[ghost1372]

Tnx @michael-hawker The mentioned issue is open since 2019! WASDK team works very fast!🤦‍♂️😖 Do we have to wait for the next years to solve this problem by the super fast WASDK team? Can't fix the problem yourself? Like changing ItemsRepeater?

[michael-hawker]

@ghost1372 I've moved it to the top of our tracking list and will investigating raising with WinUI team. Looks like a number of folks up-voted my latest comment on it, but not the issue itself. Those help.

We spent a lot of time on this control and needed to use ItemsRepeater for the required pattern, so we can't change that here.

[ghost1372]

Hi @michael-hawker https://github.com/microsoft/microsoft-ui-xaml/issues/560#issuecomment-2262693759 fixed and i tested it and ItemsRepeater/ItemsControl both worked fine with wasdk v1.6. however this issue still not working i upload a new sample (updated with wasdk v1.6)

New-App22.zip