I wonder if the title attribute is enough or if there is any particular reason you still need a tooltip.

Great question, @miukimiu. From my perspective, I believe using an EuiToolTip would be preferable from a consistency and discoverability standpoint. In Lens, most disabled buttons (excluding those in EuiButtonGroup) and inputs utilize EuiToolTip to explain why that element is disabled and how it can be re-enabled. EuiToolTip also allows us to choose between long and short hover delays. Using native browser tooltips via the title attribute on some elements in Lens would introduce a level of inconsistency into the experience. It also doesn't allow us any control over the delay of the tooltip appearing (in which case, they always show after a fairly lengthy delay).

Another great comment came in a previous Slack conversation between @andrewctate and @1Copenut. In it, @1Copenut mentioned the following:

I'd prefer not to add tooltips to disabled buttons. We use the HTML disabled attribute, so the button won't take keyboard focus. This prevents users who navigate by keyboard and use screen readers from accessing the tooltip information.

This is an excellent point, and one that actually extends beyond this request for tooltips on EuiButtonGroup buttons (as this applies to any disabled EuiButtons using a tooltip). When a button element uses the disabled attribute, the tooltips can't be triggered via keyboard focus, as focus is prevented in a disabled state (though hover is still supported, hence why hovering with the mouse still triggers the tooltip). In reading up on the issue, I found a CSS Tricks article that attempts to remedy this issue by switching out the disabled attribute for aria-disabled.

Any thoughts on such an approach (in addition to the core question of whether we are able and willing to add tooltip support for EuiButtonGroup buttons)?

[EuiButtonGroup] add tooltip support #6313

Description

Metadata

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Issue actions