Issue Summary

The tooltip on "user icon" image link which becomes available when user activates "Saved for later" link (which becomes available when user activates "Profile picture for <username>" link in header region) is inaccessible for screen reader users due to missing roles/attributes.

Steps to Reproduce

1. Turn on screen reader, navigate to "Profile picture for <username>" link in header region and activate it.
2. Navigate to "Saved for Later" link and activate it.
3. Navigate to "Profile" link present in main content area and activate it.
4. Navigate to "User icon" image link present in main content area. Observe that tooltip is not available.

Actual Behaviour

When users hovers with mouse on "User icon" image link the tooltip content is available. However for screen reader users when they navigate to "User icon" image link with Tab key the tooltip content is not available/read by screen reader i.e the tooltip content is inaccessible for them. 

Expected Behaviour 

The tooltip which appears on mouse hovers on "User icon" image link should also be available for screen reader users. For this the element that serves as the tooltip container should have role="tooltip". The element that triggers the tooltip references the tooltip element with aria-described by. In addition the content of tooltip should be read by screen reader.

Screenshot

Workaround

workaround

Bug Ref: 726215