@vaughnwalters: Hi, please set code project tags so other people who don't know or don't care about team tags can also find this task when searching via projects and not only via a person. Thanks a lot!

On Special:EventDetails, there is no accessible text for checkboxes in participants tab. Anyone using a screen reader would not know what checkbox they were selecting, so it needs aria-label for checkbox inputs.

I think this could be resolved by adding aria-labelledby, pointing to the cell with the username. But it should probably wait until T318165 is done, so that we'll work directly on the final version of the code.

On Special:EditEventRegistration and Special:EnableEventRegistration the clear buttons in the start time and end time fields need aria-label="clear start time" and aria-label="clear end time" to them so screen readers can let the viewer know what the button does.

This is a core widget and we can't modify it in the extension, but I've filed T338791.

On Special:MyEvents, the ellipses needs an accessible label, something like aria-label="more options for {event name}" as right now there is no label to let screen readers know what this is

The button already has a label reading "Manage event" in the no-JS version. Apparently, that label is lost when replacing the widget. It should be pretty simple to bring it back.

The color contrast between the gray background ( hex #F8F9FA) and the red text (hex #DD3333) in the participants tab is currently 4.33 and needs to be increased slightly to 4.5:1 to fit into WCAG 2.1 AA standards (which is what the foundation aspires to reach). It is only with the gray background that this text color is an issue.

We're changing the background color to white in T318165, so that should hopefully fix this issue.

Quick update with the status quo:

On Special:EventDetails, there is no accessible text for checkboxes in participants tab. Anyone using a screen reader would not know what checkbox they were selecting, so it needs aria-label for checkbox inputs.

I will fix this.

On Special:EditEventRegistration and Special:EnableEventRegistration the clear buttons in the start time and end time fields need aria-label="clear start time" and aria-label="clear end time" to them so screen readers can let the viewer know what the button does.

This is a general MW issue, will be fixed in T338791: "Clear" icon in DateTimeInputWidget is not accessible because it has no label.

On Special:MyEvents, the ellipses needs an accessible label, something like aria-label="more options for {event name}" as right now there is no label to let screen readers know what this is

Will fix.

The color contrast between the gray background ( hex #F8F9FA) and the red text (hex #DD3333) in the participants tab is currently 4.33 and needs to be increased slightly to 4.5:1 to fit into WCAG 2.1 AA standards (which is what the foundation aspires to reach). It is only with the gray background that this text color is an issue.

Fixed in r927191.

Change 938892 had a related patch set uploaded (by Daimona Eaytoy; author: Daimona Eaytoy):

[mediawiki/extensions/CampaignEvents@master] MyEvents: preserve kebab menu label when replacing the widget

https://gerrit.wikimedia.org/r/938892

Change 938900 had a related patch set uploaded (by Daimona Eaytoy; author: Daimona Eaytoy):

[mediawiki/extensions/CampaignEvents@master] Add labels to participant checkboxes in EventDetails

https://gerrit.wikimedia.org/r/938900

Change 938892 merged by jenkins-bot:

[mediawiki/extensions/CampaignEvents@master] MyEvents: preserve kebab menu label when replacing the widget

https://gerrit.wikimedia.org/r/938892

Change 938900 merged by jenkins-bot:

[mediawiki/extensions/CampaignEvents@master] Add labels to participant checkboxes in EventDetails

https://gerrit.wikimedia.org/r/938900

All done but the icon in the datetime selectors, for which I filed T338791.

On Special:EventDetails, there is no accessible text for checkboxes in participants tab. Anyone using a screen reader would not know what checkbox they were selecting, so it needs aria-label for checkbox inputs.

✅ There is now a label that correctly corresponds to each checkbox:

On Special:MyEvents, the ellipses needs an accessible label, something like aria-label="more options for {event name}" as right now there is no label to let screen readers know what this is

✅ There is now a "Manage event" text that makes this element accessible to screen readers

The color contrast between the gray background ( hex #F8F9FA) and the red text (hex #DD3333) in the participants tab is currently 4.33 and needs to be increased slightly to 4.5:1 to fit into WCAG 2.1 AA standards (which is what the foundation aspires to reach). It is only with the gray background that this text color is an issue.

✅ This is corrected now and the contrast ratio is now 4.56:1

As a note, I have created ticket T342595 for another contrast issue on this same special page.

The above are all fixed. The only remaining issue is the following:

On Special:EditEventRegistration and Special:EnableEventRegistration the clear buttons in the start time and end time fields need aria-label="clear start time" and aria-label="clear end time" to them so screen readers can let the viewer know what the button does.

and it will be fixed in T338791 per the comment at T336311#9020509, so I am sending this ticket to design sign off.