fix: table flattening (#830)

| [![PR App][icn]][demo] | Fix RM-8651 | | :--------------------: | :---------: | ## 🧰 Changes Fixes table flattening of html tables. The prior code had the expectation that it would only be flattening markdown tables, so it only looked at the first 2 children of a table. This PR iterates over **all** the children of a table, and cleans up the output string a little bit.
readmeio · Jan 12, 2024 · 54e75f4 · 54e75f4
1 parent 417a28c
commit 54e75f4
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 33 deletions.
diff --git a/__tests__/astToPlainText.test.js b/__tests__/astToPlainText.test.js
@@ -63,7 +63,7 @@ ${JSON.stringify(
 [/block]
     `;
 
-    expect(astToPlainText(hast(txt))).toBe('Header 1 Header 2 Cell 1 Cell 2 \nCell 2.1');
+    expect(astToPlainText(hast(txt))).toBe('Header 1 Header 2 Cell 1 Cell 2 Cell 2.1');
   });
 
   it('converts images', () => {

diff --git a/__tests__/table-flattening/index.test.js b/__tests__/table-flattening/index.test.js
@@ -21,6 +21,48 @@ describe('astToPlainText with tables', () => {
 | Cell *A1* | *Cell B1* |
 | *Cell* A2 | *Cell* B2 |`;
 
-    expect(astToPlainText(hast(text))).toMatchInlineSnapshot('"Col. A Col.  B Cell  A1 Cell B1 Cell  A2 Cell  B2"');
+    expect(astToPlainText(hast(text))).toMatchInlineSnapshot('"Col. A Col. B Cell A1 Cell B1 Cell A2 Cell B2"');
+  });
+});
+
+describe('hast(table)', () => {
+  it('should populate value on the tables children', () => {
+    const text = `
+<table>
+  <caption>
+    Test table
+  </caption>
+  <thead>
+    <tr>
+      <th scope="col">Col A</th>
+      <th scope="col">Col B</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <th scope="row">Donuts</th>
+      <td>3,000</td>
+    </tr>
+    <tr>
+      <th scope="row">Stationery</th>
+      <td>18,000</td>
+    </tr>
+  </tbody>
+</table>
+      `;
+    const ast = hast(text);
+    const table = ast.children[0];
+
+    expect(table.children.map(child => child.value)).toMatchInlineSnapshot(`
+      Array [
+        "",
+        "Test table",
+        "",
+        "Col A Col B",
+        "",
+        "Donuts 3,000 Stationery 18,000",
+        "",
+      ]
+    `);
   });
 });
diff --git a/processor/plugin/table-flattening.js b/processor/plugin/table-flattening.js
@@ -1,44 +1,22 @@
-const flatMap = require('unist-util-flatmap');
+const { SKIP, visit } = require('unist-util-visit');
 
 const collectValues = ({ value, children }) => {
   if (value) return value;
-  if (children) return children.flatMap(collectValues);
+  if (children) return children.flatMap(collectValues).join(' ');
   return '';
 };
 
-const valuesToString = node => {
-  const values = collectValues(node);
-  return Array.isArray(values) ? values.join(' ') : values;
-};
-
 // Flattens table values and adds them as a seperate, easily-accessible key within children
 function transformer(ast) {
-  return flatMap(ast, node => {
-    if (node.tagName === 'table') {
-      const [header, body] = node.children;
-      // hAST tables are deeply nested with an innumerable amount of children
-      // This is necessary to pullout all the relevant strings
-      return [
-        {
-          ...node,
-          children: [
-            {
-              ...node.children[0],
-              value: valuesToString(header),
-            },
-            body
-              ? {
-                  ...node.children[1],
-                  value: valuesToString(body),
-                }
-              : null,
-          ].filter(x => x),
-        },
-      ];
-    }
+  visit(ast, { tagName: 'table' }, node => {
+    node.children.forEach(child => {
+      child.value = collectValues(child).trimStart().trimEnd().replaceAll(/\s+/g, ' ');
+    });
 
-    return [node];
+    return SKIP;
   });
+
+  return ast;
 }
 
 module.exports = () => transformer;