#a11y-headings - the wp_comment_reply() h5 headings

[afercia]

These headings appear in several places: in the Comments screen, in the Edit post screen and in the Dashboard:

Depending on the screen, they should use a different heading level. By the way, wondering if they should be headings in the first place. Maybe we should simplify and just make them paragraphs. Thoughts?

#a11y-headings

[joedolson]

This seems like an appropriate place for a fieldset/legend, actually. What do you think?

[joedolson]

Proposed patch using fieldset/legend

[afercia]

Agreed! Also, just noticed the textarea is missing a label.

[joedolson]

Good point - I'll address that, too.

[joedolson]

Also adds label to comment editor textarea

[wonderboymusic]

why the style="display: none"?

[joedolson]

That was pre-existing; I didn't change it. It seems pretty inelegant, though - we certainly could change that now, while we're working in this area.

[afercia]

Replying to wonderboymusic:

why the style="display: none"?

As far as I see, first added here: [9098] I guess the best person to ask is @azaozz :)

[azaozz]

Replying to afercia:

why the style="display: none"?

You mean for the initially hidden elements? That's from over 7 years ago... Guessing it's to match how jQuery hides/shows elements. Can be changed to add and remove class="hidden" if needed but frankly I'd like to rewrite all of it. It's been looong time :)

[afercia]

frankly I'd like to rewrite all of it. It's been looong time :)

Thanks @azaozz :) then let's keep it simple and focus just on the scope of this ticket.

[afercia]

Refreshing the patch after [34241] and noticed that having two legend inside a fieldset is invalid code. Reworking the patch but wondering if there's any reason there's no "title" for the Quick Edit form. I mean, there's a Reply to Comment text when replying, a Add new Comment text when adding a new comment but no Edit Comment when Quick Editing.
Looks like it would be simple to add something like in the screenshot below (compared with the other "titles"):

[afercia]

As ​discussed on Slack the refreshed patch adds a "Edit Comment" legend before the Comments Quick Edit form to pair it with "Reply to Comment" and "Add new Comment" and also moves the Name, Email, and URL fields after the Comment textarea.

Maybe these forms would need some major CSS adjustments (alignments, more white space, etc.) but I've tried to keep the CSS changes to a bare minimum. Visual improvements should preferably go in a separate ticket.

Screenshots before and after:

[afercia]

In 34743:

In wp_comment_reply() change the H5 headings in fieldset legends for better accessibility.

Also, add a "Edit Comment" legend before the Quick Edit form to pair it with "Reply to Comment" and "Add new Comment" and move the Name, Email, and URL fields after the Comment textarea.

Props joedolson, afercia.

Fixes #33757.