Prevent tooltip content from being read by JAWS

[edcourtney74]

Summary

We have a common use case where we rows of records, and each row has a view button that is just an icon. To give the user more info on which record they are viewing, we've added aria labels that say "View Item 1", "View Item 2", etc. Also because the button is just an icon, we've added a NgbTooltip on each that just says "View". <button ngbTooltip="View" aria-label="View Item 1"> <i class="fas fa-eye" ></i> </button>

When an aria-label and a ngbTooltip are on the button, and they contain different text text, JAWS reads "View Item 1 button. View. To activate press enter." Is there a way to keep JAWS from reading View a second time? We don't want to make the tooltip text the same as the aria-label because it could get too long.

Example

Stackblitz: https://github-ejyjgu-13lmbq.stackblitz.io

Additional Information

JAWS version and build number

2023.2212.23 and 2024.2312.53

Operating System and version

Windows 10

Browser and version:

Chrome 122.0.6261.129

[JAWS-test]

The simplest solution is to remove the aria-describedby from the button

[edcourtney74]

The simplest solution is to remove the aria-describedby from the button

Do you mean the aria-label? There is no aria-describedby, unless I'm confused. We wanted the aria-label to give a more robust explanation for JAWS users while the tooltip would provide a short, visual description.

[JAWS-test]

@edcourtney74 In your example, there is a dynamically inserted aria-describedby, which refers to the tooltip. You can see this in the source code when the tooltip is visible

[edcourtney74]

Thank you. That is what I was missing.