Hovering over AppBarButton and then quickly going to CommandBarFlyout submenu hides submenu

Steps to reproduce the bug

1. Create an app with following XAML:

        <Button Content="Button1">
            <Button.Flyout>
                <CommandBarFlyout>
                    <CommandBarFlyout.SecondaryCommands>
                        <AppBarButton Label="AppBarButton1">
                            <AppBarButton.Flyout>
                                <MenuFlyout>
                                    <MenuFlyoutItem Text="Item 1"/>
                                </MenuFlyout>
                            </AppBarButton.Flyout>
                        </AppBarButton>
                        <AppBarButton Label="AppBarButton2">
                        </AppBarButton>
                    </CommandBarFlyout.SecondaryCommands>
                </CommandBarFlyout>
            </Button.Flyout>
        </Button>

1. Run the app
2. Click button
3. Hover over the AppBarButton with a submenu.
4. Hover over the other AppBarButton and then quickly hover over the submenu.

Expected behavior I’d expect the submenu to stay open, but instead it closes. It does if you use a MenuFlyout instead of CommandBarFlyout for the top level menu.

Screenshots Here’s a video of the bug:

https://user-images.githubusercontent.com/359157/128073649-93be0d03-6814-49f5-897b-c0add0ee9779.mov

Here’s a video of the same setup using MenuFlyout instead of CommandBarFlyout, showing that it doesn’t have this bug:

https://user-images.githubusercontent.com/359157/128073839-c70d5c8c-e3a8-4f72-9c9a-40847d8560e0.mov

Version Info Windows 10 21H1 / 19043

Device form factor	Saw the problem?
Desktop	Yes
Xbox
Surface Hub
IoT

Additional context The bug seems to be in AppBarButton.OnPointerEntered. It schedules a timer to hide any open submenus. That timer should get cancelled if the user hovers over the submenu.

A workaround is to add a PointerEntered event on the MenuFlyoutItems in the submenu with the following code:

      menuItem.PointerEntered(
          [parentButton](auto const& /*sender*/, winrt::Input::PointerRoutedEventArgs const& e) {
            parentButton.OnPointerEntered(e);
          });

EDIT: The workaround has a bug. See https://github.com/microsoft/microsoft-ui-xaml/issues/5617#issuecomment-895630516.

[lyahdav]

Thanks, I just checked and it’s UAP version 14.

[StephenLPeters]

No, unfortunately a fix for Windows 10 versions wont be possible. I would recommend an IsApiContractPresent check like this: https://github.com/microsoft/microsoft-ui-xaml/blob/8b7e40a7e8848b62052e63ad9616f66e2763b4a7/dev/dll/SharedHelpers.cpp#L230 to wrap your work around in. I believe the UAP version for this is 15…