Markdown Line Breaks in Code Blocks

Question

Using Redcarpet, when I include something like the following in my markdown, it does not respect any line breaks or indention. I've tried two spaces at the end of lines. Extra lines between code. Nothing seems to work.

```xml
<?xml version="1.0" encoding="UTF-8"?>
<hash>
   <money>3</money>
</hash>

```

I see:

<?xml version="1.0" encoding="UTF-8"?> <hash> <money>3</money> </hash>

Here are the Redcarpet settings:

Redcarpet::Markdown.new(Redcarpet::Render::HTML, :autolink => true, :space_after_headers => true, :fenced_code_blocks => true, :no_intra_emphasis => true, :lax_html_blocks => true)

What do I need to do to make the lines break properly and preserve indention, just like here or on GitHub?

Update - And the source looks like:

<pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
                &lt;hash&gt;
                &lt;money&gt;3&lt;/money&gt;
                &lt;/hash&gt;  
                </code></pre>

Caprifig

That's what you see in your web browser, but what is the HTML that you are getting? – Pulsation

If you're rendering this through github's gh-pages, the problem could simply be that github does't support redcarpet2, which allows for fenced code blocks. See this question – Shamus

@Shamus Nice guess, but Github-Flavored Markdown does support this. – Pulsation

@Pulsation Github-flavored markdown does, but ironically Github's Jekyll-powered gh-pages does not support Github-Flavored-Markdown. (see the linked question in my comment above). Therefore I can reproduce the error described by dropping such a markdown file into a gh-pages branch on github. – Shamus

Answer 1

Try wrapping the markdown result in the find_and_preserve Haml helper

# Assuming a setup like this:
markdown = Redcarpet::Markdown.new(Redcarpet::Render::HTML)
code_snippet = "    <xml>\n      <tag/>\n    </xml>"

# This should prevent undesirable spaces within code blocks:
find_and_preserve(markdown.render(code_snippet)).html_safe

When you wrap the render call with the find_and_preserve Haml helper, all newlines within <pre> tags in the markdown output are escaped with equivalent HTML entities, and the Haml auto-indention will then ignore them.

Hannahannah

Anyone finding this from google, find_and_preserve finally fixed an issue with weird indenting in my markdown rendering I'd been struggling with for hours. – Behind

Answer 2

The result of parsing has newlines inside a <pre> block for me:

require 'redcarpet'
md = Redcarpet::Markdown.new(Redcarpet::Render::HTML, fenced_code_blocks:true)

puts md.render("```xml\n<foo>\n</foo>\n```")
#=> <pre><code class="xml">&lt;foo&gt;
#=> &lt;/foo&gt;
#=> </code></pre>

1. Confirm that you are seeing a similar wrapper in your output HTML

2. Set your CSS to use preformatting in <pre> blocks:

   pre { white-space:pre }
   

Pulsation

Much better! But it still is munging the white space. See in the OP, I added the html source. The first line is left justified, but following lines have too much leading white space. Ideas? – Caprifig

Figured it out... it was HAML causing the problem. The markdown source is a template called from a HAML layout. In development, HAML outputs html in pretty format, with indention, thus munging the display of code blocks. In production, which uses :ugly output, it looks correct. In addition, @Phrogz's pre { white-space:pre } was also necessary to make it look correct. – Caprifig

This works in development for haml layouts = preserve(yield) – Caprifig

Answer 3

On Github, all I needed to do was wrap my indented/formatted text with <pre> and </pre> tags.

Jabber

Answer 4

Try this script to isolate whether it's something in your app or redcarpet.

I'm not able to reproduce the issue you're having (With the redcarpet-2.1.1 gem). Put this into a file, then run it (ruby redcarpet_test.rb):

require 'rubygems'
require 'redcarpet'

md = %Q{...
```xml
<?xml version="1.0" encoding="UTF-8"?>
<hash>
   <money>3</money>
</hash>
```
...}

r = Redcarpet::Markdown.new(Redcarpet::Render::HTML, :autolink => true, :space_after_headers => true, :fenced_code_blocks => true, :no_intra_emphasis => true, :lax_html_blocks => true)

puts r.render md

That results appropriately with:

<p>...
<code>xml
&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;hash&gt;
   &lt;money&gt;3&lt;/money&gt;
&lt;/hash&gt;
</code>
...</p>

Clueless

And I get the same a you in the above test. But inside a rails view, it does not escape anything inside the code blocks. I should add that I'm using the markdown-rails gem with a custom Redcarpet renderer. You can see my fork here: github.com/threadhead/markdown-rails – Caprifig