Fixed multiple ticks/tildes inside code blocks.

mixmark-io · Feb 25, 2020 · a24c58b · a24c58b
1 parent cae7098
commit a24c58b
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 3 deletions.
diff --git a/src/commonmark-rules.js b/src/commonmark-rules.js
@@ -111,11 +111,25 @@ rules.fencedCodeBlock = {
   replacement: function (content, node, options) {
     var className = node.firstChild.className || ''
     var language = (className.match(/language-(\S+)/) || [null, ''])[1]
+    var code = node.firstChild.textContent
+
+    var fenceChar = options.fence === '~~~' ? '~' : '`'
+    var fenceSize = 3
+    var fenceInCodeRegex = new RegExp('^' + fenceChar + '{3,}', 'gm')
+
+    var match
+    while ((match = fenceInCodeRegex.exec(code))) {
+      if (match[ 0 ].length >= fenceSize) {
+        fenceSize = match[ 0 ].length + 1
+      }
+    }
+
+    var fence = fenceChar.repeat(fenceSize)
 
     return (
-      '\n\n' + options.fence + language + '\n' +
-      node.firstChild.textContent +
-      '\n' + options.fence + '\n\n'
+      '\n\n' + fence + language + '\n' +
+      code.replace(/^\n|\n$/g, '') +
+      '\n' + fence + '\n\n'
     )
   }
 }

diff --git a/test/index.html b/test/index.html
@@ -902,6 +902,51 @@ <h2>This is a header.</h2>
   <pre class="expected">Foo Bar</pre>
 </div>
 
+<div class="case" data-name="triple tildes inside code" data-options='{"codeBlockStyle": "fenced", "fence": "~~~"}'>
+  <div class="input">
+<pre><code>
+~~~
+Code
+~~~
+</code></pre>
+  </div>
+  <pre class="expected">~~~~
+~~~
+Code
+~~~
+~~~~</pre>
+</div>
+
+<div class="case" data-name="triple ticks inside code" data-options='{"codeBlockStyle": "fenced", "fence": "```"}'>
+  <div class="input">
+<pre><code>
+```
+Code
+```
+</code></pre>
+  </div>
+  <pre class="expected">````
+```
+Code
+```
+````</pre>
+</div>
+
+<div class="case" data-name="four ticks inside code" data-options='{"codeBlockStyle": "fenced", "fence": "```"}'>
+  <div class="input">
+<pre><code>
+````
+Code
+````
+</code></pre>
+  </div>
+  <pre class="expected">`````
+````
+Code
+````
+`````</pre>
+</div>
+
 <!-- /TEST CASES -->
 
 <script src="turndown-test.browser.js"></script>