fix(metadata): preserve MDX special symbols in inline code syntax - #11821
fix(metadata): preserve MDX special symbols in inline code syntax#11821SethFalco wants to merge 2 commits into
Conversation
✅ [V2]Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
It doesn't work in its current state due to escaping
Remember that generating a description from your content is a best-effort and imperfect heuristic: in any case, it's possible to write a tailor-made description front matter attribute to override the default we generate.
https://docusaurus.io/docs/markdown-features/head-metadata#markdown-page-description
I'm not sure this qualifies as a bug, but I'm open to improving our heuristic with the proposed change. Please add a test file in _dogfooding so that we can validate the change easily in the deploy preview
| // Remove inline links. | ||
| .replace(/\[(?<alt>.*?)\][[(].*?[\])]/g, '$1') | ||
| // Remove inline code. | ||
| .replace(/`(?<text>.+?)`/g, '$1') |
There was a problem hiding this comment.
I understand why you moved this to the top: to escape tags before HTML tags get removed
Unfortunately, escaping doesn't work, so one solution that could work would be to use marker tags for < and > found in inline code blocks: you could replace these markers with their former < > values after having removed the HTML tags
There was a problem hiding this comment.
I've redone the PR but using the markers approach as you suggested. Please let me know if it's not what you had in mind!
(More details in my commit message!)
This comment was marked as spam.
This comment was marked as spam.
Sorry, something went wrong.
SethFalco
changed the title
a94f7e8 to
d7edc0b
Compare
In Markdown/MDX, any special characters between inline code should be displayed literally. The problem at hand was HTML tags, but this would apply to underscores, colons, etc. as well. The description was being mangled before, for example: "… of `<hn>` tags for headings." → "… of `` tags for headings." Now we correctly set the description: "… of <hn> tags for headings." → "… of <hn> tags for headings." It might've be better if we parsed the content character by character, and just skipped the pointer to after the inline code when found, but that'd be a drastic change for little benefit. Instead, I took the marker approach proposed by Sébastien Lorber—using U+FFFE and U+FFFF. I settled on them since they are "not characters" so we shouldn't encounter them organically. See: https://en.wikipedia.org/wiki/Specials_(Unicode_block)
4 participants
Pre-flight checklist
Motivation
The metadata on my SVGO.dev is screwy. :c
This fixes the bug so that the metadata shows the correct description.
Test Plan
I've added two new test cases, a dogfooding page, and can demonstrate it fixes the issue on a live page on Docusaurus.io. The latter is easiest to visualize through Open Graph embeds.
Production
No screenshot for the dogfooding page as it didn't exist yet.
This Branch
Test links
Deploy preview: https://deploy-preview-11821--docusaurus-2.netlify.app/
Related issues/PRs