[P2][Sourcing][Accessibility][Tree table] Levels are not being read correctly and creates confusion for users as it displays only numbers 1 of 4 and so on

[I543348]

Is this a bug, enhancement, or feature request?

Bug

Describe your proposal.

This is in continuation of issue https://github.com/SAP/fundamental-ngx/issues/10618 , here the reading "1 of 4" , "2 of 4" creates confusion for users as users wont know 1 means first parent node and 4 means total children in that parent node. Expectation is to similar to value help dialog's tree table reading where we get a word "level" for eg: Row 1 of 6, level 2 and so on...

Can you handle that on the application side

No

Which versions of Angular and Fundamental Library for Angular are affected? Please, specify the exact version. (If this is a feature request, use current version.)

Angular : 15 core/ platform: 0.43.26

If this is a bug, please provide steps for reproducing it; the exact components you are using;

Its replicable on https://ng-15-downport--fundamental-ngx.netlify.app/#/platform/table/basic#tree with 0.43.26

Please provide relevant source code (if applicable).

https://ng-15-downport--fundamental-ngx.netlify.app/#/platform/table/basic#tree

Please provide stackblitz example(s).

pls refer tree table in 0.43.26 example https://ng-15-downport--fundamental-ngx.netlify.app/#/platform/table/basic#tree

In case this is Accessibility related topic, did you consult with an accessibility expert? If not, please do so and share their recommendations.

Did you check the documentation and the API?

Did you search for similar issues?

Is there anything else we should know?

This is reported by ATL team

[droshev]

news a new JAWS installation. Mike to follow up with Nikolay for support.

[sagar7259]

Hello,

This issue is only replicable with JAWS 2024 and not with JAWS 2023. As we will be always verifying with controls with latest available version of JAWs, this needs to be fixed with it.

Regards, Sagar

[droshev]

@mikerodonnell89 any update here?

[mikerodonnell89]

This appears to be counting the column index. @I543348 I am not sure where you are seeing a Value Help Dialog component with a tree, as that component has been set up to only use flat tables with no children. Anyways, this looks like an unintended side effect of adding tabindex="-1" in setTabbable of the focusable-item.directive.ts so I'll remove that. Need to open a PR to test this in a VM with jaws

[I543348]

This appears to be counting the column index. @I543348 I am not sure where you are seeing a Value Help Dialog component with a tree, as that component has been set up to only use flat tables with no children. Anyways, this looks like an unintended side effect of adding tabindex="-1" in setTabbable of the focusable-item.directive.ts so I'll remove that. Need to open a PR to test this in a VM with jaws

Thanks @mikerodonnell89 , this was provided to me by ATL team @sagar7259 pls help with your inputs

[sagar7259]

@mikerodonnell89 please dont get confused with a tree grid inside a value help,, its a custom UI found in ariba application. But it uses the same NGX tree table where the issue is still reproducible. Reading the column index is unclear because if you check the screen shot from the previous ticket https://github.com/SAP/fundamental-ngx/issues/10618

In this screenshot you can see that there are 2 different levels present for 'Laptop' cell. But JAWS is not reading any level information.

Regards, Sagar

[I543348]

This appears to be counting the column index. @I543348 I am not sure where you are seeing a Value Help Dialog component with a tree, as that component has been set up to only use flat tables with no children. Anyways, this looks like an unintended side effect of adding tabindex="-1" in setTabbable of the focusable-item.directive.ts so I'll remove that. Need to open a PR to test this in a VM with jaws

Hi @mikerodonnell89 , the expectation is to get it read similar to UI5 tree table inside value help dialog as in screenshot https://github.com/SAP/fundamental-ngx/issues/10618

[I543348]

@mikerodonnell89 could you pls confirm the version in which the fix is available? Thanks.

[mikerodonnell89]

My PR to fix this issue caused keyboard support to break when using [allCellsFocusable] so we need to roll it back and reopen this issue

[droshev]

@mikerodonnell89 ng-15 was released today so the issue is fixed now?

[mikerodonnell89]

@mikerodonnell89 ng-15 was released today so the issue is fixed now?

No, the fix for this is what broke keyboard navigation for table so we need a new solution

[mikerodonnell89]

Some more details about is happening here - FocusableListDirective and FocusableItemDirective directives are applying tabindex="-1" to the non-focused items. When a table cell is focused, the screenreader sees that it is one of a set of items with a tabindex. We need to find a way to fix this without affecting FocusableListDirective/FocusableItemDirective

[sagar7259]

Hello,

here we are expecting that the screen reader should read the level information for each level within the tree table like "level 1, level 2 etc.," which makes the user understand the structure of the tree table clearly.

But initially this level information was being read as " 1 of 2", "2 of 2" etc., which was difficult to understand and also its confusing.

Now as per the retest activity I found that the level information is not at all read and not even this "x of x" count and this can be seen in the below screenshot as well.

For the above tree structure the expected reading should be as follows,

"Laptop expanded Row 2 column 2 of 5, row 2 of 12, level 1 Astro laptop 1516 Row 3 Column 2 of 5, row 3 of 12, level 2"

Regards, Sagar

[sagar7259]

Hello,

as per the request i have verified the control for the issue again today and found that the issue is fixed now. The level information is being read correctly now for all the tree levels.

https://deploy-preview-11691--fundamental-ngx.netlify.app/#/platform/table/basic

Hence this ticket can be closed.

Regards, Sagar