feat(a11y): add aria-labels to various buttons

[xyhhx]

Affects #472

[peterthomassen]

This is good stuff, thanks!

Overall, I was wondering whether it's possible to reduce the duplication, by somehow telling it that aria-label should have the same value as the element's inner text node. Is that possible? And if so, does it make sense to do it?

[xyhhx]

Overall, I was wondering whether it's possible to reduce the duplication, by somehow telling it that aria-label should have the same value as the element's inner text node. Is that possible? And if so, does it make sense to do it?

Good idea. I'm not sure if it's possible, I can look around; but I do think that at least for some places it does make sense!

[xyhhx]

This is good stuff, thanks!

Overall, I was wondering whether it's possible to reduce the duplication, by somehow telling it that aria-label should have the same value as the element's inner text node. Is that possible? And if so, does it make sense to do it?

Looking more into this, I'm not even sure every button needs aria-label.

According to MDN aria-label is for when the accessible name isn't available or is inaccurate:

Sometimes the default accessible name of an element is missing, or does not accurately describe its contents, and there is no content visible in the DOM that can be associated with the object to give it meaning.

According to the W3C, the accessible name can be automatically derived from the visible text of a button/link/etc:

The value of the accessible name may be derived from a visible (e.g., the visible text on a button) or invisible (e.g., the text alternative that describes an icon) property of the user interface element

So maybe I should review this PR and actually remove any occurrences where the aria-label I've provided is the exact match of the elements' values

[peterthomassen]

So maybe I should review this PR and actually remove any occurrences where the aria-label I've provided is the exact match of the elements' values

Yes, I think so!