Issue view: Accessible name does not match with visual label

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The accessible name “Add or create work related to this task” does not match the visible  label.

      Note: This issue has been raised as Low priority, as it does not have a significant impact on screen reader users.

      Steps to Reproduce

      1. Open the Jira Cloud homepage.
      2. Select any project from the side navigation panel and open an issue.
      3. Within the issue detail view, locate the "+" button and hover over it to see the label.
      4. Use a screen reader to navigate to the button and listen to the corresponding announcement.
      5. Observe that the screen reader announcement does not match the visible tooltip label.
      6. Inspect the code and note that the inner text used as the accessible name is inconsistent with the visible label.

      Screenshot

      Actual Results

      The visible label “Add or create related work” (shown on mouse hover) does not match the button’s accessible name “Add or create work related to this Task”, which is exposed to assistive technologies via the inner text of a <span> inside the button. Because the accessible name is derived from this inner <span> rather than from the label shown on hover, the name announced by screen readers is inconsistent with the visible text shown to sighted users.

      This will make it confusing for speech recognition and text‑to‑speech users when interacting with the button. Also, screen reader users may not clearly understand the purpose of this element.

      Expected Results

      Ensure that the accessible names match the visible labels of interactive elements such as buttons and links.

      In this scenario, update the inner text used as the accessible name so that it matches the visible label “Add or create related work”. This ensures the name announced by assistive technologies is consistent with the visible label shown to users and aligns with the expected behavior for accessible interactive elements.

      Code Snippet:

      <button type="button" ...>
      (...)
      <span class="...">Add or create related work</span> 
      (...)
      </button>

      Note: This code example is intended only as a general illustration of how to address the violation and should not be considered a complete or production-ready solution. If you have any questions, please attach this ticket to a #help-accessibility request.

      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 26.3.1
      Windows - 11 pro
      Chrome - Version 146.0.7680.165 (Official Build) (arm64)
      Safari - Version 26.3.1 (21623.2.7.111.2)
      JAWS - Version 2025
      NVDA - Version 2024.4.2.35031
      Voiceover - Version Latest

              Assignee:
              Unassigned
              Reporter:
              Anusooya .
              Votes:
              0 Vote for this issue
              Watchers:
              2 Start watching this issue

                Created:
                Updated: