UWP combo box inside a pivot control loses selected item when tested using a simulator or a surface pro device.

See more:

C#

XAML

UWP

So, I have been facing a problem with a UWP application for 2 days now which seems to only occur when using the simulator or the surface pro (target) device.

So we have a UWP application at work which is made using the Galasoft MVVM light framework.

On one of the screens of the application, there is a list of "Equipment" that has a button to modify that particular equipment.
Upon clicking that button, the user is navigated to another page that has a pivot control with 4 tabs. The item source of this pivot control is a collection of Views.

Some of these tabs also contain some combo boxes with a list of Key-Value pairs and a selected item property bound to them.

Recently the user reported a problem, that the first drop-down list (combo box) on one of these tabs has no selected item whereas it should have.

We started testing the scenario and everything seems to be working good until I start testing using the UWP simulator provided in the Visual Studio Professional 2017 (15.7.1), which is really really annoying thanks to the BSOD every 10 or so minutes of use.

Anyway, when using the simulator with the "Mouse Mode" as the selected interaction mode, I get the issue.
Upon debugging I noticed an extra call from the external code to the setter of the property in the ViewModel, that is bound with the selected item property of the said combo box, with a null value (maybe this is the issue).

I also noticed that this happens only for the first combo box of the first tab I navigate to, after opening the tabs page. No extra calls for other combo boxes on the same tab or any other combo box on any other tab upon further navigation.

Strangely enough when I interact with the application using the "Basic touch mode", the problem seems to go away. There are no calls to the setter from the external code whatsoever.

So after this, I am starting to think that the issue is due to some bug in multimode interaction scenarios. The surface device has a keypad connected to it with that has a touchpad. I have requested the user to retest the scenario after disconnecting the keypad, I'll update the question after they respond.

Update: Problem persists on the surface device even after disconnecting the touchpad.

So here I am open to ideas, suggesting what could be causing the issue and a possible solution.

If you want to have some more information please leave a comment, I'll try to respond ASAP.

Given below is an example with hardcoded values, that behaves in the same way.

<ComboBox x:Name="IntervTypeComboBox" DisplayMemberPath="Label" <code></code> SelectedValuePath="Code"
                          Style="{StaticResource ComboStyle}"
                          ItemsSource="{Binding XYZ, Mode=TwoWay}"
                          ItemContainerStyle="{StaticResource ComboItemStyle}"
                          SelectedItem="{Binding SelectedXYZ, Mode=TwoWay}">
                    <ComboBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel Orientation="Vertical" Width="{Binding ActualWidth, ElementName=IntervTypeComboBox}"/>
                        </ItemsPanelTemplate>
                    </ComboBox.ItemsPanel>
                </ComboBox>

        public ObservableCollection<KeyValueModel> XYZ
        {
            get
            {
                return _xyz;
            }
            set
            {
                if (Set(() => XYZ, ref _xyz, value))
                {
                    SelectedXYZ = XYZ.First();
                }
            }
        }

        public KeyValueModel SelectedXYZ
        {
            get { return _selectedXYZ; }
            set
            {
                Set(() => SelectedXYZ, ref _selectedXYZ, value);
            }
        }

        private void Constructor()
        {
                XYZ = new ObservableCollection<KeyValueModel> {
                new KeyValueModel { Code="Default", Label="-- Sélectionner --"},
                new KeyValueModel { Code="ABC", Label="ABC"},
                new KeyValueModel { Code="DEF", Label="DEF"},
                new KeyValueModel { Code="GHI", Label="GHI"}
                };
            SelectedXYZ = XYZ.FirstOrDefault(x => x.Code == "DEF");
}

What I have tried:

I have tried putting a null check on the value before executing the setter of the Selected item property, didn't work.
I have tried changing the mode of binding of the item-source from two way to one-time, didn't work either.
Then I tried to change the mode of binding of the selected item from two way to one way and use a selection changed event to update the view model property, it is a bad practice and it makes no difference, I know, but I'm desperate.