fix: converting text alignment caused columns to disappear

packages/@atjson/offset-annotations/src/utils/convert-html-tables.ts

@@ -16,7 +16,7 @@ export function convertHTMLTablesToDataSet(
       slice: string;
       type: ColumnType;
     }[] = [];
-    let columnConfigs: Table["attributes"]["columns"] = [];
+    let columnConfigs: Exclude<Table["attributes"]["columns"], undefined> = [];
     let dataRows: Record<string, { slice: string; jsonValue: JSON }>[] = [];
 
     let slices: SliceAnnotation[] = [];
@@ -45,7 +45,10 @@ export function convertHTMLTablesToDataSet(
           attributes: { refs: [] },
         });
         doc.replaceAnnotation(headCell, slice);
-        let columnName = doc.content.slice(slice.start, slice.end).trim();
+        let columnName = doc.content
+          .slice(slice.start, slice.end)
+          .replace(/[^\p{Letter}\p{White_Space}]/gu, "")
+          .replace(/\s+/, " ");
         dataColumnHeaders.push({
           slice: slice.id,
           name: columnName.length ? columnName : `column ${index + 1}`,
@@ -59,11 +62,15 @@ export function convertHTMLTablesToDataSet(
           );
 
           if (groups?.alignment) {
-            columnConfigs?.push({
+            columnConfigs.push({
               name: columnName,
-              textAlign: groups.alignment as "left" | "right" | "center",
+              textAlign: groups?.alignment as "left" | "right" | "center",
             });
+          } else {
+            columnConfigs.push({ name: columnName });
           }
+        } else {
+          columnConfigs.push({ name: columnName });
         }
       });
 
@@ -134,7 +141,7 @@ export function convertHTMLTablesToDataSet(
       attributes: { dataSet: dataSet.id },
     });
 
-    if (columnConfigs?.length) {
+    if (columnConfigs.length) {
       offsetTable.attributes.columns = columnConfigs;
     }
 

packages/@atjson/renderer-commonmark/test/__snapshots__/table.test.ts.snap

@@ -0,0 +1,41 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`tables with column headings center alignment 1`] = `
+"| column 1 | column 2 |
+|:--------:| -------- |
+| data 1.1 | data 1.2 |
+
+"
+`;
+
+exports[`tables with column headings mixed alignment 1`] = `
+"| column 1 | column 2 |
+|:-------- | --------:|
+| data 1.1 | data 1.2 |
+
+"
+`;
+
+exports[`tables with column headings no alignment 1`] = `
+"| column 1 | column 2 |
+| -------- | -------- |
+| data 1.1 | data 1.2 |
+
+"
+`;
+
+exports[`tables with column headings omitting columns 1`] = `
+"| column 2 |
+| -------- |
+| data 1.2 |
+
+"
+`;
+
+exports[`tables with column headings reordering columns 1`] = `
+"| column 2 | column 1 |
+| -------- | -------- |
+| data 1.2 | data 1.1 |
+
+"
+`;

packages/@atjson/renderer-commonmark/test/table.test.ts

@@ -0,0 +1,179 @@
+import { Block, deserialize } from "@atjson/document";
+import OffsetSource, { Table } from "@atjson/offset-annotations";
+import CommonmarkRenderer from "../src";
+
+function testTable(tableAttributes: Block<Table>["attributes"]) {
+  return deserialize(
+    {
+      text: "column 1 column 2 data 1.1 data 1.2",
+      blocks: [
+        {
+          type: "table",
+          id: "tableId",
+          attributes: tableAttributes,
+          parents: [],
+        },
+        {
+          type: "data-set",
+          id: "dataSetId",
+          attributes: {
+            columns: [
+              {
+                name: "column 1",
+                slice: "column1Id",
+                type: "peritext",
+              },
+              {
+                name: "column 2",
+                slice: "column2Id",
+                type: "peritext",
+              },
+            ],
+            rows: [
+              {
+                "column 1": {
+                  slice: "cell1_1Id",
+                  jsonValue: "data 1.1",
+                },
+                "column 2": {
+                  slice: "cell1_2Id",
+                  jsonValue: "data 1.2",
+                },
+              },
+            ],
+          },
+          parents: ["table"],
+        },
+      ],
+      marks: [
+        {
+          attributes: {
+            refs: ["dataSetId"],
+          },
+          id: "column1Id",
+          range: "(2..10]",
+          type: "slice",
+        },
+        {
+          attributes: {
+            refs: ["dataSetId"],
+          },
+          id: "column2Id",
+          range: "(11..19]",
+          type: "slice",
+        },
+        {
+          attributes: {
+            refs: ["dataSetId"],
+          },
+          id: "cell1_1Id",
+          range: "(20..28]",
+          type: "slice",
+        },
+        {
+          attributes: {
+            refs: ["dataSetId"],
+          },
+          id: "cell1_2Id",
+          range: "(29..37]",
+          type: "slice",
+        },
+      ],
+    },
+    OffsetSource
+  );
+}
+
+describe("tables", () => {
+  describe("with column headings", () => {
+    test("no alignment", () => {
+      let document = testTable({
+        columns: [
+          {
+            name: "column 1",
+          },
+          {
+            name: "column 2",
+          },
+        ],
+        dataSet: "dataSetId",
+        showColumnHeaders: true,
+      });
+
+      const markdown = CommonmarkRenderer.render(document);
+      expect(markdown).toMatchSnapshot();
+    });
+
+    test("mixed alignment", () => {
+      let document = testTable({
+        columns: [
+          {
+            name: "column 1",
+            textAlign: "left",
+          },
+          {
+            name: "column 2",
+            textAlign: "right",
+          },
+        ],
+        dataSet: "dataSetId",
+        showColumnHeaders: true,
+      });
+
+      const markdown = CommonmarkRenderer.render(document);
+      expect(markdown).toMatchSnapshot();
+    });
+
+    test("center alignment", () => {
+      let document = testTable({
+        columns: [
+          {
+            name: "column 1",
+            textAlign: "center",
+          },
+          {
+            name: "column 2",
+          },
+        ],
+        dataSet: "dataSetId",
+        showColumnHeaders: true,
+      });
+
+      const markdown = CommonmarkRenderer.render(document);
+      expect(markdown).toMatchSnapshot();
+    });
+
+    test("reordering columns", () => {
+      let document = testTable({
+        columns: [
+          {
+            name: "column 2",
+          },
+          {
+            name: "column 1",
+          },
+        ],
+        dataSet: "dataSetId",
+        showColumnHeaders: true,
+      });
+
+      const markdown = CommonmarkRenderer.render(document);
+      expect(markdown).toMatchSnapshot();
+    });
+
+    test("omitting columns", () => {
+      let document = testTable({
+        columns: [
+          {
+            name: "column 2",
+          },
+        ],
+        dataSet: "dataSetId",
+        showColumnHeaders: true,
+      });
+
+      const markdown = CommonmarkRenderer.render(document);
+      expect(markdown).toMatchSnapshot();
+    });
+  });
+});