WordPress / wporg-developer

WordPress.org Developer theme
https://developer.wordpress.org/
60 stars 24 forks source link

Code Reference: Related: Fix extra empty links #468

Closed ryelle closed 10 months ago

ryelle commented 10 months ago

Fixes #432 — These extra links are coming from the autolink_references function, which did not account for content already in a link. So it was creating <a href="https://developer.wordpress.org/reference/functions/parse_blocks/"><a href="https://developer.wordpress.org/reference/functions/parse_blocks/" rel="function">parse_blocks()</a></a>, and the browser interpreted that as two separate links, one empty. Now, autolink_references will check if the current piece is inside a link, and skip it if so.

An alternate solution was to wrap the used/uses title in a span, and let autolink_references handle the linking, but the approach in this PR will also handle other cases where content is already linked.

There is one difference between the autolinked tag — it includes a rel="function". Should that be added to this link?

👩🏻‍💻 I was surprised that autolink_references was run over the block output, but it comes from the fact that the_content filters are applied, because the theme jumps in to the_content early to hijack the post display. I remember we did this on purpose, but this is one of the unexpected consequences.

No screenshots, there should be no visual change.

To test

  1. View any code reference page, scroll to the related section
  2. Either tab or inspect element to check that there is only one link per row
adamwoodnz commented 10 months ago

👍 Works for me, a11y scans have dropped that error

There is one difference between the autolinked tag — it includes a rel="function". Should that be added to this link?

The only reference to that attribute value I can find is https://github.com/WordPress/wporg-developer/blob/trunk/source/wp-content/themes/wporg-developer-2023/inc/template-tags.php#L880

renintw commented 10 months ago

It works on my side. 👍

There is one difference between the autolinked tag — it includes a rel="function". Should that be added to this link?

It seems that only get_param_reference uses rel="function", and it's only utilized by code-parameter. I think as long as we ensure that the source of $param is different from the Uses/Used by sections, then there's no need to add rel="function" to this link.

We might be able to directly verify this through this function reference/functions/wp_page_menu/. It has More Arguments from... as well as Related section.

ryelle commented 10 months ago

Looks like it still works as expected, and actually fixes this same bug in the content there. I'm guessing the filter is run multiple times.

For an example, try this page: https://developer.wordpress.org/reference/functions/get_the_posts_pagination/ — It still works, because you can see the "More Arguments from paginate_links( … $args )" details block.

Before, 2 links After, 1 link