microsoft / microsoft/microsoft-ui-xaml

ContentDialog focus highlight is shown when dialog is opened via a keyboard event

Open
#10,315 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug needs-triage
Dominant language
C++
Stars
8.4k
Forks
942
Avg merge
2d 7h
Merged PRs (30d)
105

Description

### Describe the bug

When a ContentDialog is shown which contains interactive controls, the display of the focus highlight is inconsistent:

1. If the dialog is opened via a button click, the highlight is not shown. The first interactive control on the dialog is focussed, but the highlight is not shown.
2. If the dialog is opened via a `KeyUp` event handler or in response to a `KeyboardAccelerator` invocation, the focus highlight _is_ shown.

### Steps to reproduce the bug

1. Create a new project in Visual Studio. Choose "Blank App, Packaged (WinUI 3 in Desktop)" as the project template.

2. Name the project "CheckboxTest".

3. Replace the `MainWindow.xaml` file contents with the XAML below:

``` xaml









```

4. Replace the `MainWindow.xaml.cs` file code with:

``` csharp
using System;
using System.Threading.Tasks;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Input;

namespace CheckboxTest;

public sealed partial class MainWindow : Window
{
public MainWindow()
{
this.InitializeComponent();
this.Content.KeyUp += Content_KeyUp;
}

private async void Content_KeyUp(object sender, KeyRoutedEventArgs e)
{
if (e.Key == Windows.System.VirtualKey.Delete)
{
if (await OpenDeleteDialog() == ContentDialogResult.Primary)
{
// ... do delete stuff
}
}
}

private async void ShowDialogButton_Click(object sender, RoutedEventArgs e)
{
if (await OpenDeleteDialog() == ContentDialogResult.Primary)
{
// ... do delete stuff
}
}

private async Task OpenDeleteDialog()
{
DeleteConfirmationDialog.XamlRoot = Content.XamlRoot;
return await DeleteConfirmationDialog.ShowAsync();
}
}
```

5. Run the project and click the "Show Dialog" button. Observe that the dialog is shown with no focus highlight present on the checkbox control:

![Image](https://github.com/user-attachments/assets/5936c215-379b-4f57-b0eb-becf5a068b1b)

6. Close the dialog by pressing Enter or selecting the "Cancel" button.

7. Press Delete. Observe that the dialog is shown with the first interactive element highlighted as the focussed control:

![Image](https://github.com/user-attachments/assets/9eb6517c-1bfd-4bdb-853d-128694dde359)

### Expected behavior

The display of the focus highlight should be consistent, i.e. independent of the method used to show the ContentDialog. I suggest not showing the highlight until the user uses Tab to move the focus around the dialog's controls.

### Screenshots

_No response_

### NuGet package version

None

### Windows version

Windows 11 (24H2): Build 26100

### Additional context

Additional context may be found on my StackOverflow question here: https://stackoverflow.com/questions/79376328/winui-3-how-to-set-focus-to-a-contentdialog-button/79382988

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the behavior using the MainWindow.xaml and MainWindow.xaml.cs samples, starting at OpenDeleteDialog and ContentDialog.ShowAsync. Compare opening the dialog from ShowDialogButton_Click with Content_KeyUp and the Delete keyboard event. Done means the focus highlight behavior is consistent for both opening paths and matches the stated keyboard-navigation expectation.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
accessibility, desktop
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.