emberjs / rfcs

RFCs for changes to Ember
https://rfcs.emberjs.com/
791 stars 406 forks source link

Pre-RFC: Add `aria-current` attribute to Ember's `LinkTo` component #974

Open awesomerobot opened 1 year ago

awesomerobot commented 1 year ago

The LinkTo component lacks native support for the aria-current attribute.

From: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current

When you have a group of related elements, such as several links in a breadcrumb or steps in a multi-step flow, with one element in the group styled differently from the others to indicate to the sighted user that this is the current element within its group, the aria-current should be used to inform the assistive technology user what has been indicated via styling.

It seems that anytime LinkTo produces class="active" it should also append aria-current="true"

aria-current="true" is a minimum implementation though, ideally the other aria-current values (page, step, location, etc) should be supported. Perhaps with an additional attribute like so:

<LinkTo @route="home" aria-current="page">Home</LinkTo>

which would render as

<a href="/home" aria-current="page" class="active">Home</a>

This would be my first RFC for Ember, so any feedback would be appreciated.

NullVoxPopuli commented 1 year ago

seems like a good idea! question though -- why doesn't the browser do this for us, based on matching href? (same is it would for the :active CSS psuedo attribute? :sweat_smile: