From 2846151ad9dcc3dc60bf49e1e6bd82d82df5c4f1 Mon Sep 17 00:00:00 2001
From: Dave Garwacke <admin+git@ifyoumakeit.com>
Date: Thu, 5 Jul 2018 22:45:28 -0400
Subject: [PATCH] fix(tables) remove new line backtick wrapping

Removes extra whitespace between tags due to \n being wrapped.

- Add table to fixture
- Create test to fail on single wrapped new lines
- Update test with wrapped line and extra 's'
- Add table to next.js example

closes mdx-js/mdx#151
---
 examples/next/md/markdown.md            |  6 ++++++
 packages/mdx/mdx-hast-to-jsx.js         |  4 ++--
 packages/mdx/test/fixtures/blog-post.md |  4 ++++
 packages/mdx/test/index.test.js         | 16 ++++++++++++----
 packages/mdx/yarn.lock                  |  6 ------
 5 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/examples/next/md/markdown.md b/examples/next/md/markdown.md
index 9399d1df9..a475dfd80 100644
--- a/examples/next/md/markdown.md
+++ b/examples/next/md/markdown.md
@@ -11,3 +11,9 @@ import Other from './other.md'
 Here's a paragraph
 
 https://c8r.imgix.net/028ab8c85da415103cb3b1eb/johno.png
+
+Here's a table
+
+| Test | Table |
+| :--- | :---- |
+| Col1 | Col2  |
diff --git a/packages/mdx/mdx-hast-to-jsx.js b/packages/mdx/mdx-hast-to-jsx.js
index 485d356f6..a89cf1b5e 100644
--- a/packages/mdx/mdx-hast-to-jsx.js
+++ b/packages/mdx/mdx-hast-to-jsx.js
@@ -57,9 +57,9 @@ function toJSX(node, parentNode = {}) {
     }${props ? ` props={${props}}` : ''}>${children}</MDXTag>`
   }
 
-  // Wraps all text nodes inside template string, so that we don't run into escaping issues.
+  // Wraps all text nodes except new lines inside template string, so that we don't run into escaping issues.
   if(node.type === 'text') {
-    return '{`' + node.value.replace(/`/g, '\\`').replace(/\$/g, '\\$') + '`}'
+    return node.value === '\n' ? node.value : '{`' + node.value.replace(/`/g, '\\`').replace(/\$/g, '\\$') + '`}'
   }
 
   if (
diff --git a/packages/mdx/test/fixtures/blog-post.md b/packages/mdx/test/fixtures/blog-post.md
index 838b493c6..942166f0e 100644
--- a/packages/mdx/test/fixtures/blog-post.md
+++ b/packages/mdx/test/fixtures/blog-post.md
@@ -23,4 +23,8 @@ module.exports = 'test'
 npm i -g foo
 ```
 
+| Test | Table |
+| :--- | :---- |
+| Col1 | Col2  |
+
 export default ({children}) => <div>{children}</div>
diff --git a/packages/mdx/test/index.test.js b/packages/mdx/test/index.test.js
index f7664dce4..624963cca 100644
--- a/packages/mdx/test/index.test.js
+++ b/packages/mdx/test/index.test.js
@@ -51,16 +51,24 @@ it('Should render HTML inside inlineCode correctly', async () => {
   ).toBeTruthy()
 })
 
-it('Should recognize components as propertiess', async () => {
-  const result = await mdx('# Hello\n\n<MDX.Foo />')
-
+it('Should recognize components as properties', async () => {
+  const result = await mdx('# Hello\n\n<MDX.Foo />')  
   expect(
     result.includes(
-      '<MDXTag name="h1" components={components}>{`Hello`}</MDXTag>{`\n`}<MDX.Foo />'
+      '<MDXTag name="h1" components={components}>{`Hello`}</MDXTag>\n<MDX.Foo />'
     )
   ).toBeTruthy()
 })
 
+it('Should render elements without wrapping blank new lines', async () => {
+  const result = await mdx(`
+  | Test | Table |
+  | :--- | :---- |
+  | Col1 | Col2  |`)    
+    
+  expect(result.includes('{`\n`}')).toBe(false)
+})
+
 test('Should await and render async plugins', async () => {
   const result = await mdx(fixtureBlogPost, {
     hastPlugins: [
diff --git a/packages/mdx/yarn.lock b/packages/mdx/yarn.lock
index 1d874aa2c..a434d563f 100644
--- a/packages/mdx/yarn.lock
+++ b/packages/mdx/yarn.lock
@@ -130,12 +130,6 @@
     lodash "^4.2.0"
     to-fast-properties "^2.0.0"
 
-"@mdx-js/mdxast@^0.7.2":
-  version "0.7.2"
-  resolved "https://registry.yarnpkg.com/@mdx-js/mdxast/-/mdxast-0.7.2.tgz#588e3ad617465ca4b67a50c0079f222fb2d65614"
-  dependencies:
-    unist-util-visit "^1.3.0"
-
 abab@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/abab/-/abab-1.0.4.tgz#5faad9c2c07f60dd76770f71cf025b62a63cfd4e"