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.

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

<ui5-button> Axe Issue: <svg> has role="presentation" but is not focusable #3954

Closed
1 of 4 tasks
codefactor opened this issue Sep 17, 2021 · 5 comments · Fixed by #3983
Closed
1 of 4 tasks

<ui5-button> Axe Issue: <svg> has role="presentation" but is not focusable #3954

codefactor opened this issue Sep 17, 2021 · 5 comments · Fixed by #3983

Comments

@codefactor
Copy link
Contributor

Bug Description

This is a break out issue copy from #3933

3. Elements of role none or presentation should be flagged

custom shellbar icon buttons should have role="img" on the <svg> ?

This one comes up for shellbar icon buttons <svg>, but not all of them just the custom ones. The search button and the account menu seem fine. This one complains that the role is "presentation" but it's not focusable (i.e. because tabindex=-1) but we know it's not supposed to be focusable because it's just the <svg> and it's a child of a <button> that is focusable so probably the role should not be "presentation" it should be "img" that seems to work for some other buttons in the same level.

This appears to be because the <ui5-icon> needs a effectiveAccessibleName somehow, and then the role becomes img instead of presentation - it is not clear yet precisely how that is set.

Expected Behavior

The Shellbar should have no Axe issues

Steps to Reproduce

See #3933

Isolated Example

If possible, please provide an isolated example by forking CodeSandbox.

Context

  • UI5 Web Components version: {...}
  • OS/Platform: {...}
  • Browser: {...}
  • Affected component: {...}

Log Output / Stack Trace / Screenshots

{...}

Priority

  • Low
  • Medium
  • High
  • Very High

The priority indicates the severity of the issue. To set the appropriate priority consider the following criteria:

  • Breaks entire application or system - High or Very High
  • Accessibility issue - Medium or High
  • Functional issue - Medium or High
  • Visual issue - Low or Medium

Note: The priority might be re-evaluated by the issue processor.

Stakeholder Info (if applicable)

  • Organization: {...}
  • Bussiness impact: {...}
@ilhan007
Copy link
Member

Hi @PetyaMarkovaBogdanova could you process this one as well

@PetyaMarkovaBogdanova
Copy link
Contributor

Hi @SAP/ui5-webcomponents-topic-p,
can you, please, check if the cofiguration of role="presentation"and a tabindex "-1" is causing the AXE error?

Kind regards,
Petya Markova.
(UI5 Developer)

@PetyaMarkovaBogdanova
Copy link
Contributor

The priority of the issue is not due to the severity of the issue, but because of the deadline for resolving it

@dobrinyonkov dobrinyonkov added this to Issues in Maintenance - Topic P via automation Sep 23, 2021
@dobrinyonkov dobrinyonkov self-assigned this Sep 23, 2021
@dobrinyonkov dobrinyonkov moved this from Issues to In Progress in Maintenance - Topic P Sep 23, 2021
dobrinyonkov added a commit to dobrinyonkov/ui5-webcomponents that referenced this issue Sep 23, 2021
By design, decorative icons (role=presentation) should also have aria-hidden=true

Fixes: SAP#3954
Maintenance - Topic P automation moved this from In Progress to Completed Sep 29, 2021
ilhan007 pushed a commit that referenced this issue Sep 29, 2021
By design, decorative icons (role=presentation) should also have aria-hidden=true

Fixes: #3954
@ilhan007
Copy link
Member

Hello @codefactor there is a fix, merged into the master, please wait for the next patch release.
Once there is a new version released, we will update you.

ilhan007 pushed a commit that referenced this issue Oct 3, 2021
By design, decorative icons (role=presentation) should also have aria-hidden=true

Fixes: #3954
@ilhan007
Copy link
Member

ilhan007 commented Oct 4, 2021

Hello @codefactor the issue has been resolved in 0.31.20

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: Completed
Development

Successfully merging a pull request may close this issue.

5 participants