fix(preset-gfm): incorrect table parsing when pasting from Google Docs (#2283)

* fix(preset-gfm): incorrect table parsing when pasting from Google Docs

Google Docs tables use only <td>, never <th>. ProseMirror auto-inserts
an empty table_header_row, resulting in an extra row with empty cells.

Promote the first data row to header when there are 2+ data rows.
For single-row tables, keep existing fallback (empty header cells).

Also add recursive traversal in the paste rule so tables nested inside
wrapper nodes are found and fixed.

Closes #2259

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: Saul-Mirone

e2e/tests/crepe/table.spec.ts

@@ -155,11 +155,10 @@ const googleDocsTableWithoutHeader = `
 `.trim()
 
 const expectedMarkdown = `
-| <br /> | <br /> | <br /> |
-| :----- | :----- | :----- |
-| 111    | 222    | 333    |
-| 444    | 555    | 666    |
-| 777    | aaa    | bbb    |
+| 111 | 222 | 333 |
+| :-- | :-- | :-- |
+| 444 | 555 | 666 |
+| 777 | aaa | bbb |
 `.trim()
 
 test('paste missing header tables', async ({ page }) => {
@@ -177,3 +176,62 @@ test('paste missing header tables', async ({ page }) => {
   await page.keyboard.type('First Header Cell')
   await expect(firstCell).toContainText('First Header Cell')
 })
+
+const googleDocsThreeRowTable = `
+<meta charset='utf-8'><meta charset="utf-8"><b style="font-weight:normal;" id="docs-internal-guid-test"><div dir="ltr" style="margin-left:0pt;" align="left"><table style="border:none;border-collapse:collapse;table-layout:fixed;width:468pt"><colgroup><col /><col /><col /></colgroup><tbody><tr style="height:0pt"><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>A1</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>B1</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>C1</span></p></td></tr><tr style="height:0pt"><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>A2</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>B2</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>C2</span></p></td></tr><tr style="height:0pt"><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>A3</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>B3</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>C3</span></p></td></tr></tbody></table></div></b>
+`.trim()
+
+test('paste google docs table promotes first row to header', async ({
+  page,
+}) => {
+  await focusEditor(page)
+  await paste(page, {
+    'text/html': googleDocsThreeRowTable,
+  })
+  await waitNextFrame(page)
+  const md = await getMarkdown(page)
+  expect(md.includes('| A1 | B1 | C1 |')).toBeTruthy()
+  expect(md.includes('| A2 | B2 | C2 |')).toBeTruthy()
+  expect(md.includes('| A3 | B3 | C3 |')).toBeTruthy()
+  // First row should be header, no empty <br /> headers
+  expect(md.includes('<br />')).toBeFalsy()
+})
+
+test('paste google docs table promotes first row even when nested in wrapper', async ({
+  page,
+}) => {
+  // Google Docs wraps tables in <b><div>...<table>...</table>...</div></b>
+  // This tests that the paste rule traverses into wrapper nodes
+  await focusEditor(page)
+  await paste(page, {
+    'text/html': googleDocsTableWithoutHeader,
+  })
+  await waitNextFrame(page)
+  const md = await getMarkdown(page)
+  // The table from googleDocsTableWithoutHeader is nested inside <b><div>
+  // The paste rule should still find and fix it
+  expect(md.includes('| 111 | 222 | 333 |')).toBeTruthy()
+  expect(md.includes('| 444 | 555 | 666 |')).toBeTruthy()
+  expect(md.includes('| 777 | aaa | bbb |')).toBeTruthy()
+  // First row should be promoted to header, no empty <br /> headers
+  expect(md.includes('<br />')).toBeFalsy()
+})
+
+const googleDocsSingleRowTable = `
+<meta charset='utf-8'><meta charset="utf-8"><b style="font-weight:normal;" id="docs-internal-guid-single"><div dir="ltr" style="margin-left:0pt;" align="left"><table style="border:none;border-collapse:collapse;table-layout:fixed;width:468pt"><colgroup><col /><col /></colgroup><tbody><tr style="height:0pt"><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>Only1</span></p></td><td style="border:solid #000000 1pt;vertical-align:top;padding:5pt;"><p dir="ltr"><span>Only2</span></p></td></tr></tbody></table></div></b>
+`.trim()
+
+test('paste single row google docs table keeps empty header', async ({
+  page,
+}) => {
+  await focusEditor(page)
+  await paste(page, {
+    'text/html': googleDocsSingleRowTable,
+  })
+  await waitNextFrame(page)
+  const md = await getMarkdown(page)
+  // Single row can't be promoted (would leave 0 data rows), so empty header is kept
+  expect(md.includes('<br />')).toBeTruthy()
+  expect(md.includes('Only1')).toBeTruthy()
+  expect(md.includes('Only2')).toBeTruthy()
+})

packages/plugins/preset-gfm/src/node/table/input.ts

@@ -1,7 +1,12 @@
 import { commandsCtx } from '@milkdown/core'
 import { paragraphSchema } from '@milkdown/preset-commonmark'
 import { InputRule } from '@milkdown/prose/inputrules'
-import { Fragment, Slice } from '@milkdown/prose/model'
+import {
+  type Fragment as FragmentType,
+  Fragment,
+  type Node as ProsemirrorNode,
+  Slice,
+} from '@milkdown/prose/model'
 import { TextSelection } from '@milkdown/prose/state'
 import { $inputRule, $pasteRule, $useKeymap } from '@milkdown/utils'
 
@@ -52,35 +57,53 @@ withMeta(insertTableInputRule, {
 /// A paste rule for fixing tables without header cells.
 /// This is a workaround for some editors (e.g. Google Docs) which allow creating tables without header cells,
 /// which is not supported by Markdown schema.
-/// This paste rule will add header cells to the first row if it's missing.
+/// This paste rule will promote the first data row to header, or add empty header cells as a fallback.
 export const tablePasteRule = $pasteRule((ctx) => ({
   run: (slice, _view, isPlainText) => {
     if (isPlainText) {
       return slice
     }
-    let fragment = slice.content
 
-    slice.content.forEach((node, _offset, index) => {
-      if (node?.type !== tableSchema.type(ctx)) {
-        return
-      }
+    function fixTable(node: ProsemirrorNode): ProsemirrorNode {
       const rowsCount = node.childCount
       const colsCount = node.lastChild?.childCount ?? 0
       if (rowsCount === 0 || colsCount === 0) {
-        fragment = fragment.replaceChild(
-          index,
-          paragraphSchema.type(ctx).create()
-        )
-        return
+        return paragraphSchema.type(ctx).create()
       }
 
       const headerRow = node.firstChild
       const needToFixHeaderRow =
         colsCount > 0 && headerRow && headerRow.childCount === 0
       if (!needToFixHeaderRow) {
-        return
+        return node
+      }
+
+      // If there are 2+ data rows (3+ total: empty header + 2+ data rows),
+      // promote the first data row to header
+      if (rowsCount >= 3) {
+        const firstDataRow = node.child(1)
+        const headerCells: ProsemirrorNode[] = []
+        for (let i = 0; i < firstDataRow.childCount; i++) {
+          const cell = firstDataRow.child(i)
+          headerCells.push(
+            tableHeaderSchema
+              .type(ctx)
+              .create(cell.attrs, cell.content, cell.marks)
+          )
+        }
+        const newHeaderRow = headerRow.type.create(headerRow.attrs, headerCells)
+
+        // Collect remaining data rows (skip promoted row at index 1)
+        const remainingRows: ProsemirrorNode[] = []
+        for (let i = 2; i < rowsCount; i++) {
+          remainingRows.push(node.child(i))
+        }
+
+        return node.type.create(node.attrs, [newHeaderRow, ...remainingRows])
       }
-      // Fix for tables with rows but no cells in the first row
+
+      // Fallback: only 1 data row, can't promote (would leave 0 data rows).
+      // Fill the empty header with blank cells.
       const headerCells = Array(colsCount)
         .fill(0)
         .map(() => tableHeaderSchema.type(ctx).createAndFill()!)
@@ -93,9 +116,25 @@ export const tablePasteRule = $pasteRule((ctx) => ({
         headerRow.nodeSize,
         new Slice(Fragment.from(newHeaderRow), 0, 0)
       )
-      fragment = fragment.replaceChild(index, newTable)
-    })
+      return newTable
+    }
+
+    function fixFragment(fragment: FragmentType): FragmentType {
+      let result = fragment
+      fragment.forEach((node, _offset, index) => {
+        if (node.type === tableSchema.type(ctx)) {
+          result = result.replaceChild(index, fixTable(node))
+        } else if (node.childCount > 0) {
+          const fixedContent = fixFragment(node.content)
+          if (fixedContent !== node.content) {
+            result = result.replaceChild(index, node.copy(fixedContent))
+          }
+        }
+      })
+      return result
+    }
 
+    const fragment = fixFragment(slice.content)
     return new Slice(Fragment.from(fragment), slice.openStart, slice.openEnd)
   },
 }))