Add auto-tooltip support for Button and Badge#11747
Conversation
|
@copilot Update https://github.com/vaadin/web-components/blob/main/packages/badge/test/dom/__snapshots__/badge.test.snap.js reference DOM snapshots include newly added tooltip slot. |
web-padawan
left a comment
There was a problem hiding this comment.
IMO, this needs to be split into separate PRs. For example, I would suggest adding tooltip slot with TooltipController and has-tooltip attribute to badge first. Then this PR would be purely about auto tooltip feature.
Updated the badge DOM snapshots to include the new tooltip slot in caf0654. No screenshot included because this is a reference snapshot update only, with no UI rendering change. Warning Firewall rules blocked me from connecting to one or more addresses (expand for details)I tried to connect to the following addresses, but was blocked by firewall rules:
If you need me to access, download, or install something from one of these locations, you can either:
|
|
@copilot The ariaTarget property of the vaadin-tooltip needs to be set to null, so that vaadin-button and vaadin-badge wont get aria-describedby attribute set. The tests should verify than auto-tooltip attribute is used, aria-describedby is not set. |
|
Set the generated auto-tooltip Warning Firewall rules blocked me from connecting to one or more addresses (expand for details)I tried to connect to the following addresses, but was blocked by firewall rules:
If you need me to access, download, or install something from one of these locations, you can either:
|
Our history about this is not very consistent. As this is sponsored feature linked to one ticket and as combined quite small, I would keep it under one PR. |
Let me discuss this with the team next week. I will also try to polish logic a bit, in order to make it possible to manage it with |




Adds web component support for
auto-tooltiponvaadin-buttonandvaadin-badge, allowing icon-only/compact usages to keep text available to assistive tech and expose it as a tooltip.Fixes #11484
Button
autoTooltip/auto-tooltip.sr-onlyto the label wrapper when enabled.vaadin-tooltipfrom the button label text unless a custom tooltip is provided.ariaTargettonullsoaria-describedbyis not added.Badge
autoTooltip/auto-tooltip.TooltipControllerand atooltipslot.sr-onlyto the content wrapper when enabled.vaadin-tooltipfrom badge text content unless a custom tooltip is provided.ariaTargettonullsoaria-describedbyis not added.Types and tests
autoTooltip.sr-onlyclass application for both components.auto-tooltipdoes not setaria-describedby.