Skip to content

fix: Keyboard accessibility for column options in FluentDataGrid #3810

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
philliphoff opened this issue May 22, 2025 · 0 comments
Open

fix: Keyboard accessibility for column options in FluentDataGrid #3810

philliphoff opened this issue May 22, 2025 · 0 comments
Labels
a11y Accessibillity status:in-progress Work is in progress

Comments

@philliphoff
Copy link
Member

🐛 Bug Report

When using HeaderCellAsButtonWithMenu in a FluentDataGrid, the column options menu can be opened via the keyboard, but there is no way (that I have found) to tab through the column options once opened. You can only access the individual column options via mouse/trackpad.

💻 Repro or Code Sample

See the sample at: https://www.fluentui-blazor.net/datagrid-typical

Use the keyboard to tab to the "name of the country" header and open the column options menu (e.g. using Enter or Space). Using the keyboard, attempt to tab to the "resize" menu item.

🤔 Expected Behavior

You should be able to tab through the column options and select one.

😯 Current Behavior

There is no way (that I've found) to use the keyboard to tab through or select a column option.

💁 Possible Solution

I don't have a suggestion at the moment for a specific fix.

🔦 Context

This was flagged as an accessibility issue for our product (not being able to get to a portion of the UI via the keyboard).

🌍 Your Environment

.NET 9, WASM, Fluent UI Blazor library v4.11.9

  • OS & Device: [e.g. MacOS, iOS, Windows, Linux] on [iPhone 7, PC]
  • Browser [e.g. Microsoft Edge, Google Chrome, Apple Safari, Mozilla FireFox]
  • .NET and Fluent UI Blazor library Version [e.g. 8.0.2 and 4.4.1]
@microsoft-github-policy-service microsoft-github-policy-service bot added the triage New issue. Needs to be looked at label May 22, 2025
@vnbaaij vnbaaij added status:needs-investigation Needs additional investigation a11y Accessibillity and removed triage New issue. Needs to be looked at labels May 23, 2025
@vnbaaij vnbaaij added status:in-progress Work is in progress and removed status:needs-investigation Needs additional investigation labels May 27, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y Accessibillity status:in-progress Work is in progress
Projects
None yet
Development

No branches or pull requests

2 participants