relative-time-element
relative-time-element copied to clipboard
Attribute to control which attribute is set for `title`
Currently the element always sets the title attribute, but to implement a custom tooltip solution, it would be nice for it to set a different HTML attribute. How about a property titleAttribute="title", that could for example be set to aria-label?
We explored aria-label in https://github.com/github/relative-time-element/pull/243 but it’s not the correct behaviour for this element, as it isn’t a focusable or otherwise interactive element. title isn’t necessarily correct either but right now it seems to be the least worst way of handling this.
I’m hesitant to introduce an attribute to customise this for two reasons:
- The element should always just do the correct thing. If title is wrong we should fix it to be correct.
- We should prevent users from doing the accidentally incorrect thing. Being able to set the attribute to something like
aria-labelwhich seems to be worse for accessibility (based on our testing) should not be possible.
One particular use of non-title tooltips is that they can allow the interactive selection of the value, which I find useful for referencing a date. Hover the time element, move mouse into tooltip, select and copy. Such interaction is not possible with title.
Currently I've implemented this via a one-time attribute value swap at page load and a MutationObserver to catch newly added elements, but it feels suboptimal.