Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-38368

Ensure all active elements receive keyboard focus

    XMLWordPrintable

    Details

    • 12 status:
      Resolved
    • Previous Issue Keys:
      A11YTEST-269

      Description

      [New] - 3/16/2018

      [Issue and User Impact]

      Delete button is not keyboard accessible. When a user adds a message through the text area field, there is a delete button associated to the comment. This delete button does not receive keyboard focus. This delete button does not announce as a button. This element lack proper role.Hence, screen readers and keyboard users not able to access this button.

      [Code]

      <span class="chatRemove fa fa-trash" data-message-id="ef7df697-5d3f-4f8e-8afa-a7956ea4c3f2" aria-label="Delete this message"></span>

      [Expected behavior]Developers should ensure all links and buttons are keyboard accessible and announces the right role of the element.Consider using actual button or anchor tag instead of span.Ensure "Delete this message" announces as link or button.If developers want to use button then they can add tabindex="0" which helps to receive keyboard focus. If developers want to implement as a link, they have to use "href" which helps to receive keyboard focus.

        Gliffy Diagrams

          Attachments

            Activity

              People

              • Assignee:
                jtingen Jolie Tingen
                Reporter:
                jonespm Matthew Jones
              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Git Source Code