[a11y] - Document best practice for use of aria-current with RouterLink / RouterLinkActive

🚀 feature request

Relevant Package

This feature request is for @angular/router

Description

RouterLinkActive adds a class to the element, it should add the aria-current attribute which must be set to 'Page' when isActive is true in the RouterLinkActive.

Describe alternatives you’ve considered

<a #fruitsLink="routerLinkActive" routerLinkActive="active" #fruitsRouterLink="routerLinkActive" [attr.aria-current]="fruitsRouterLink.isActive ? 'Page': undefined"  title="fruits" routerLink="/fruits" >Fruits 🍓</a>

[atscott]

@jelbourn, @twerske, and I discussed this change and agreed that based on discussions above about how setting aria-current="page" is not the correct thing for all cases, we don’t want to bake this behavior in to the RouterLinkActive. I’ve updated the issue to indicate that this should be addressed through a11y best practices documentation.

[jeripeierSBB]

I’m too thinking, it’s better to let a developer decide when to set aria-current. E.g. for breadcrumbs usage, it’s more recommended to use aria-current=“location” than aria-current=“page” (https://www.aditus.io/patterns/breadcrumbs/). As another idea, we could add possibilities to configure the attribute in routerLinkActiveOptions. Also I think the label should only be set if the exact match option is set to true. Otherwise, again for example in breadcrumbs usage, you would have more than one link set with aria-current.