a11y: Add missing aria labels on connection config component

[fridgepoet]

Accessibility improvement: tracked on grafana/grafana#41206

Closes grafana/grafana#42706

Hey @sarahzinger here's a go at adding aria-labels (indirectly?) for CloudWatch. Not sure at all if that's correct. Let me know what you think.

[yaelleC]

lgtm 👍

Just checking before approving: any reason why Fastpass is complaining about the select elems but not the inputs (Credential Profile Name for instance)? Or maybe they were not visible when you ran it?

[fridgepoet]

Thanks @yaelleC you're right, the voiceover is not reading the titles of those other inputs.
I think FastPass is passing them because they have placeholder attributes...
What do you recommend? Should I just add more aria-labels?

[yaelleC]

Thanks @yaelleC you're right, the voiceover is not reading the titles of those other inputs. I think FastPass is passing them because they have placeholder attributes... What do you recommend? Should I just add more aria-labels?

Indeed! Turns out support of placeholders for screen readers is not consistent :( (see: https://www.davidmacd.com/blog/is-placeholder-accessible-label.html) So aria labels could be a good quick-fix solution and we can look into a better one is the issue you raise. 👍

[sunker]

I believe this PR needs to be moved to the new frontend repo for aws - https://github.com/grafana/grafana-aws-sdk-react/.

[fridgepoet]

Thanks
These aria-labels are already present in the new repo, closing!