Uploaded image for project: 'Jira Service Management Data Center'
  1. Jira Service Management Data Center
  2. JSDSERVER-12086

Add comment to issue : Non-modal dialog inaccessible for screen reader and keyboard only user

      Issue Summary

      The element uses device-dependent event handlers and is therefore not accessible by keyboard alone.

      Element name:

      • "Admin Admin" popup content with "Activity" link and "More" menu button.

      Location of the element: Popup, on each "Admin Admin" link, in the "All" tab section, in the "Activity" heading section, in the main content.

      Additional details: While hovering on any "Admin Admin" link, display "Admin Admin" popup content. But this content is not available to keyboard users.

      Note: The same issue applies to all user links (Admin Admin) links.

      Steps to Reproduce

      1. Open the JSM homepage.
      2. Navigate to the "Project" link in the header and activate it.
      3. Select any project link and activate it.
      4. Navigate to the main content and activate the present issue links
      5. Navigate to the "All" tab and activate it.
      6. navigate to the "admin admin" link and hover over it
      7. Observe that the non-modal dialog is not accessible to users 

      Actual Results

      The modal dialog becomes available when the user hovers over the "admin admin" link present after the page by having keyboard support.

      However, in order to make the modal dialog available mouse hover is the only option with no alternative method for the keyboard only user provided. hence modal dialog is not available for keyboard-only users.

      Expected Results

      An alternate method should be provided for the keyboard-only user in order to make modal dialog available.

      Additionally, the focus should move to the non-modal dialog when it is activated so that keyboard-only users won't have to tab repeatedly to access content available inside the modal. This would also help screen reader users to navigate properly. 

      Alternatively,

      1. Provide an "i" image button beside of "admin admin" link using the native <button> element.
      2. Provide a descriptive label as "Show user information" for the button.
      3. Provide "aria-haspopup" attribute with the value "dialog".
      4. Ensure that the focus should move to the non-modal dialog when it is activated so that keyboard-only users won't have to tab repeatedly to access content available inside the modal. This would also help screen reader users to navigate properly. 

      Screenshot

      Workaround

      Not Available

      Bug Ref: 746057

      Bulldog Ref:

          Form Name

            [JSDSERVER-12086] Add comment to issue : Non-modal dialog inaccessible for screen reader and keyboard only user

            Zac Xu made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 997740 ]
            Sylwia Mikołajczuk made changes -
            Remote Link Original: This issue links to "A11Y-267 (Bulldog)" [ 931345 ] New: This issue links to "A11Y-267 (JIRA Server (Bulldog))" [ 931345 ]
            Marc Dacanay made changes -
            Labels Original: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-jsmdc-agentissueview ax-kb-user ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team New: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-jsmdc-agentissueview ax-kb-user ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team ril
            Marc Dacanay made changes -
            Remote Link New: This issue links to "Internal ticket (Web Link)" [ 955676 ]
            Bilal Cinarli made changes -
            Remote Link New: This issue links to "A11Y-267 (Bulldog)" [ 931345 ]
            Sylwia Mikołajczuk made changes -
            Labels Original: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team New: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-jsmdc-agentissueview ax-kb-user ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team
            Divyanshi made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 912007 ]
            Matthew Brennan made changes -
            Labels Original: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team New: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-medium-priority ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team
            Matthew Brennan made changes -
            Labels Original: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-platform-dc ax-qa-prioritised may-need-design-team New: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-platform-dc ax-qa ax-qa-prioritised may-need-design-team
            Oleksandr Stoliar made changes -
            Labels Original: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-high-priority ax-jsm ax-kb-user ax-platform-dc ax-qa-prioritised ax-vpat-critical may-need-design-team New: 2.1.1 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-dev-ready ax-jsm ax-kb-user ax-platform-dc ax-qa-prioritised may-need-design-team

              Unassigned Unassigned
              12b69dcabe29 Matthew Brennan
              Affected customers:
              0 This affects my team
              Watchers:
              3 Start watching this issue

                Created:
                Updated: