Skip to content
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.

Sign up for GitHub

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

Jump to bottom

fix(ui5-list): add correct focus style and accessibility roles for no-data item #10503

Merged
merged 3 commits into from
Feb 17, 2025
Merged

fix(ui5-list): add correct focus style and accessibility roles for no-data item #10503

merged 3 commits into from
Feb 17, 2025

Conversation

NakataCode
Copy link
Contributor

@NakataCode NakataCode commented Jan 9, 2025 •
edited
Loading

  • Fixed incorrect focus style for the "no data" item with and without a header-text.
  • Added role="listitem" to the "no data" item.

Fixes: #10436

@NakataCode NakataCode marked this pull request as ready for review January 9, 2025 20:40
@dobrinyonkov dobrinyonkov self-requested a review January 10, 2025 08:34
@github-actions github-actions bot added the Stale label Feb 1, 2025
@PetyaMarkovaBogdanova PetyaMarkovaBogdanova removed the request for review from dobrinyonkov February 5, 2025 09:21
@github-actions github-actions bot removed the Stale label Feb 6, 2025
@yanaminkova
Copy link
Member

You don't need to add aria-labelledby to the <li> element. The screen reader will automatically announce the text content "No Data Available" when the <li> receives focus, as this text is within the element's DOM hierarchy

Regarding the focus issue - it is still reproducible on my side and occurs in the playground across all themes, not just in contrast ones:

image

@NakataCode NakataCode merged commit 9a0bc7c into main Feb 17, 2025
12 checks passed
@NakataCode NakataCode deleted the list-no-data branch February 17, 2025 13:08
@ui5-webcomponents-bot
Copy link
Collaborator

🎉 This PR is included in version v2.8.0-rc.2 🎉

The release is available on v2.8.0-rc.2

Your semantic-release bot 📦🚀

ilhan007 pushed a commit that referenced this pull request Mar 4, 2025
@NakataCode @ilhan007
fix(ui5-list): add correct focus style and accessibility roles for no…
3e4f1f3 
…-data item (#10503)

- Fixed incorrect focus style for the "no data" item with and without a header-text.
- Added role="listitem" to the "no data" item.

Fixes: #10436
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@yanaminkova yanaminkova yanaminkova approved these changes

Assignees
No one assigned
Labels
released
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[SF_ACC][ui5-list]: focus style of no data list item is not correct and also missing acc role "listitem"
3 participants
@NakataCode @yanaminkova @ui5-webcomponents-bot