do not compact paragraphs when opening component tags are used inside backticks

Author: miguelcobain

lib/utils/compile-markdown.js

@@ -46,10 +46,10 @@ function compactParagraphs(tokens) {
       last.text = `${last.text} ${token.text}`;
     }
 
-    balance += count(/\{\{#/g, token.text);
-    balance += count(/<[A-Z]/g, token.text);
-    balance -= count(/\{\{\//g, token.text);
-    balance -= count(/<\/[A-Z]/g, token.text);
+    balance += count(/(?<!`.*){{#/g, token.text);
+    balance += count(/(?<!`.*)<[A-Z]/g, token.text);
+    balance -= count(/{{\/.*}}(?!.*`)/g, token.text);
+    balance -= count(/<\/[A-Z][a-z]+>(?!.*`)/g, token.text);
   }
 
   return compacted;

tests-node/unit/utils/compile-markdown-test.js

@@ -83,4 +83,36 @@ QUnit.module('Unit | compile-markdown', function(hooks) {
 
     assert.equal(result, expected);
   });
+
+  test('using opening curlies inside backticks shouldn\'t compact paragraphs', function(assert) {
+    let input = stripIndent`
+      Foo bar is \`{{#my-component}}\`.
+
+      Another paragraph.
+    `;
+
+    let result = compileMarkdown(input, { targetHandlebars: true });
+    let expected = stripIndent`
+      <div class="docs-md"><p>Foo bar is <code>&#123;&#123;#my-component&#125;&#125;</code>.</p>
+      <p>Another paragraph.</p></div>
+    `;
+
+    assert.equal(result, expected);
+  });
+
+  test('using opening angle brackets inside backticks shouldn\'t compact paragraphs', function(assert) {
+    let input = stripIndent`
+      Foo bar is \`<My component>\`.
+
+      Another paragraph.
+    `;
+
+    let result = compileMarkdown(input, { targetHandlebars: true });
+    let expected = stripIndent`
+      <div class="docs-md"><p>Foo bar is <code>&lt;My component&gt;</code>.</p>
+      <p>Another paragraph.</p></div>
+    `;
+
+    assert.equal(result, expected);
+  });
 });