Details
-
Bug
-
Resolution: Unresolved
-
High
-
None
-
8.20.30, 9.12.2, 9.4.17
-
8.2
-
Severity 3 - Minor
-
Description
Issue Summary
The “SCRUM-5” link, "More actions for SCRUM-5" button, and so on content are inappropriately nested within the <div> element which contains the role="button".
Steps to Reproduce
- Open the "Accessibility Assessment | Dependencies Report" page.
- Navigate to the mentioned instance.
- Inspect the code.
- Observe that the mentioned content is inappropriately nested within the <div> element having role="button".
Screenshot
Actual Results
The “SCRUM-5” link, "More actions for SCRUM-5" button, and so on content are inappropriately nested within the <div> element that has role="button" and tabindex=”0” attributes. As a result, both these elements receive focus together when read with a screen reader virtual cursor. This might disadvantage the users of a screen reader. That two interactive elements are nested together may confuse or mislead them.
Expected Results
Elements must be nested as per the HTML specifications. As these are two separate interactive elements, we would recommend you to move the mentioned interactive elements and content out of the <div> element in the DOM.
NOTE: Before implementing the accessible name, please connect or take suggestions from the content team.
Code Snippet
<div class="_1IqkJ"> <div class="_3jR8i" role="button" tabindex="0" data-testid="portfolio-3-portfolio.app-simple-plans.main.tabs.dependencies.issue-card-SCEN-94a29408-0fe2-465a-ba6d-46b8c31fcc35" style="top: 179.5px; left: 22.5px; width: 295px; height: 105px; background-color: rgb(255, 255, 255); border-color: rgb(223, 225, 230); border-width: 1px; cursor: pointer;" aria-label=" Drag Issue - SCRUM" ></div> <div class="_2ljhw"> <div class="_1V5S5" style="background-image: url("/images/icons/issuetypes/epic.svg");"></div> <div class="wAKNr"> <a href="/browse/SCRUM" target="_blank" rel="noopener noreferrer">SCRUM</a> </div></div> (...) </div>
Workaround
Currently, there is no known workaround for this behavior. A workaround will be added here when available
Environment
MacBook Pro (13-inch, 2018)
macOs Ventura 13.3.1
Chrome - Version 109.0.5414.119 (Official Build) (64-bit)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.4 (18615.1.26.110.1)
JAWS- Version 2022
NVDA- Version 2021.2
Voiceover - Version Latest