Ampersand (&) not rendered correctly in Table Of Contents

[aguynamedben]

Thank you for this excellent piece of open source software and all of the time you put into it. I think I might have found a small bug I just wanted to file. I looked at fixing it and submitting a PR, but the Markdown rendering is beyond me.

The problem: When an ampersand character is present in a title, the Redcarpet::Render::HTML_TOC renderer converts the ampersand to "amp", but the Redcarpet::Render::HTML renderer removes the ampersand character. Because the 2 value don't match up, clicking the TOC link fails and doesn't direct you to the correct spot on the page.

For now I am working around it by changing &'s in titles to "and". Another workaround I found was changing &'s to &'s, but I found that that was a less clear workaround.

My Code

  def get_document
    toc_renderer = Redcarpet::Render::HTML_TOC.new(nesting_level: 2)
    toc = Redcarpet::Markdown.new(toc_renderer)

    markdown_renderer = Redcarpet::Render::HTML.new(with_toc_data: true)
    markdown = Redcarpet::Markdown.new(
      markdown_renderer,
      no_intra_emphasis: true,
      tables: true,
      autolink: true,
      quote: true
    )

    content = File.read(File.join(Rails.root, "library", "#{params[:document_path]}.md"))
    @frontmatter = yaml_frontmatter_metadata_from(content)

    content_without_frontmatter = remove_yaml_frontmatter_from(content)
    @toc_html = toc.render(content_without_frontmatter)
    @content_html = markdown.render(content_without_frontmatter)

    render layout: "columns_5_11_layout"
  end

The Markdown

# Section 1

## Foo & Bar

Blah blah blah

Rendered Table Of Contents

<li>
  <a href="#section-1">Section 1</a>
  <ul>
    <li>
      <a href="#foo-bar">Foo & Bar</a>
    </li>
  </ul>
</li>

Rendered H2 Output

<h2 id="foo-amp-bar">Foo & Bar</h2>

Maybe this will help somebody else, or inform you on development. Thanks again for the time you put into redcarpet, I love it.

[blim8183]

I'm experiencing similar problems with apostraphes

Markdown

# What's going on?

Rendered TOC

<ul>
  <li>
    <a href="#what-s-going-on">What's going on?</a>
  </li>
</ul>

Rendered H1

<h1 id="what-39-s-going-on">What's going on?</h1>

[robin850]

Hi there !

Sorry for the delay ! This is now fixed, thank you so much for reporting ! :-)

[blim8183]

Great, thank you! When are you planning on releasing the latest version of the gem?

[aguynamedben]

robin850++ thanks, very awesome!

[robin850]

My pleasure ! :)

I can't tell you for sure but I hope to release a new version of Redcarpet next week.

[blim8183]

Any updates on when that new version with this fix is going to be released? Thanks!

[aguynamedben]

@robin850 Any idea when there will be a new version released? It looks like the last release was December 2015. I'd be happy to help tag a new version.

[dennmart]

@robin850 I'm still having inconsistencies between what's generated in the TOC and the headers using Redcarpet 3.4.0. Here are some quick tests I did in the console:

Redcarpet 3.3.4

toc = Redcarpet::Markdown.new(Redcarpet::Render::HTML_TOC.new)
toc.render("# Test & Test\n\n#Test's and Tests")                                                                                                                   
 => "<ul>\n<li>\n<a href=\"#test-test\">Test & Test</a>\n</li>\n<li>\n<a href=\"#test-s-and-tests\">Test's and Tests</a>\n</li>\n</ul>\n"

markdown = Redcarpet::Markdown.new(Redcarpet::Render::HTML.new({ autolink: true, tables: true, strikethrough: true, fenced_code_blocks: true, with_toc_data: true }), {})
markdown.render("# Test & Test\n\nBody\n\n#Test's and Tests")                                                                                                      
 => "<h1 id=\"test-amp-test\">Test &amp; Test</h1>\n\n<p>Body</p>\n\n<h1 id=\"test-39-s-and-tests\">Test&#39;s and Tests</h1>\n"

Redcarpet 3.4.0

toc = Redcarpet::Markdown.new(Redcarpet::Render::HTML_TOC.new)
toc.render("# Test & Test\n\n#Test's and Tests")
 => "<ul>\n<li>\n<a href=\"#test\">Test & Test</a>\n</li>\n<li>\n<a href=\"#test-s-and-tests\">Test's and Tests</a>\n</li>\n</ul>\n"

markdown = Redcarpet::Markdown.new(Redcarpet::Render::HTML.new({ autolink: true, tables: true, strikethrough: true, fenced_code_blocks: true, with_toc_data: true }), {})
markdown.render("# Test & Test\n\nBody\n\n#Test's and Tests")
 => "<h1 id=\"test-test\">Test &amp; Test</h1>\n\n<p>Body</p>\n\n<h1 id=\"tests-and-tests\">Test&#39;s and Tests</h1>\n"