#59965 closed defect (bug) (fixed)
Reply link: Elements with visible text labels do not have matching accessible names
Reported by: |
|
Owned by: |
|
---|---|---|---|
Milestone: | 6.7 | Priority: | normal |
Severity: | normal | Version: | 4.1 |
Component: | Comments | Keywords: | has-patch commit |
Focuses: | accessibility, template | Cc: |
Description
Hi,
When I scanned the page with PageSpeed Insights, it gave the following error for reply link: Elements with visible text labels do not have matching accessible names.
aria-label problem. Because it is the same as the text. I solved it like this: I edited line 1822 in the wp-includes/comment-template.php file. I deleted it to be empty inside the quotes. The problem is fixed. I hope it will be fixed in new updates.
Change History (19)
#1
@
15 months ago
- Focuses accessibility added; coding-standards removed
- Summary changed from Reply link: Elements with visible text labels do not have matching accessible na to Reply link: Elements with visible text labels do not have matching accessible names
#2
@
15 months ago
Yes.
I customized the reply link as follows.
<?php comment_reply_link( array_merge( $args, array( 'reply_text' => __('<svg xmlns="http://www.w3.org/2000/svg" class="cevaplasimgesi" style="vertical-align: -0.125em;" width="18" height="18" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M9 16h7.2l-2.6 2.6L15 20l5-5l-5-5l-1.4 1.4l2.6 2.6H9c-2.2 0-4-1.8-4-4s1.8-4 4-4h2V4H9c-3.3 0-6 2.7-6 6s2.7 6 6 6z"/></svg><span>Cevapla</span>', 'textdomain'), 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
After deleting the inside of aria-label I realized it wasn't working. I tried different shapes, but eventually I had to change it back to the aria-label='%s' shape. I'm sure it will be edit in the best possible way.
Best.
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
11 months ago
#5
@
11 months ago
- Milestone changed from Awaiting Review to 6.6
It seems like it should be possible to set up the aria-label
attribute to be aware of the link text, and that's at least worth exploring. At the very least, we can use this as an opportunity to provide some clarifying documentation to help theme developers avoid this issue.
This ticket was mentioned in Slack in #core by nhrrob. View the logs.
8 months ago
This ticket was mentioned in Slack in #accessibility by rcreators. View the logs.
8 months ago
This ticket was mentioned in PR #7138 on WordPress/wordpress-develop by @snehapatil02.
6 months ago
#10
- Keywords has-patch added; needs-patch removed
This PR enhances the accessibility of comment reply links by synchronizing the visible text and the aria-label
attribute. This resolves issues where elements with visible text labels did not have matching accessible names.
### Changes
- Added the
use_reply_to_text
parameter to the$args
array with a default value offalse
. - Updated the function documentation to include descriptions for
reply_to_text
anduse_reply_to_text
. - Modified the link generation logic to use
reply_to_text
as the visible text whenuse_reply_to_text
istrue
. - Removed the
aria-label
when it would be redundant (i.e., whenuse_reply_to_text
istrue
). - Ensured consistent use of double quotes in HTML attributes.
---
Trac ticket: https://core.trac.wordpress.org/ticket/59965
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
6 months ago
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
4 months ago
#13
@
4 months ago
Test Report
Patch tested: https://github.com/WordPress/wordpress-develop/pull/7138
Environment
- OS: Ubuntu
- Web Server: Apache
- WordPress: 6.7-beta1-59152-src
- Browser: Chrome (125.0.6422.141 (Official Build) (64-bit))
- Theme: Twenty Twenty-One
- Active Plugins:
- None
Actual Results
- ✅ Issue resolved with patch.
Supplemental Artifacts
This ticket was mentioned in PR #7510 on WordPress/wordpress-develop by @joedolson.
4 months ago
#14
Trac ticket: https://core.trac.wordpress.org/ticket/59965
This is largely a copy of https://github.com/WordPress/wordpress-develop/pull/7138
#15
@
4 months ago
- Keywords commit added
This is a good approach; rather than trying to magically change the aria-label
value based on what the author passes into the function, it allows authors to set that value. While this has the weakness that an author is able to define an aria-label
value that violates WCAG's label in name rule, anything that tried to construct a string using the existing reply_text
value would have had significant translation problems.
I also like that this makes it possible to have a visible text using the current ARIA value, which is a significant accessibility benefit.
I'm extending the code comment on reply_to_text
slightly to provide guidance relevant to WCAG 2.5.3, but otherwise I think this is good to go.
#16
@
4 months ago
Technically, authors could already set the value; but with no documentation in the parameter docs, that was unlikely to be done much...
#17
@
4 months ago
- Owner set to joedolson
- Resolution set to fixed
- Status changed from new to closed
In 59181:
@joedolson commented on PR #7138:
4 months ago
#18
In r59181
@joedolson commented on PR #7510:
4 months ago
#19
In r59181
Hi and thanks for the report!
The
aria-label
was added to avoid having the same accessible name for all the Reply links in #16433 / [29822].PageSpeed Insights gave an error because it did not find "Yanıtla" as part of the
aria-label
.<a rel='nofollow' class='comment-reply-link' href='#comment-112' data-commentid="112" data-postid="210" data-belowelement="comment-112" data-respondelement="respond" data-replyto="Cevap Halil ESEN" aria-label='Cevap Halil ESEN'>Yanıtla</a>
It also seems that your site (either the theme or a plugin) overrides WordPress's default Turkish translation for the visible "Reply" text. "Cevapla" still could fail the automated test with an
aria-label
of "Cevap [commenter's name]", but it probably would sound close enough to recognize which link it is when seeing the text and hearing the label.If you like using the commenter's name inside the visible text instead of a label, maybe the
get_comment_reply_link()
function could add a condition to usereply_to_text
there and remove the label.Additional notes:
reply_to_text
yet.