Issue Summary

On "Pages" page the "Labels" modal dialog which becomes available when user activates "Edit labels" link is inaccessible for screen reader users due to missing roles and attributes.

Steps to Reproduce

1. Navigate to "Spaces" button present in main content area and activate it.
2. Activate any space from list of links which appears on activating "Spaces" button.
3. Navigate to "Pages" link present in left navigation menu and activate it.
4. Navigate to "Edit labels" link present in main content area and activate it. Observe "Labels" modal dialog gets added on page but not rendered by screen reader.

Actual Results

When user activates "Edit labels" link, the "Labels" modal dialog gets added on a page which is not render by screen reader users. In addition the focus does not trap within the modal dialog i.e it reads background invisible content. As a result this modal dialog is inaccessible for screen reader users.

Expected Results

The "Labels" modal dialog should be coded with role="dialog" which will inform screen reader users that a "Labels" dialog is being inserted on a page and set aria-modal="true" which will hide background content from screen reader users. Gives the dialog an accessible name by referring to the element that provides the dialog title i.e "Labels". 

Screenshot

Workaround

workaround

Bug Ref: 722711