:fix: rowSpan does not work correctly

demo/32-merge-and-shade-table-cells.ts

@@ -209,6 +209,43 @@ const table5 = new Table({
     },
 });
 
+const table6 = new Table({
+    rows: [
+        new TableRow({
+            children: [
+                new TableCell({
+                    children: [new Paragraph("11")],
+                }),
+                new TableCell({
+                    children: [new Paragraph("12")],
+                }),
+            ],
+        }),
+        new TableRow({
+            children: [
+                new TableCell({
+                    children: [new Paragraph("21"), new Paragraph("31")],
+                    rowSpan: 2,
+                }),
+                new TableCell({
+                    children: [new Paragraph("22")],
+                }),
+            ],
+        }),
+        new TableRow({
+            children: [
+                new TableCell({
+                    children: [new Paragraph("32")],
+                }),
+            ],
+        }),
+    ],
+    width: {
+        size: 100,
+        type: WidthType.PERCENTAGE,
+    },
+});
+
 doc.addSection({
     children: [
         table,
@@ -226,6 +263,8 @@ doc.addSection({
         table4,
         new Paragraph("More Merging columns"),
         table5,
+        new Paragraph("Another Merging columns"),
+        table6,
     ],
 });
 

src/file/table/table-row/table-row.ts

@@ -46,6 +46,10 @@ export class TableRow extends XmlComponent {
         return this.options.children;
     }
 
+    public get cells(): TableCell[] {
+        return this.root.filter((xmlComponent) => xmlComponent instanceof TableCell);
+    }
+
     public addCellToIndex(cell: TableCell, index: number): void {
         // Offset because properties is also in root.
         this.root.splice(index + 1, 0, cell);

src/file/table/table.ts

@@ -78,27 +78,24 @@ export class Table extends XmlComponent {
             this.root.push(row);
         }
 
-        for (const row of rows) {
+        rows.forEach((row, rowIndex) => {
-            row.Children.forEach((cell, cellIndex) => {
+            row.cells.forEach((cell, cellIndex) => {
-                const column = rows.map((r) => r.Children[cellIndex]);
                 // Row Span has to be added in this method and not the constructor because it needs to know information about the column which happens after Table Cell construction
                 // Row Span of 1 will crash word as it will add RESTART and not a corresponding CONTINUE
                 if (cell.options.rowSpan && cell.options.rowSpan > 1) {
-                    const thisCellsColumnIndex = column.indexOf(cell);
+                    const endRowIndex = rowIndex + (cell.options.rowSpan - 1);
-                    const endColumnIndex = thisCellsColumnIndex + (cell.options.rowSpan - 1);
+                    for (let i = rowIndex + 1; i <= endRowIndex; i++) {
-
-                    for (let i = thisCellsColumnIndex + 1; i <= endColumnIndex; i++) {
                         rows[i].addCellToIndex(
                             new TableCell({
                                 children: [],
                                 verticalMerge: VerticalMergeType.CONTINUE,
                             }),
-                            i,
+                            cellIndex,
                         );
                     }
                 }
             });
-        }
+        });
 
         if (float) {
             this.properties.setTableFloatProperties(float);