There is no functionality provided to adjust columns width which is achievable using single pointer.:A11y_.NetAspireDashboard_Resources_Grid_DraggingMovement

[PoojaNamde]

"Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier."

Please do not close this bug. This bug should only be closed by Trusted Tester after verification.

Tags:

#A11yTCS; #A11yMAS; #A11ySev2; #A11yWCAG2.2; #Win11; #ChromiumEdge; #FTP; #DesktopWeb; #.NET Core; #SH_.Net Aspire Dashboard_Web_Mar2024; #DraggingMovement; #WCAG2.5.7;

Environment Details:

Application Name: .Net Aspire Dashboard
URL: https://localhost:19888/
Chrome Version 122.0.2365.80 (Official build) (64-bit)
Window Version: Win 11
OS Build: 22621.3085

Repro Steps:

1. Hit the URL: http://localhost:15888/
2. TAB to "Resources" tab item and hit select the tab by pressing Enter key.
3. Navigate on the columns and check if single pointer functionality is provided to adjust the width of column.

Actual Results:

There is no functionality provided to adjust columns width which is achievable using single pointer.

Note: Same issue reproes on 'Structured Logs' page -> table and Traces page->table.

Expected Results:

There should be functionality provided to adjust columns width which is achievable using single pointer.

User Impact:

Functionality provided only with dragging will create difficulty for users using input devices like a trackball, head pointer, eye-gaze system to perform the operation.

Attachment:

3364_A11y_.NetAspireDashboard_Resources_Grid_DraggingMovement.webm

[adamint]

@vnbaaij

[vnbaaij]

Hi @PoojaNamde ,

As I am not an a11y expert, can you elaborate on what 'single pointer functionalty' means exactly? Is it keyboard support? Or more?

[PoojaNamde]

@vnbaaij Single pointer means pointer input that operates with one point of contact with the screen, including single taps and clicks, double-taps and clicks, long presses, and path-based gestures.

[vnbaaij]

@PoojaNamde ok, that part is clear. But that does not help to make it clearer to me how this should/could be used in resizing the columns.

Please describe in more detail what kind of solution needs to be implemented to resolve this a11y issue.

[PoojaNamde]

@vnbaaij You can take reference of https://developer.microsoft.com/en-us/fluentui#/controls/web/detailslist/keyboardcolumnreorderresize to solve this issue.

[adamint]

@vnbaaij assigning to you. Let me know if there is anything we can do in aspire if we need a workaround.

[kvenkatrajan]

@adamint - Vincent has a PR checked in. Please upgrade to new blazor fluent version to apply fix in 8.1 (main) - we will not be backporting this to the 8.0 branch.

[vnbaaij]

Just a heads up, the package containing the pr (4.6.2) has not yet been released.

[kvenkatrajan]

Thanks @vnbaaij - please let us know when its ready for integration. Maybe remove the blocked tag :)

[adamint]

@vnbaaij could you ping when the package is released?

[adamint]

@vnbaaij is there any update with this?

[vnbaaij]

Package has been released (4.7.1) resize by keyboard functionality is working in there. See the examples in the demo site at https://www.fluentui-blazor.net/DataGrid#typicalusage

[adamint]

@PoojaNamde please re-test on main branch. This is resolved

[dotnet-policy-service]

This submission has been automatically marked as stale because it has been marked as requiring author action but has not had any activity for 14 days.
It will be closed if no further activity occurs within 7 days of this comment.

[SwatiJo]

Providing keyboard equivalence for a dragging operation does not meet this Success Criterion. there should be single pointer available. for ex -
Fluent UI - Controls - React - DetailsList - Keyboard Column Reorder & Resize (microsoft.com)

[merriemcgaw]

@adamint @vnbaaij - this is a new requirement which is in addition to the keyboard column resizing. Note in the example it shows that there is the ability to adjust the columns by specifying a size in a menu. That is the new requirement. Let me know if you have any questions.

[vnbaaij]

@merriemcgaw would a per column option menu (like in the example) with plus/minus buttons that increase/decrease column width in discreet steps be fulfilling this requirement as well?
I think a dialog where a user needs to fill in a width in pixels is a bit antiquated.

[merriemcgaw]

@vnbaaij I think that +/- buttons in a column options button would be a perfectly reasonable option. If you want to make sure it would be sufficient before implementation we can go to Office Hours.

[PoojaNamde]

@adamint
Verified the bug in the environment
still able to repro it as we are not able to access the +/- option with keyboard, hence reactivating it.
Please find repro attachment for reference.

Video.9-09.at.17.44.1.webm