Issue View: Unnecessary use of ARIA role and aria-label attribute

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The role="button" and "aria-label" attribute are specified unnecessarily on the <span> element.

      Steps to Reproduce

      1. Open the Jira Cloud instance.
      2. Navigate to the header section and open any project.
      3. Navigate to the main content area and open any issue that has linked work items.
      4. Navigate to the "Linked work items" section in the main content area and inspect the code.
      5. Notice that the role="button" and aria-label attribute are specified unnecessarily on the <span> element.

      Screen Recording

      https://jira.atlassian.com/secure/attachment/495887/Incorrect%20Announcement.mp4

      Actual Results

      When screen reader users navigate through the "Linked work items" section using the "Tab" key or "Arrow" keys, the names of the linked issues are announced as "More information about this work item" instead of the actual issue names such as "HT-2", "Hello World!", "HT-6", "SR Test", etc.

      This issue occurs because the role="button" and "aria-label" attribute are unnecessarily specified on the <span> element that wraps the <a> element containing the issue.

      As a result, screen reader users are presented with inaccurate and misleading information.

      Expected Results

      Ensure that ARIA roles and attributes are not used unnecessarily.

      In this case, the role="button" and aria-label attributes are applied to a <span> element that wraps a linked issue. Since the link (<a>) already provides meaningful information, and the <span> serves no additional semantic purpose, these ARIA attributes are redundant.

      To resolve this issue, remove the role="button" and aria-label attributes from the <span> element in the source code. This will allow screen readers to correctly announce the link text (e.g., “HT-2”, “Hello World!”, etc.), pointing the user to the correct information.

      Code Snippet:

      <span>

      <a>HT-2</a>

      </span>

      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
      Operations - Windows11
      Chrome - Version 135.0.7049.42 (Official Build) (64-bit)
      Safari- Version 18.0
      Firefox- Version 135.0 (64-bit)
      JAWS- Version 2023
      NVDA- Version 2024.4.2
      VoiceOver - Version Latest

        1. Linked work items fixed.mp4
          35.85 MB
        2. Linked work items.mp4
          42.22 MB
        3. Incorrect Announcement.mp4
          31.38 MB
        4. image-2025-04-15-09-15-27-172.png
          image-2025-04-15-09-15-27-172.png
          302 kB
        5. image-2025-04-14-10-56-08-384.png
          image-2025-04-14-10-56-08-384.png
          65 kB
        6. image-2025-04-14-10-46-32-983.png
          image-2025-04-14-10-46-32-983.png
          29 kB
        7. image-2025-04-14-10-37-51-940.png
          image-2025-04-14-10-37-51-940.png
          789 kB

            Assignee:
            Alvin Cherk
            Reporter:
            Chirag Goyal
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

              Created:
              Updated:
              Resolved: