Issue Summary

The tooltip content that becomes available when user hovers on the toolbar options.

Steps to Reproduce

1. Navigate to "Create" button present in header section.
2. After activating "Create" blank page template will appear on the screen.
3. Navigate to the toolbar options.
4. Using mouse or keyboard check that tooltip is coming but not accessible for screen reader users.

Screenshot

Actual Results

The tooltip content such as "Bold", "Italic", "Underline", and so on. is not being announced. When these elements receives focus the aria-describedby attribute gets added on the <li> elements inappropriately, due to this tooltip content is not available for the users. As a result, screen reader users might miss the important information

Expected Results

Remove the "aria-describedby" attribute from the <li> element and add it to the <a> element of the "Bold", "Italic", "Underline", and so on.

Code Snippet

<li class="toolbar-item aui-button aui-button-subtle" id="rte-button-bold" resolved="" original-title="">
    <a aria-describedby="tipsyuid10" class="toolbar-trigger" href="#" data-control-id="bold">
                          <span class="icon aui-icon aui-icon-small aui-iconfont-editor-bold ">Bold</span>
    </a>
</li>

Workaround

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

Environment

MacBook Pro (16-inch, 2019)
macOS Ventura Version 13.3.1
Chrome - Version 114.0.5735.198 (Official Build) (x86_64)
Firefox- Version 112.0.1 (64-bit)
Safari- Version 16.4 (18615.1.26.11.23)
JAWS- Version 2022
NVDA- Version 2020.3
Voiceover - Version Latest