-
Type:
Bug
-
Resolution: Unresolved
-
Priority:
Low
-
None
-
Affects Version/s: 9.5.1
-
Component/s: Accessibility
-
Severity 3 - Minor
Issue Summary
Ordered list mark-up has been used on the page inappropriately.
Steps to Reproduce
- Open "Bitbucket" homepage.
- Navigate onto and activate "Your work" link from header section.
- Navigate to the main content area.
- Turn on screen reader and navigate to mentioned instance present under "Recently viewed repositories" section using up/down arrow keys (Jaws/NVDA) and Control+option+left/right arrow keys (VoiceOver).
- Inspect the code and check that list mark-up used incorrectly.
Screenshot
Actual Results
The links such as "PROJ / awesome-go", "Test Project / acme.sh", "PROJ / nvm", and so on present under "Recently viewed repositories" section are marked up using ordered list inappropriately. As a result, screen reader users found it difficult to understand the information effectively.
Expected Results
Use appropriate list mark-up, such as <ul> and <li> to identify related information. In addition if required, apply styles to maintain the visual presentation of the web page.
In this scenario, remove the <ol> list mark-up from the mentioned links and code them using <ul> and <li> mark-up.
Code Snippet
<ul class="dashboard-repositories-list"> <li><a href="/projects/PROJ/repos/awesome-go/browse" aria-label="PROJ / awesome-go"><div class="project-avatar"><div ...><span class="css-1ui0obd">...</span></div></div><div class="repository-details"><div class="repository-name">awesome-go</div><div class="project-name">PROJ</div></div></a></li> (...) </ul>
Workaround
Currently there is no known workaround for this behavior. A workaround will be added here when available
Environment
MacBook Pro (16-inch, 2021)
macOS: Sonoma 14.7
Chrome - Version 119.0.6045.105 (Official Build) (64-bit)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.6 (18615.3.12.11.2)
JAWS- Version 2023
NVDA- Version 2021.2
Voiceover - Version Latest