aspire icon indicating copy to clipboard operation
aspire copied to clipboard

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

Open PoojaNamde opened this issue 1 year ago • 15 comments

"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

Traces_Table_DraggingMovement

StructuredLogs_Table_DRaggingMovement

PoojaNamde avatar Apr 03 '24 17:04 PoojaNamde

@vnbaaij

adamint avatar Apr 03 '24 18:04 adamint

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?

vnbaaij avatar Apr 03 '24 19:04 vnbaaij

@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.

PoojaNamde avatar Apr 04 '24 06:04 PoojaNamde

@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.

vnbaaij avatar Apr 04 '24 06:04 vnbaaij

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

PoojaNamde avatar Apr 04 '24 06:04 PoojaNamde

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

adamint avatar Apr 15 '24 17:04 adamint

@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.

kvenkatrajan avatar Apr 19 '24 17:04 kvenkatrajan

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

vnbaaij avatar Apr 19 '24 17:04 vnbaaij

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

kvenkatrajan avatar Apr 19 '24 17:04 kvenkatrajan

@vnbaaij could you ping when the package is released?

adamint avatar Apr 19 '24 18:04 adamint

@vnbaaij is there any update with this?

adamint avatar Apr 26 '24 20:04 adamint

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

grid-resize-keyboard 2

vnbaaij avatar Apr 26 '24 22:04 vnbaaij

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

adamint avatar May 01 '24 13:05 adamint

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.

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)

SwatiJo avatar May 24 '24 22:05 SwatiJo

@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.

merriemcgaw avatar Jun 19 '24 21:06 merriemcgaw

@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.

vnbaaij avatar Jun 20 '24 17:06 vnbaaij

@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.

merriemcgaw avatar Jun 20 '24 17:06 merriemcgaw

@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

PoojaNamde avatar Sep 09 '24 12:09 PoojaNamde