feat: Support table syntax.

jaywcjlove · May 31, 2021 · 7e9b2be · 7e9b2be
1 parent d18da2a
commit 7e9b2be
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 27 deletions.
diff --git a/__tests__/index.test.ts b/__tests__/index.test.ts
@@ -58,7 +58,7 @@ describe('rehype-attr function test case', () => {
     expect(utils.prevChild([ { type: 'comment', value: 'rehype:title=Rehype Attrs' }, { type: 'text' } ], 1)).toEqual({ type: "comment", value: "rehype:title=Rehype Attrs" })
     expect(utils.prevChild([ { type: 'text', value: '\n' }, { type: 'comment', value: 'rehype:title=Rehype Attrs' } ], 2)).toEqual({ type: "comment", value: "rehype:title=Rehype Attrs" })
   });
-  it('prevChild', async () => {
+  it('nextChild', async () => {
     expect(utils.nextChild(undefined, 0)).toBeUndefined()
     expect(utils.nextChild(undefined, -1)).toBeUndefined()
     expect(utils.nextChild([ { type: 'elment', value: 'rehype:title=Rehype Attrs' } ], 0)).toBeUndefined()
@@ -129,48 +129,34 @@ describe('rehype-attr test case', () => {
       .toString()
       expect(htmlStr).toEqual(expected);
   });
-
-  it('options="attr" - Multiple value settings 1', async () => {
-    const markdown = "test\n\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log('')\n```"
-    const expected = `<p>test</p>\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log('')\n</code></pre>`
+  it('options="attr" - Table', async () => {
+    const markdown = "| Property | Description |\n |---- |---- |\n | 1 | 2 |\n\n<!--rehype:border=1-->"
+    const expected = `<table border="1"><thead><tr><th>Property</th><th>Description</th></tr></thead><tbody><tr><td>1</td><td>2</td></tr></tbody></table>\n<!--rehype:border=1-->`
     const htmlStr = unified()
       .use(remarkParse)
+      .use(gfm)
       .use(remark2rehype, { allowDangerousHtml: true })
       .use(rehypeRaw)
       .use(rehypeAttrs, { properties: 'attr' })
       .use(stringify)
       .processSync(markdown)
       .toString()
-      expect(htmlStr).toEqual(expected);
+      expect(htmlStr.replace(/^\n+/, '')).toEqual(expected);
   });
 
-
-  it('options="attr" - Multiple value settings 2', async () => {
-    const markdown = "test\n<!--rehype:title=Hello World-->\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log('')\n```"
-    const expected = `<p title="Hello World">test</p>\n<!--rehype:title=Hello World-->\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log('')\n</code></pre>`
+  it('options="attr" - Table 2 `\\n\\n` ???', async () => {
+    const markdown = "| Property | Description |\n |---- |---- |\n | 1 | 2 |\n<!--rehype:border=1-->"
+    const expected = `<table><thead><tr><th>Property</th><th>Description</th></tr></thead><tbody><tr><td>1</td><td>2</td></tr><tr><td><!--rehype:border=1--></td><td></td></tr></tbody></table>`
     const htmlStr = unified()
       .use(remarkParse)
+      .use(gfm)
       .use(remark2rehype, { allowDangerousHtml: true })
       .use(rehypeRaw)
       .use(rehypeAttrs, { properties: 'attr' })
       .use(stringify)
       .processSync(markdown)
       .toString()
-      expect(htmlStr).toEqual(expected);
-  });
-
-  it('options="attr" - Multiple value settings 3', async () => {
-    const markdown = "test\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log('')\n```"
-    const expected = `<p>test</p>\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log('')\n</code></pre>`
-    const htmlStr = unified()
-      .use(remarkParse)
-      .use(remark2rehype, { allowDangerousHtml: true })
-      .use(rehypeRaw)
-      .use(rehypeAttrs, { properties: 'attr' })
-      .use(stringify)
-      .processSync(markdown)
-      .toString()
-      expect(htmlStr).toEqual(expected);
+      expect(htmlStr.replace(/^\n+/, '')).toEqual(expected);
   });
 
   [
@@ -215,10 +201,25 @@ describe('rehype-attr test case', () => {
       expected: '<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log("")\n</code></pre>',
     },
     {
-      title: 'options="attr" - Code',
+      title: 'options="attr" - Code - stting attr',
       markdown: '```js\nconsole.log("")\n```\n<!--rehype:title=Rehype Attrs-->',
       expected: '<pre title="Rehype Attrs"><code class="language-js">console.log("")\n</code></pre>\n<!--rehype:title=Rehype Attrs-->',
     },
+    {
+      title: 'options="attr" - Code - 1',
+      markdown: 'test\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log("")\n```',
+      expected: '<p>test</p>\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log("")\n</code></pre>',
+    },
+    {
+      title: 'options="attr" - Code - 2',
+      markdown: 'test\n<!--rehype:title=Hello World-->\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log("")\n```',
+      expected: '<p title="Hello World">test</p>\n<!--rehype:title=Hello World-->\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log("")\n</code></pre>',
+    },
+    {
+      title: 'options="attr" - Code - 3',
+      markdown: 'test\n\n<!--rehype:title=Rehype Attrs-->\n```js\nconsole.log("")\n```',
+      expected: '<p>test</p>\n<!--rehype:title=Rehype Attrs-->\n<pre data-type="rehyp"><code class="language-js" title="Rehype Attrs">console.log("")\n</code></pre>',
+    },
     {
       title: 'options="attr" - Emphasis <em>',
       markdown: 'Npm stand for *node*<!--rehype:style=color: red--> packet manager.',

diff --git a/src/index.ts b/src/index.ts
@@ -67,7 +67,7 @@ const rehypeAttrs: Plugin<[RehypeAttrsOptions?]> = (options): MdastTransformer =
           }
         }
       }
-      if (/^(em|strong|b|a|i|p|pre|blockquote|h(1|2|3|4|5|6)|code|img|del|ul|ol)$/.test(node.tagName as string)) {
+      if (/^(em|strong|b|a|i|p|pre|blockquote|h(1|2|3|4|5|6)|code|table|img|del|ul|ol)$/.test(node.tagName as string)) {
         const child = nextChild(parent.children, index)
         if (child) {
           const attr = getCommentObject(child)