Confluence editor: Invite people element is not accessible for Keyboard & screen reader users.

Issue Summary

In Confluence editor, the 'Invite people to edit with you ' element is not accessible for Keyboard & screen reader users.

Also the "Invite people to edit" popup which appears when user click on the 'Invite people to edit with you ' element is not accessible.

Issue id: 725391

Steps to Reproduce

1. Navigate to the Confluence Homepage.
2. Navigate to the "Create" button inside header section & activate it.
3. Navigate inside the Confluence editor.
4. Navigate to the 'Invite people to edit with you ' element.

Actual Results

While navigating with Keyboard inside confluence editor, the 'Invite people to edit with you ' element does not receive keyboard focus. Also it doesn’t have an accessible label in the code.

Also the "Invite people to edit" popup which appears when user click on the 'Invite people to edit with you ' element is coded at the end of the page incorrectly.

This makes Keyboard & screen reader users difficult to access the functionality associated with the element.

Expected Results

The 'Invite people to edit with you ' element should be accessible with Keyboard & screen reader. Apply following fixes.

1. Mark the element as HTML <button> element.
2. Provide an accessible label as "Invite people to edit with you" to the button element via aria-label attribute.
3. Provide the aria-expanded="false" attribute to the button element to convey the current state to screen reader users.
4. Toggle the value of aria-expanded between true or false as per user interaction.
5. Provide aria-haspopup="true" to the button element.
6. The code of the "Invite people to edit" popup should be present right after the code of button element.

Screenshot

Workaround

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