fix(tables): keep tableProperties internal and honor continuation edges with spaced borders

Author: harbournick

packages/layout-engine/painters/dom/src/table/renderTableRow.test.ts

@@ -0,0 +1,69 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { renderTableRow } from './renderTableRow.js';
+
+const renderTableCellMock = vi.fn(() => ({ cellElement: document.createElement('div') }));
+
+vi.mock('./renderTableCell.js', () => ({
+  renderTableCell: (args: unknown) => renderTableCellMock(args),
+}));
+
+describe('renderTableRow', () => {
+  let doc: Document;
+  let container: HTMLElement;
+
+  beforeEach(() => {
+    doc = document.implementation.createHTMLDocument('table-row');
+    container = doc.createElement('div');
+    renderTableCellMock.mockClear();
+  });
+
+  const createDeps = (overrides: Record<string, unknown> = {}) => ({
+    doc,
+    container,
+    rowIndex: 3,
+    y: 0,
+    rowMeasure: {
+      height: 20,
+      cells: [{ width: 100, height: 20, gridColumnStart: 0, colSpan: 1, rowSpan: 1 }],
+    },
+    row: {
+      id: 'row-1',
+      cells: [{ id: 'cell-1', blocks: [{ kind: 'paragraph', id: 'p1', runs: [] }] }],
+    },
+    totalRows: 10,
+    tableBorders: {
+      top: { style: 'single', width: 1, color: '#000000' },
+      bottom: { style: 'single', width: 1, color: '#000000' },
+      left: { style: 'single', width: 1, color: '#000000' },
+      right: { style: 'single', width: 1, color: '#000000' },
+      insideH: { style: 'single', width: 1, color: '#111111' },
+      insideV: { style: 'single', width: 1, color: '#222222' },
+    },
+    columnWidths: [100],
+    allRowHeights: [20, 20, 20, 20, 20, 20, 20, 20, 20, 20],
+    tableIndent: 0,
+    context: { sectionIndex: 0, pageIndex: 0, columnIndex: 0 },
+    renderLine: () => doc.createElement('div'),
+    applySdtDataset: () => {},
+    cellSpacingPx: 6,
+    ...overrides,
+  });
+
+  it('does not draw insideH on top edge for continuation fragments with cell spacing', () => {
+    renderTableRow(createDeps({ continuesFromPrev: true }) as never);
+
+    expect(renderTableCellMock).toHaveBeenCalledTimes(1);
+    const call = renderTableCellMock.mock.calls[0][0] as { borders?: { top?: unknown; bottom?: unknown } };
+    expect(call.borders?.top).toBeUndefined();
+    expect(call.borders?.bottom).toBeDefined();
+  });
+
+  it('does not draw insideH on bottom edge before continuation with cell spacing', () => {
+    renderTableRow(createDeps({ continuesOnNext: true }) as never);
+
+    expect(renderTableCellMock).toHaveBeenCalledTimes(1);
+    const call = renderTableCellMock.mock.calls[0][0] as { borders?: { top?: unknown; bottom?: unknown } };
+    expect(call.borders?.top).toBeDefined();
+    expect(call.borders?.bottom).toBeUndefined();
+  });
+});

packages/layout-engine/painters/dom/src/table/renderTableRow.ts

@@ -301,10 +301,12 @@ export const renderTableRow = (deps: TableRowRenderDependencies): void => {
         const isLastRow = rowIndex === totalRows - 1;
         const isFirstCol = gridColIndex === 0;
         const isLastCol = gridColIndex === totalCols - 1;
+        const treatAsFirstRow = isFirstRow || continuesFromPrev;
+        const treatAsLastRow = isLastRow || continuesOnNext;
 
         resolvedBorders = {
-          top: !isFirstRow ? borderValueToSpec(tableBorders.insideH) : undefined,
-          bottom: !isLastRow ? borderValueToSpec(tableBorders.insideH) : undefined,
+          top: !treatAsFirstRow ? borderValueToSpec(tableBorders.insideH) : undefined,
+          bottom: !treatAsLastRow ? borderValueToSpec(tableBorders.insideH) : undefined,
           left: !isFirstCol ? borderValueToSpec(tableBorders.insideV) : undefined,
           right: !isLastCol ? borderValueToSpec(tableBorders.insideV) : undefined,
         };

packages/super-editor/src/extensions/table/table.import-width.test.js

@@ -5,6 +5,10 @@ import { Table } from './table.js';
 describe('Table import width defaults', () => {
   const attributes = Table.config.addAttributes.call(Table);
 
+  it('keeps tableProperties as non-rendered metadata', () => {
+    expect(attributes.tableProperties.rendered).toBe(false);
+  });
+
   it('defaults imported HTML tables to 100% width', () => {
     const tableElement = {
       closest: (selector) => (selector === '[data-superdoc-import="true"]' ? {} : null),

packages/super-editor/src/extensions/table/table.js

@@ -472,6 +472,7 @@ export const Table = Node.create({
             type: 'auto',
           },
         },
+        rendered: false,
         parseDOM: (element) => {
           if (!isImportedTableElement(element)) return undefined;