Carbon: Notifications close button: aria-label should be on button, not on svg child

[carmacleod]

Notifications have a close button that has an svg child for the little x icon.

Currently, the svg child has the aria-label="close", but the aria-label needs to be on the interactive element - i.e. the button - in order to work in all screen readers.

[joshblack]

Thanks for the report @carmacleod! Added a PR to move it over.

Just curious, why does DAP report this as a form control when in this context? I believe the original implementation placed the aria-label on svg so that it would be read as the content when button was focused on by a screenreader.

[carbon-bot]

:tada: This issue has been resolved in version 9.32.1 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[carmacleod]

@joshblack

Just curious, why does DAP report this as a form control when in this context?

Agreed that it's a bit odd. I suspect the DAP may just be using a standard rule here that checks all form controls following the Name And Description Computation algorithm.

I believe the original implementation placed the aria-label on svg so that it would be read as the content when button was focused on by a screenreader.

Yes, and I think that would usually work, because the way I read the current name computation algorithm, the aria-label on the svg would "bubble up" to the button. However I believe this wasn't always the case, and the DAP is being conservative in requiring the aria-label to be on the interactive element so that it will work in all screen readers.