Simple Payments: Fix accessibility by adding appropriate WAI-ARIA tags

[aldavigdis]

Simple Payments has a rather nonsemantic markup. This can be mitigated accessibility-wise by using the appropriate WAI-ARIA tags. This should be an easy fix.

See more at https://www.w3.org/WAI/PF/aria/states_and_properties#aria-labelledby

This issue is hereby split from https://github.com/Automattic/wp-calypso/issues/28781, as that ticket is already out of scope of this one and other things may depend on the current markup style.

[sirreal]

I think we should transfer this to https://github.com/Automattic/jetpack as that's where the HTML output produced is.

[aldavigdis]

@sirreal Maybe. I just assumed this one to be the correct repo as the other ticket was filed here too.

[simison]

Transferred 👍

Output HTML is somewhere here:

• https://github.com/Automattic/jetpack/blob/master/modules/widgets/simple-payments.php
• https://github.com/Automattic/jetpack/blob/master/modules/simple-payments/simple-payments.php

[emilyatmobtown]

Hi @simison - Is it possible to simulate a paid plan in a Jetpack dev environment? It appears that that's the only way to patch and test this.