UI5 / UI5/webcomponents

[a11y][ViewSettingsDialog]: List group structure results in confusing count info from screen reader announcement

Open
#13,290 1 comment 0 reactions 1 assignee View on GitHub

@unazko is already working on this.

Since Jul 9, 2026.

bug Medium Prio SF_ACC TOPIC B
Dominant language
TypeScript
Stars
1.8k
Forks
285
Avg merge
3d 2h
Merged PRs (30d)
59

Description

Bug Description

In the ViewSettingsDialog the sort options are structured as 2 separate single select lists, each with only 1 group in it. Our a11y team has reported concerns over the announcement this semantic structure produces. Currently the SR will announce that the lists have 1 item (the group), and then go into further details about the group. Additionally, the "Sort Order" list is announced as "View Settings List" whereas the "Sort By" list is announced as "Contains Selectable Items list". The current structure of 1 group within 1 list results in confusing count information that calls into question ACC-264.

See the SR announcement below:
Image

Affected Component

ViewSettingsDialog

Expected Behaviour

Ideally the Sort By and Sort Order List groups should be individual radio groups. This way the grouping label, correct item count and interaction instructions is clear to screen reader users.

Isolated Example

https://ui5.github.io/webcomponents/play/#eNrtV1tv2jAU_itenmhVJ620SROFaeplN3UFlW7TJF5MfABvjh3ZDi2q-O87dhIgvW0w9jYRifhcvnPx7ctdJBSH23jqMhm17yLFMoja68KDKNXKgXIo7ryglOSSzSdGF4rTsZacUPpmqDovznqn19_758Q7eYH_J5KpSXcYgRpGKPO_zhQYx3eCT8e6uQQ_2G8r7VptDmOhgO-RO5RxYX2oNlFawTEKFt4_4Af9WJsUOE211IYy_qOwrmFLOkmN7wcZOEbSKTMWHKb05fodfR2yqlS-cpTPBNzk2rhhRKq6UXgjuJt2OcxECjQMDohQwgkmqU2ZhO5RfFiBOeEw5oBluYROUo6w7KSqG19Hms9JSA2hRyz9WXUzVNImM2ZalFqWnyxVp16zd0ymICZTrPLl4WF-e1wFfGROKKhqXrxBIV7RUeGcVkRwH9KpXg7qDLPXkyNE8SPyFQsfgHNCTWyp6iQrzzUo3yFqK0vKg2kJPLMc4YjF9lEONsUs0OZN7RjkwkFGrNS-rV7wEccWnRzcetElzoKHAAmpAw-K-ZWJLN03Auxri_Ok1V_CnOosZ2r-lyhnkDPjMlxUzwCNhXRgGlCl6OnKHnGlOvfKGmHGZAHr9Vz3lik89NoGsL9jwK_93-Hd123cwcZ0bJ7hADe-3W3Rn5liE2gskJ3g9q_-eTMvdMq2Xo7fmJRcm_Fuq76EG_Jdm5-7Rb3Qiq-dJ_-qn1fgryFLnP6_we_30F91eaOFQfLnd8kKYEPMB9fJ1kj3b5StgR65VLbGal1qR957BbKwp-CSp1hA0I4MSZovXMyW_OAKbCFdeWqi_CkCU5IXJIipEbkjbp57rpRpXsgwpSb1QyZU_KPEKg0D0fL0qiRaSc1Fn6VI0eKghlpjwLVknf4m--soU8GB7CdDJTK_U8kwipM1tS1yLw4JIiN96BsyaPi_xcYmNzBKcWkgj1XOYo-sS04CBauRnnXA7aKNKN0eMroa4g8B3tcrZEO_QcV8NnR7tzwGt3bshcNj1Snk0mS16kiXcJ0WfqvEE3DnMty0J_OPvNVcnHvBucmTY8b5-QztLzAkKDDok0qR4u1yQMaFSsNZ1yq_XVZgsVBo--H68wVG9yfQcak-irVn3V3iTOG_WBZlzKB5LJJWY2GyZiyYuWfDfRr0LmPrDC4AMZ5785jjp46Qe2XAaLH4BZq08gI

Steps to Reproduce
  1. Testing can be done on ViewSettingsDialog component in ui5-wc playground
  2. Navigate to playground with JAWS turned on
  3. Tab through the Sort Order and Sort By lists to recreate the SR announcement
    ...
Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

2.19.0

Browser

Chrome

Operating System

macOS

Additional Context

No response

Organization

SFSF

Declaration
  • I’m not disclosing any internal or sensitive information.

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.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.