View Issue: Inaccurate reading order

Issue Summary

The content associated with the "Attachments Options" buttons do not have an appropriate reading order.

Steps to Reproduce

1. Open the “View Issue“ page.
2. Navigate to the main content.
3. Navigate to the "Attachments" accordion present in the main content area and activate it.
4. Using screen reader, navigate to the mentioned button and activate it.
5. Arrow down on the expandable content from the buttons.
6. Observe that the content is getting update at the end of the page for screen reader users.

Screenshot

Actual Results

When users navigate onto the mentioned button and activate it, the updated content of this button is available at the end of the page for screen reader users. This is because this content is not coded directly after the accordions in the DOM. It is instead coded at the end of the page. This inappropriate reading order might disorient the users of screen readers. That the content is available at the end might confuse or mislead them.

Expected Results

Content must have an appropriate reading order. Assistive technologies navigate content using the order in which elements appear in the DOM. Hence, make sure that the content is programmatically ordered in such a way that it provides an appropriate reading order to the users of assistive technologies.

Make sure that the content that gets available on expanding the button is coded directly after the expandable button in the DOM. This will create an appropriate reading order for the users of assistive technologies. For instance, this will enable them to arrow down onto the expanded content when the button is expanded.

Code Snippet

<button class="aui-button aui-button-compact aui-button-subtle js-default-dropdown active" title="Options" aria-label="Attachments Options" resolved="" id="AJS_DROPDOWN__170" aria-controls="AJS_DROPDOWN__170_drop" aria-haspopup="true" aria-expanded="true"><span class="aui-icon aui-icon-small aui-iconfont-more">Options</span></button>
<div class="aui-dropdown-content aui-list" tabindex="-1" style="display: block; outline: 0px;">
<ul role="menu">
<li role="presentation">
<ul role="group" aria-label="Attachments Sorting Options" id="attachment-sorting-options" class="aui-list-section aui-first">
<li role="presentation" class="aui-list-item active" id="AJS_DROPDOWN_LISTITEM__197">
<a aria-checked="true" role="menuitemradio" id="attachment-sort-key-name" href="/browse/SC-5?attachmentSortBy=fileName#attachmentmodule" class="aui-list-checked aui-checked aui-list-item-link" title="viewissue.subtasks.tab.show.all.name" tabindex="0"><span>Sort By Name</span></a>
</li>
</li>
</ul>
(...)
</ul>
</div> 

Workaround

Not Available.

Environment

MacBook Pro (14-inch, 2021)
macOs Sonoma 14.2.1
Chrome - Version 121.0.6167.85 (Official Build) (arm64)
Firefox- Version 92.0 (64-bit)
Safari- Version 17.2.1 (19617.1.17.11.12)
JAWS- Version 2022
NVDA- Version 2021.2
Voiceover - Version Latest