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

Asset View : Button in the comment section does not have a label and has missing keyboard support.

XMLWordPrintable

      Issue Summary

      The button is missing an accessible name/label. As a result its functionality or purpose is not conveyed to screen reader users.

      Elements name:

      • Bold, Italic, Underlined, Highlight, Bullet list, Numbered list, Link, Insert code block,
      • Permissions menu button i.e. 'Lock icon" menu button.

      Location of the elements: Buttons, in the "Rich text editor", in the "Comments" tab section content, in the main content.

      Steps to Reproduce

      1. In the header section for JSM, navigate to the Insights link and activate any project inside it such as ABC.
      2. Navigate to the Object types such as business service, Hardware, etc, and further select the further objects such as Servers in hardware.
      3. In the main content area for the available objects activate the Name of the object such as " exchange.prod.app1", etc.
      4. In the Assets page navigate to the Assets tab and activate the comments tab.
      5. In the Comment section navigate to the toolbar section and to the restrictions button keeping the screen reader on.

      Actual Results

      The buttons and the elements in the comment section toolbar have missing labels and keyboard/screen reader support. The buttons in the toolbar sections of the comments and the restrictions buttons have been provided with a tabindex="-1" which makes it difficult for the keyboard and screen reader users to access the button. Additionally, they have labels provided to them which makes the screen reader users unaware of the functionality associated with it.

      Expected Results

      Ensure the button receives keyboard and screen reader focus and the buttons are announced appropriately to the screen reader users.

      Remove the tabindex="-1" to ensure the keyboard and screen reader receives focus.

      Provide an aria-label to the <button> element such as aria-label="Bold", aria-label="Restrictions", etc.

      Ensure the other button type elements are coded into an <button> element and have a value of aria-expanded which have a menu popup etc.

       

      Screenshot

       

      Workaround

      No workaround is available.

      Bug Ref: 746929

      Bulldog Ref:

              Unassigned Unassigned
              12b69dcabe29 Matthew Brennan
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Created:
                Updated: