-
Bug
-
Resolution: Fixed
-
Low
-
4.22.3
-
Severity 2 - Major
-
Issue Summary
List mark-up is used incorrectly for the Object schema list items, creating confusion for screen reader users as it announces as two different lists.
Elements:
- Configure
- Copy
- Create
Tested URL
Steps to Reproduce
- Launch the URL
- In the Insights section, in the main content area, keep the screen reader on navigate to the Object schema menu button.
- Navigate into the list of options available in the menu such as "Copy", "Create" and "Copy" links.
Actual Results
The "Copy", "Create" and "Copy" links for the "object schema" menu button in the main content area are marked up using ordered list mark-up instead of unordered list mark-up. They are announced as two different lists to the screen reader users. As result, screen reader users find it difficult to understand the information effectively.
Expected Results
List mark-up enables screen reader users to identify the number of list items. On the basis of the appropriate list mark-up, the screen reader announces the beginning and end of a list. This helps users in interpreting the information effectively.
A sighted user can understand the relationship between the textual information on the basis of its visual presentation, such as indentation. However, a screen reader relies on appropriate mark-up, such as <li>, <ul> and <ol> to interpret related information effectively.
Mark-up the mentioned content using unordered list element in a single <div> element. The list should be of 1 unordered list.
Refer to the following code.
Code snippet:
<div class="aui-dropdown2-section"> <ul> <li><ahref="InsightConfigure.jspa?id=3"class="js-objectschema-action-configure aui-icon-container" tabindex="-1"><spanclass="aui-icon aui-icon-small aui-iconfont-configure"></span> Configure</a> </li> <li><ahref="#"class="js-objectschema-action-copy aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-devtools-checkout"></span> Copy</a></li> <li><aclass="js-objectschema-action-create aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-add"></span> Create</a></li> </ul> </div>
Screenshot
Workaround
Currently, there is no known workaround for this behaviour. A workaround will be added here when available.
Bug Ref: 748625
Bulldog Ref: JSMDC-12811
- is blocked by
-
![[JIRA Server (Bulldog)]](/images/icons/generic_link_16.png "[JIRA Server (Bulldog)]")
JSMDC-12811
You do not have permission to view this issue
| Form Name | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
[JSDSERVER-11517] Business Services/Create Objects : List or list item is not marked up properly.
| Labels | Original: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-prioritised ax-qa-verified ax-windows-chrome ax-windows-firefox | New: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised ax-qa-verified ax-windows-chrome ax-windows-firefox |
| Resolution | New: Fixed [ 1 ] | |
| Status | Original: Needs Triage [ 10030 ] | New: Closed [ 6 ] |
| Labels | Original: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-not-fixed ax-qa-prioritised ax-windows-chrome ax-windows-firefox | New: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-prioritised ax-qa-verified ax-windows-chrome ax-windows-firefox |
| Attachment | New: Screenshot 2022-08-17 at 4.52.44 PM.png [ 425756 ] |
| Labels | Original: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-prioritised ax-windows-chrome ax-windows-firefox | New: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-not-fixed ax-qa-prioritised ax-windows-chrome ax-windows-firefox |
| Attachment | New: Screenshot 2022-08-16 at 1.43.31 PM.png [ 425901 ] |
| Assignee | New: Roman Litvishko [ a504d30b4d3f ] |
| Labels | Original: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-prioritised ax-windows-chrome ax-windows-firefox | New: 1.3.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-bulldog-bl ax-dev-done ax-jsm ax-macos-safari ax-medium-priority ax-platform-dc ax-qa-prioritised ax-windows-chrome ax-windows-firefox |
| Fix Version/s | New: 5.3.0 [ 102400 ] |
| Description |
Original:
h3. Issue Summary
List mark-up is used incorrectly for the Object schema list items, creating confusion for screen reader users as it announces as two different lists. Elements: - Configure - Copy - Create h3. Tested URL [https://instenv-21072-japp.instenv.internal.atlassian.com/secure/ObjectSchema.jspa?id=3&typeId=43&objectId=201] h3. Steps to Reproduce # Launch the URL # In the Insights section, in the main content area, keep the screen reader on navigate to the Object schema menu button. # Navigate into the list of options available in the menu such as "Copy", "Create" and "Copy" links. h3. Actual Results The "Copy", "Create" and "Copy" links for the "object schema" menu button in the main content area are marked up using ordered list mark-up instead of unordered list mark-up. They are announced as two different lists to the screen reader users. As result, screen reader users find it difficult to understand the information effectively. h3. Expected Results List mark-up enables screen reader users to identify the number of list items. On the basis of the appropriate list mark-up, the screen reader announces the beginning and end of a list. This helps users in interpreting the information effectively. A sighted user can understand the relationship between the textual information on the basis of its visual presentation, such as indentation. However, a screen reader relies on appropriate mark-up, such as <li>, <ul> and <ol> to interpret related information effectively. Mark-up the mentioned content using unordered list element in a single <div> element. Code snippet: {code:java} <div class="aui-dropdown2-section"> <ul> <li><ahref="InsightConfigure.jspa?id=3"class="js-objectschema-action-configure aui-icon-container" tabindex="-1"><spanclass="aui-icon aui-icon-small aui-iconfont-configure"></span> Configure</a> </li> <li><ahref="#"class="js-objectschema-action-copy aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-devtools-checkout"></span> Copy</a></li> <li><aclass="js-objectschema-action-create aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-add"></span> Create</a></li> </ul> </div>{code} h3. Screenshot !Screenshot 2022-05-27 at 6.45.44 PM.png|width=437,height=240! h3. Workaround Currently, there is no known workaround for this behaviour. A workaround will be added here when available. Bug Ref: 748625 Bulldog Ref: JSMDC-12811 |
New:
h3. Issue Summary
List mark-up is used incorrectly for the Object schema list items, creating confusion for screen reader users as it announces as two different lists. Elements: - Configure - Copy - Create h3. Tested URL [https://instenv-21072-japp.instenv.internal.atlassian.com/secure/ObjectSchema.jspa?id=3&typeId=43&objectId=201] h3. Steps to Reproduce # Launch the URL # In the Insights section, in the main content area, keep the screen reader on navigate to the Object schema menu button. # Navigate into the list of options available in the menu such as "Copy", "Create" and "Copy" links. h3. Actual Results The "Copy", "Create" and "Copy" links for the "object schema" menu button in the main content area are marked up using ordered list mark-up instead of unordered list mark-up. They are announced as two different lists to the screen reader users. As result, screen reader users find it difficult to understand the information effectively. h3. Expected Results List mark-up enables screen reader users to identify the number of list items. On the basis of the appropriate list mark-up, the screen reader announces the beginning and end of a list. This helps users in interpreting the information effectively. A sighted user can understand the relationship between the textual information on the basis of its visual presentation, such as indentation. However, a screen reader relies on appropriate mark-up, such as <li>, <ul> and <ol> to interpret related information effectively. Mark-up the mentioned content using unordered list element in a single <div> element. The list should be of 1 unordered list. Refer to the following code. Code snippet: {code:java} <div class="aui-dropdown2-section"> <ul> <li><ahref="InsightConfigure.jspa?id=3"class="js-objectschema-action-configure aui-icon-container" tabindex="-1"><spanclass="aui-icon aui-icon-small aui-iconfont-configure"></span> Configure</a> </li> <li><ahref="#"class="js-objectschema-action-copy aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-devtools-checkout"></span> Copy</a></li> <li><aclass="js-objectschema-action-create aui-icon-container"tabindex="-1"><span class="aui-icon aui-icon-small aui-iconfont-add"></span> Create</a></li> </ul> </div>{code} h3. Screenshot !Screenshot 2022-05-27 at 6.45.44 PM.png|width=437,height=240! h3. Workaround Currently, there is no known workaround for this behaviour. A workaround will be added here when available. Bug Ref: 748625 Bulldog Ref: JSMDC-12811 |