tagHandler - Handle table - all tags + tests

__tests__/renderer-spec.tsx

@@ -234,7 +234,8 @@ test('should render break (br)', () => {
   expect(
     (render(
       <p>
-        text 1<br/>text 2
+        text 1<br />
+        text 2
       </p>
     ) as string).trim()
   ).toBe('text 1  \ntext 2');
@@ -250,8 +251,59 @@ test('should render strike (strike, s, del)', () => {
   ).toBe('This ~~is~~ some ~~text~~');
 });
 
+test('should render tables', () => {
+  expect(
+    (render(
+      <table>
+        <thead>
+          <tr>
+            <th>Header 1</th>
+            <th>Header 2</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td>Row 1 Col 1</td>
+            <td>Row 1 Col 2</td>
+          </tr>
+          <tr>
+            <td>Row 2 Col 1</td>
+            <td>Row 2 Col 2</td>
+          </tr>
+        </tbody>
+      </table>
+    ) as string).trim()
+  ).toBe(`\
+| Header 1    | Header 2    |
+| ----------- | ----------- |
+| Row 1 Col 1 | Row 1 Col 2 |
+| Row 2 Col 1 | Row 2 Col 2 |\
+`);
+});
+
 test('should render fallback as html tag', () => {
   expect((render(<span>some text</span>) as string).trim()).toBe(
     '<span>some text</span>'
   );
 });
+
+/*
+<table>
+  <thead>
+    <tr>
+      <th>Header 1</th>
+      <th>Header 2</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>Row 1 Col 1</td>
+      <td>Row 1 Col 2</td>
+    </tr>
+    <tr>
+      <td>Row 2 Col 1</td>
+      <td>Row 2 Col 2</td>
+    </tr>
+  </tbody>
+</table>
+*/

src/tagHandler.ts

@@ -14,8 +14,11 @@ import {
   separator,
   strike,
   strong,
+  table,
+  tableCell,
+  tableRow,
 } from 'mdast-builder';
-import {render as renderToHTML} from 'preact-render-to-string';
+import { render as renderToHTML } from 'preact-render-to-string';
 import {
   AnchorHTMLAttributes,
   Children as ReactChildren,
@@ -199,14 +202,41 @@ export default function handleTag(
       }
       break;
     }
-    // END - Handle blockquote
+    // END - Handle pre.code
+
+    // START - Handle table - all tags
+    case 'table': {
+      // TODO: Handle align
+      newParentASTNode = childASTNode = table();
+      break;
+    }
+
+    // Passthrough thead and tbody
+    case 'thead':
+    case 'tbody': {
+      newParentASTNode = parentASTNode;
+      break;
+    }
+
+    // Handle table rows
+    case 'tr': {
+      newParentASTNode = childASTNode = tableRow();
+      break;
+    }
+
+    // Handle table values (th - for header, td - for body)
+    case 'th':
+    case 'td': {
+      newParentASTNode = childASTNode = tableCell();
+      break;
+    }
+    // END - Handle table - all tags
 
     default:
       isHandled = false;
       break;
   }
 
-
   if (!isHandled) {
     // Handle as html
     let htmlText = '';