MenuBarItem with no Items shows blank Dropdown

Describe the bug It’s sometimes desirable to have a top-level MenuBarItem in a MenuBar that contains no items and is just effectively a ‘button’. This is common in some apps for certain common functions or for a simple ‘Help’ or ‘About’ dialogs.

Steps to reproduce the bug

1. Copy Keyboard accelerator example from XAML Controls Gallery into XAML Studio
2. Add a blank MenuBarItem: <muxc:MenuBarItem Title="View"/>
3. Click on it, note: a blank menu drops down.

Expected behavior No Menu to drop-down, should only act as a button.

Screenshots

Full XAML Example

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
    mc:Ignorable="d">

<muxc:MenuBar>
  <muxc:MenuBarItem Title="File">
    <MenuFlyoutItem Text="New">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="N"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Open...">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="O"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Save">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="S"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Exit">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="E"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
  </muxc:MenuBarItem>

  <muxc:MenuBarItem Title="Edit">
    <MenuFlyoutItem Text="Undo">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="Z"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Cut">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="X"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Copy">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="C"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
    <MenuFlyoutItem Text="Paste">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="V"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
  </muxc:MenuBarItem>

  <muxc:MenuBarItem Title="View"/>

  <muxc:MenuBarItem Title="Help">
    <MenuFlyoutItem Text="About">
      <MenuFlyoutItem.KeyboardAccelerators>
        <KeyboardAccelerator Modifiers="Control" Key="I"/>
      </MenuFlyoutItem.KeyboardAccelerators>
    </MenuFlyoutItem>
  </muxc:MenuBarItem>
</muxc:MenuBar>
</Page>

Version Info

NuGet package version: 2.3.191129002

Windows 10 version	Saw the problem?
Insider Build (xxxxx)
May 2020 Update (19041)	Yes
November 2019 Update (18363)
May 2019 Update (18362)
October 2018 Update (17763)
April 2018 Update (17134)
Fall Creators Update (16299)
Creators Update (15063)

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

Additional context Related to gap for #2216

[Felix-Dev]

This would also match the behavior of WPF’s Menu \ MenuItem control:

<Menu Grid.Row="0">
    <MenuItem Header="Options">
        <MenuItem.Items>
            <MenuItem Header="Option 1" />
            <MenuItem Header="Option 2" />
        </MenuItem.Items>
    </MenuItem>
    <MenuItem Header="Help" Click="MenuItem_Click" />
</Menu>

It’s important to note here that WinUI’s MenuBarItem currently does not have APIs to handle user input like a Click event or a Command property like WPF’s MenuItem does. There is the inherited PointerPressed event from UIElement but that event is not raised for developers to use here.

As such, if it’s agreed that it’s a valid use case to have a MenuBarItem act like a button (when there are no child items) it makes sense to me that we should also add APIs like a Click event or a Command property to the MenuBarItem then.

[Felix-Dev]

I will try to create the proposal this weekend though I’m not sure if every API of it can be added prior to WinUI going full open-source. The Command API for example can probably be best implemented by re-using internal WinUI Command logic (used for other Command properties in WinUI) and, from what I can tell after doign a quick check, that logic is not available in WinUI 2.