Skip to content

Instantly share code, notes, and snippets.

@zkamvar
Last active August 18, 2020 17:32
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save zkamvar/87e0730e55454156554c47283dd5ee37 to your computer and use it in GitHub Desktop.
pandoc markdown_github with section-divs booboo

This compares the differences between pandoc's markdown and markdown_github engines when parsing <div> tags within sections.

Problem

In essence, if a <div> tag contains a header out of order with the main document, its contents will be appended to the div in the html document with markdown_github. If the following div appears after a level 3 header:

<div class='boo'>

## level 2
  
</div>

It will appear like this:

<div class='boo'>
</div>

<div class='section' id='level-2'>
<h2> level 2</h2
</div

Solution

Use the markdown engine instead of markdown_github


The html and diff files are generated from pandoc-compare.sh

chmod 755 pandoc-compare.sh
./pandoc-compare.sh > test.diff
#!/usr/bin/env bash
# git 2.28.0
# pandoc 2.9.2.1
# Compiled with pandoc-types 1.20, texmath 0.12.0.1, skylighting 0.8.3.2
pandoc -t html4 \
--from markdown_github+markdown_in_html_blocks \
--output test-mdg.html \
--section-divs \
test.md
pandoc -t html4 \
--from markdown \
--output test-md.html \
--section-divs \
test.md
git diff --no-index -- test-md*.html
<div id="test" class="section level1">
<h1>Test</h1>
<div id="level-3" class="section level3">
<h3>level 3</h3>
<p>test test</p>
</div>
<div id="level-2" class="section level2 callout">
<h2>level 2</h2>
<p>oh nos</p>
</div>
</div>
<div id="test2" class="section level1">
<h1>Test2</h1>
<div id="level-2-1" class="section level2">
<h2>level 2</h2>
<p>text text</p>
<div id="level-2-2" class="section level3 callout">
<h3>level 2</h3>
<p>oh nos</p>
</div>
</div>
</div>
<div id="test" class="section level1">
<h1>Test</h1>
<div id="level-3" class="section level3">
<h3>level 3</h3>
<p>test test</p>
<div class="callout">
</div>
<div id="level-2" class="section level2">
<h2>level 2</h2>
<p>oh nos</p>
</div>
</div>
</div>
<div id="test2" class="section level1">
<h1>Test2</h1>
<div id="level-2-1" class="section level2">
<h2>level 2</h2>
<p>text text</p>
<div class="callout">
<div id="level-2-2" class="section level3">
<h3>level 2</h3>
<p>oh nos</p>
</div>
</div>
</div>
</div>
diff --git a/test-mdg.html b/test-md.html
index 7c8b9d5..1d053aa 100644
--- a/test-mdg.html
+++ b/test-md.html
@@ -3,24 +3,20 @@
<div id="level-3" class="section level3">
<h3>level 3</h3>
<p>test test</p>
-<div class="callout">
</div>
-<div id="level-2" class="section level2">
+<div id="level-2" class="section level2 callout">
<h2>level 2</h2>
<p>oh nos</p>
</div>
</div>
-</div>
<div id="test2" class="section level1">
<h1>Test2</h1>
<div id="level-2-1" class="section level2">
<h2>level 2</h2>
<p>text text</p>
-<div class="callout">
-<div id="level-2-2" class="section level3">
+<div id="level-2-2" class="section level3 callout">
<h3>level 2</h3>
<p>oh nos</p>
</div>
</div>
</div>
-</div>

Test

level 3

test test

level 2

oh nos

Test2

level 2

text text

level 2

oh nos

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