Merge pull request #325 from domchristie/fix_multiline_attributes

Fix multiline attributes
mixmark-io · May 11, 2020 · 7ec8f4e · 7ec8f4e
2 parents 4e36b45 + 22c7fc9
commit 7ec8f4e
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 5 deletions.
diff --git a/src/commonmark-rules.js b/src/commonmark-rules.js
@@ -109,7 +109,7 @@ rules.fencedCodeBlock = {
   },
 
   replacement: function (content, node, options) {
-    var className = node.firstChild.className || ''
+    var className = node.firstChild.getAttribute('class') || ''
     var language = (className.match(/language-(\S+)/) || [null, ''])[1]
     var code = node.firstChild.textContent
 
@@ -153,7 +153,8 @@ rules.inlineLink = {
 
   replacement: function (content, node) {
     var href = node.getAttribute('href')
-    var title = node.title ? ' "' + node.title + '"' : ''
+    var title = cleanAttribute(node.getAttribute('title'))
+    if (title) title = ' "' + title + '"'
     return '[' + content + '](' + href + title + ')'
   }
 }
@@ -169,7 +170,8 @@ rules.referenceLink = {
 
   replacement: function (content, node, options) {
     var href = node.getAttribute('href')
-    var title = node.title ? ' "' + node.title + '"' : ''
+    var title = cleanAttribute(node.getAttribute('title'))
+    if (title) title = ' "' + title + '"'
     var replacement
     var reference
 
@@ -251,12 +253,16 @@ rules.image = {
   filter: 'img',
 
   replacement: function (content, node) {
-    var alt = node.alt || ''
+    var alt = cleanAttribute(node.getAttribute('alt'))
     var src = node.getAttribute('src') || ''
-    var title = node.title || ''
+    var title = cleanAttribute(node.getAttribute('title'))
     var titlePart = title ? ' "' + title + '"' : ''
     return src ? '![' + alt + ']' + '(' + src + titlePart + ')' : ''
   }
 }
 
+function cleanAttribute (attribute) {
+  return attribute ? attribute.replace(/(\n+\s*)+/g, '\n') : ''
+}
+
 export default rules
diff --git a/test/index.html b/test/index.html
@@ -176,6 +176,29 @@
   <pre class="expected"></pre>
 </div>
 
+<div class="case" data-name="img with a new line in alt">
+  <div class="input"><img src="logo.png" alt="img with
+    alt"></div>
+  <pre class="expected">![img with
+alt](logo.png)</pre>
+</div>
+
+<div class="case" data-name="img with more than one new line in alt">
+  <div class="input"><img src="logo.png" alt="img with
+    
+    alt"></div>
+  <pre class="expected">![img with
+alt](logo.png)</pre>
+</div>
+
+<div class="case" data-name="img with new lines in title">
+  <div class="input"><img src="logo.png" title="the
+    
+    title"></div>
+  <pre class="expected">![](logo.png "the
+title")</pre>
+</div>
+
 <div class="case" data-name="a">
   <div class="input"><a href="http://example.com">An anchor</a></div>
   <pre class="expected">[An anchor](http://example.com)</pre>
@@ -186,6 +209,14 @@
   <pre class="expected">[An anchor](http://example.com "Title for link")</pre>
 </div>
 
+<div class="case" data-name="a with multiline title">
+  <div class="input"><a href="http://example.com" title="Title for
+    
+    link">An anchor</a></div>
+  <pre class="expected">[An anchor](http://example.com "Title for
+link")</pre>
+</div>
+
 <div class="case" data-name="a without a src">
   <div class="input"><a id="about-anchor">Anchor without a title</a></div>
   <pre class="expected">Anchor without a title</pre>