-
-
Notifications
You must be signed in to change notification settings - Fork 8.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(v2): static phrasing content should be rendered correctly in TOC #1992
Conversation
Deploy preview for docusaurus-2 ready! Built with commit 9ae161f |
Deploy preview for docusaurus-preview ready! Built with commit 9ae161f |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wonder if we rather just render the value to HTML and pass it directly.
@@ -37,7 +37,7 @@ function Headings({headings, isChild}) { | |||
{headings.map(heading => ( | |||
<li key={heading.id}> | |||
<a href={`#${heading.id}`} className={LINK_CLASS_NAME}> | |||
{heading.value} | |||
<div dangerouslySetInnerHTML={{__html: heading.value}} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This adds an extra <div>
element. Why don't do dangerouslySetInnerHTML
on the <a>
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You are right. I am currently away so will update after that then
Motivation
TOC always render as string. Never putting the html markup.
Previously, only the textual content of headings was used to generate the entries in the Table of Contents. This lead to a bug (or feature?) where HTML in headings made entries in the TOC appear with literal HTML.
Example:
## <i>hello</i>
Will be rendered as literal
Other example is below. See that the right toc does not render the emphasis, etc
mdast has a concept of static phrasing content, which includes all the things that can appear in links. Instead of using just the textual content of a heading, this commit introduces a new behaviour where any static phrasing content, such as HTML, inline code, and emphasis, are copied over into the Table of Contents.
See test plan
Have you read the Contributing Guidelines on pull requests?
yes
Test Plan
After. See that its rendered correctly now