Uploaded image for project: 'Jira Data Center'
  1. Jira Data Center
  2. JRASERVER-78437

Header: Interactive element has incorrect role

XMLWordPrintable

      Issue Summary

      The "Close" interactive element has incorrect role as link instead of a button.

      Steps to Reproduce

      1. Open the "Home" page.
      2. Navigate to the header section > "Help" button > "Keyboard shortcuts" menu item > a modal appears.
      3. Navigate to the mentioned instance and inspect it's code.
      4. Observe that the element has an incorrect interactive role.

      Screenshot

      Actual Result

      The "Close" interactive element is incorrectly defined as a link instead of a button. As a result, screen reader users may confuse of mislead the functionality associated with the mentioned element. 

      Expected Result

      Interactive element should have an appropriate and correct interactive role. In the scenario, it would be semantically correct to code the mentioned interactive element  as button. This can be achieve by replacing the <a> element with <button> element. If it  is not feasible, specify role="button" attribute on the < href="..."> element.

      Code Snippet

      <button ...>Close</button> 

      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 SEQUOIA 15.2
      Chrome - Version 132.0.6834.84 (Official Build) (64-bit)
      Firefox- Version 128.6.0esr (64-bit)
      Safari- Version - 18.2 (206220.1.16.11.8)
      JAWS- Version 2023
      NVDA- Version 2023.2
      Voiceover - Version Latest

              spanchenko@atlassian.com Serhii Panchenko
              71c7b0ef4382 Malleswara Rao Konthala
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Created:
                Updated:
                Resolved: