[WIKI-498] regression: table bugs #7631

packages/editor/src/core/extensions/table/plugins/drag-handles/column/plugin.ts

@@ -14,6 +14,9 @@ import { ColumnDragHandle, ColumnDragHandleProps } from "./drag-handle";
 
 type TableColumnDragHandlePluginState = {
   decorations?: DecorationSet;
+  // track table structure to detect changes
+  tableWidth?: number;
+  tableNodePos?: number;
 };
 
 const TABLE_COLUMN_DRAG_HANDLE_PLUGIN_KEY = new PluginKey("tableColumnHandlerDecorationPlugin");
@@ -31,7 +34,13 @@ export const TableColumnDragHandlePlugin = (editor: Editor): Plugin<TableColumnD
 
         const tableMap = TableMap.get(table.node);
 
-        let isStale = false;
+        // Check if table structure changed (width or position)
+        const tableStructureChanged = prev.tableWidth !== tableMap.width || prev.tableNodePos !== table.pos;
+
+        let isStale = tableStructureChanged;
+
+        // Only do position-based stale check if structure hasn't changed
+        if (!isStale) {
           const mapped = prev.decorations?.map(tr.mapping, tr.doc);
           for (let col = 0; col < tableMap.width; col++) {
             const pos = getTableCellWidgetDecorationPos(table, tableMap, col);
@@ -40,11 +49,18 @@ export const TableColumnDragHandlePlugin = (editor: Editor): Plugin<TableColumnD
               break;
             }
           }
-
-        if (!isStale) {
-          return { decorations: mapped };
         }
 
+        if (!isStale) {
+          const mapped = prev.decorations?.map(tr.mapping, tr.doc);
+          return {
+            decorations: mapped,
+            tableWidth: tableMap.width,
+            tableNodePos: table.pos,
+          };
+        }
+
+        // recreate all decorations
         const decorations: Decoration[] = [];
 
         for (let col = 0; col < tableMap.width; col++) {
@@ -63,6 +79,8 @@ export const TableColumnDragHandlePlugin = (editor: Editor): Plugin<TableColumnD
 
         return {
           decorations: DecorationSet.create(newState.doc, decorations),
+          tableWidth: tableMap.width,
+          tableNodePos: table.pos,
         };
       },
     },

packages/editor/src/core/extensions/table/plugins/drag-handles/row/plugin.ts

@@ -14,6 +14,9 @@ import { RowDragHandle, RowDragHandleProps } from "./drag-handle";
 
 type TableRowDragHandlePluginState = {
   decorations?: DecorationSet;
+  // track table structure to detect changes
+  tableHeight?: number;
+  tableNodePos?: number;
 };
 
 const TABLE_ROW_DRAG_HANDLE_PLUGIN_KEY = new PluginKey("tableRowDragHandlePlugin");
@@ -31,7 +34,13 @@ export const TableRowDragHandlePlugin = (editor: Editor): Plugin<TableRowDragHan
 
         const tableMap = TableMap.get(table.node);
 
-        let isStale = false;
+        // Check if table structure changed (height or position)
+        const tableStructureChanged = prev.tableHeight !== tableMap.height || prev.tableNodePos !== table.pos;
+
+        let isStale = tableStructureChanged;
+
+        // Only do position-based stale check if structure hasn't changed
+        if (!isStale) {
           const mapped = prev.decorations?.map(tr.mapping, tr.doc);
           for (let row = 0; row < tableMap.height; row++) {
             const pos = getTableCellWidgetDecorationPos(table, tableMap, row * tableMap.width);
@@ -40,11 +49,18 @@ export const TableRowDragHandlePlugin = (editor: Editor): Plugin<TableRowDragHan
               break;
             }
           }
-
-        if (!isStale) {
-          return { decorations: mapped };
         }
 
+        if (!isStale) {
+          const mapped = prev.decorations?.map(tr.mapping, tr.doc);
+          return {
+            decorations: mapped,
+            tableHeight: tableMap.height,
+            tableNodePos: table.pos,
+          };
+        }
+
+        // recreate all decorations
         const decorations: Decoration[] = [];
 
         for (let row = 0; row < tableMap.height; row++) {
@@ -61,7 +77,11 @@ export const TableRowDragHandlePlugin = (editor: Editor): Plugin<TableRowDragHan
           decorations.push(Decoration.widget(pos, () => dragHandleComponent.element));
         }
 
-        return { decorations: DecorationSet.create(newState.doc, decorations) };
+        return {
+          decorations: DecorationSet.create(newState.doc, decorations),
+          tableHeight: tableMap.height,
+          tableNodePos: table.pos,
+        };
       },
     },
     props: {

packages/editor/src/core/plugins/drag-handle.ts

@@ -379,7 +379,9 @@ const handleNodeSelection = (
   let draggedNodePos = nodePosAtDOM(node, view, options);
   if (draggedNodePos == null || draggedNodePos < 0) return;
 
-  if (node.matches("blockquote")) {
+  if (node.matches("table")) {
+    draggedNodePos = draggedNodePos - 2;
+  } else if (node.matches("blockquote")) {
     draggedNodePos = nodePosAtDOMForBlockQuotes(node, view);
     if (draggedNodePos === null || draggedNodePos === undefined) return;
   } else {