Edit a Page - Restrictions Modal : aria-hidden="true" is used incorrectly

XMLWordPrintable

    • Severity 3 - Minor

      Issue Summary

      aria-hidden="true" is used on informative content making it inaccessible to assistive technology.
      Element:
      1) "Restriction" Dialog

      Location:
      Dialog which appears after activating the "restriction" button.

      Steps to Reproduce

      1. Navigate to "Spaces" button present in header region and activate it
      2. Navigate to any "Space link" from the list of links which becomes available when user activates "Spaces" button.
      3. Navigate to "More options" link present in main content area and activate it.
      4. Navigate to "Restrictions" link and activate it.

      Actual Results

      The "aria-hidden" attribute is provided to the "Restriction", which becomes available on selecting the "More options". As a result, screen reader users cannot access the modal effectively.

      Expected Results

      Remove aria-hidden=”true” from the <div> element in the page source for the modal.

      The aria-hidden="true" attribute is used to hide the content from assistive technology users. Although it is a best practice to use the aria-hidden="true" attribute to hide irrelevant content for screen reader users, it can pose issues for screen reader users if it is not used correctly. 
      Additionally, ensure the focus does not move out of the modal in the background content unless the modal is closed.

      Screenshot

      Workaround

      Currently, there is no known workaround for this behaviour. A workaround will be added here when available

      Bug Ref: 725277

            Assignee:
            Oleksandr Mazepa
            Reporter:
            Matthew Brennan
            Votes:
            1 Vote for this issue
            Watchers:
            7 Start watching this issue

              Created:
              Updated:
              Resolved: