-
Bug
-
Resolution: Unresolved
-
Medium (View bug fix roadmap)
-
None
-
8.20.30, 9.12.2, 9.4.17
-
8.2
-
Severity 3 - Minor
-
Issue Summary
The "Search issues" button inappropriately uses list semantics.
Steps to Reproduce
- Navigate onto the above mentioned page.
- Navigate onto the mentioned instance and observe that the element is not interrelated.
- Inspect the code.
- Observe that the input field is inappropriately included within the list markup.
Screenshot
Actual Results
The "Search issues" input field in the header inappropriately uses list semantics. However, this input field is not interrelated with the items it has been grouped.
This might confuse the users of a screen reader. That the unrelated input field uses unordered list semantics may prevent them from efficiently comprehending the page's content structure.
Expected Results
Content that is not interrelated, sequenced or paired must not use list semantics. In this case, we would recommend you to move the <input> element out of the <ul> in the DOM. You can instead wrap this button in any neutral tag that do not have any structural meaning, such as <div>, and <span> tags.
Code Snippet
<div> <label for="i1">Search issues</label> <input type="text" id="i1"...> </div>
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 Ventura 13.3.1
Chrome - Version 113.0.5672.63 (Official Build) (x86_64)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.4 (18615.1.26.110.1)
JAWS- Version 2023
NVDA- Version 2024.3
Voiceover - Version Latest
- links to
| Form Name | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|