Skip to content

fix(content-blog): resolve anchor links in truncated blog previews - #12364

Open
devteamaegis wants to merge 1 commit into
facebook:mainfrom
devteamaegis:fix/blog-truncated-anchor-links
Open

fix(content-blog): resolve anchor links in truncated blog previews#12364
devteamaegis wants to merge 1 commit into
facebook:mainfrom
devteamaegis:fix/blog-truncated-anchor-links

Conversation

@devteamaegis

@devteamaegis devteamaegis commented Aug 13, 2026

Copy link
Copy Markdown

Pre-flight checklist

This is a small, focused bug fix rather than a new API or substantial change, so the last box is left unchecked. It closes #9731.

Motivation

Closes #9731 (see also #10287).

In blog paginated list views (/blog, tags pages, author pages), a post preview is rendered under the list page URL, not the post permalink. An in-page anchor link written above the truncate marker, e.g.

Jump to [the details](#details) below.

{/* truncate */}

## Details

was left relative and therefore resolved against the list page — /blog#details — instead of the post, so clicking it in a preview leads nowhere. On the full post page the same link works, because it resolves against the post URL. onBrokenAnchors also reports these as broken.

The fix

The blog markdown loader already truncates the preview inside its ?truncated=true branch — the one place in the pipeline that knows it is producing a list-view preview (the full post page is a separate compilation with no query). There we now rebase bare #anchor link targets to the current post permalink, using the source -> permalink map the plugin already maintains for Markdown link resolution.

Only bare #anchor targets are rewritten. Other relative links (./x, ../x, x.md) are intentionally left untouched — they are handled later in the MDX pipeline (resolveMarkdownLinks / transformLinks) — and absolute/external links are ignored. The full post page is not affected, so same-page anchors there remain native <a href="#…"> links.

Changed files (all in docusaurus-plugin-content-blog):

  • blogUtils.ts — new resolveTruncatedAnchorLinks(content, permalink) helper.
  • markdownLoader.ts — call it in the truncated branch, resolving the current post permalink from this.resourcePath.
  • index.ts / types.ts — pass siteDir and the sourceToPermalink map to the loader.

Test Plan

Unit tests (blogUtils.test.ts, describe('resolveTruncatedAnchorLinks')): 5 cases covering bare anchors, a following title, <…>-wrapped targets, multiple anchors, and that non-anchor/absolute/external links are left untouched. yarn test blogUtils (vitest) is green; ESLint and the formatter pass.

End-to-end on a fresh classic site with a post containing [the details section](#details) above the truncate marker and a ## Details heading below:

before after
List view /blog <a href="#details"> (→ /blog#details, broken) <a href="/blog/…/post#details">
Author page <a href="#details"> (broken) <a href="/blog/…/post#details">
Post page <a href="#details"> <a href="#details"> (unchanged)
onBrokenAnchors build report reports /blog#details broken no broken anchors

Test links

Deploy preview: https://deploy-preview-12364--docusaurus-2.netlify.app/

Related issues/PRs

Closes #9731. Related: #10287.

In blog paginated list views (/blog, tags, authors), a post preview is
rendered under the list page URL rather than the post permalink. An
in-page anchor link written above the truncate marker, e.g.
`[jump](#section)`, was left relative and therefore resolved against the
list page (/blog#section) instead of the post, leading nowhere.

The blog markdown loader already truncates the preview in its
`?truncated=true` branch, which is the only place that knows it is
producing a list-view preview. There we now rebase bare `#anchor` link
targets to the current post permalink, using the source->permalink map
already maintained for link resolution. Other relative links are left
untouched, as they are handled later in the MDX pipeline. The full post
page (compiled without the query) is unaffected.

Adds unit tests for the new `resolveTruncatedAnchorLinks` helper.

Closes facebook#9731
@meta-cla meta-cla Bot added the CLA Signed Signed Facebook CLA label Aug 13, 2026
@netlify

netlify Bot commented Aug 13, 2026

Copy link
Copy Markdown

[V2]

Built without sensitive environment variables

Name Link
🔨 Latest commit ff6ee86
🔍 Latest deploy log https://app.netlify.com/projects/docusaurus-2/deploys/6a7e4130a5cd000008568d01
😎 Deploy Preview https://deploy-preview-12364--docusaurus-2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed Signed Facebook CLA

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Blog - Relative links in blog truncated content (list view) are breaking

1 participant