🐛 Bug Report

We want to be able to provide the describe tool tip on the description of the child component regardless of whether the tool tip is visible.

Since aria-describedby references another element in the DOM, this’ll only work when the tool tip is visible. And that is, only visible when the child component is focused.

But… screen readers can access things on the page without actually focusing them. So, the describe tool tip doesn’t always work for screen reader users. Only sometimes, when the child component is focused.

Expected Behavior

Voiceover can describe the element regardless if the tooltip is open or not.

To Reproduce

Steps to reproduce the behavior:
With VoiceOver / MacOS:
Launch VoiceOver, open Safari
Canvas Design Site: Tooltip popups > Describing an element
Reading commands: Ctrl + Opt + Right
Issue: observe tool tip text on Delete button is not described
Press Tab to focus “Show Code”
Read backward: Ctrl + Opt + Left Arrow
Issue: observe tool tip text on Delete button is not described
Set Rotor to “Form Fields”: Ctrl + Opt + Cmd + Right Arrow
Jump buttons on the page: Ctrl + Opt + Cmd + UP / DOWN arrow
Issue: observe tool tip text on Delete button is not described
With NVDA on Windows 11:
Launch NVDA, open Chrome
Canvas site => Tooltips => Describing an element
In virtual mode, use quick key ‘b’ to jump to the Delete Button
Issue: observe the tool tip text is not described

Expected Behavior

A clear and concise description of what you expected to happen.
Screen readers should be able to automatically describe the Tool tip description while reading elements without keyboard focus.