Left and bottom line widths not working for filled cells (cells drawn over the previous cells borders)

[Re595]

On head and body the lineWidth is working properly but on foot, if we use the same value, if doesn't print the same width besides having the same value

The code where can replicate the behavior is the following:

autoTable(doc, {
      head: [headers],
      body: tableData,
      foot: [["Total Footer: ", "", "", 212.16]],
      startY, // Starting Y position for the table
      tableWidth: 150,
      margin: { left: 25 }, // Margins
      styles: {
        font: "helvetica",
        fontSize: 9,
        cellPadding: 5,
      },
      headStyles: {
        fillColor: [255, 255, 255],
        textColor: [0, 0, 0], // Black text
        fontStyle: "bold",
        lineWidth: {
          bottom: 2,
        },
        lineColor: [0, 0, 0],
        cellPadding: 1,
      },
      bodyStyles: {
        textColor: [0, 0, 0], // Black text
        cellPadding: 1,
      },
      footStyles: {
        fillColor: [255, 255, 255],
        textColor: [0, 0, 0], // Black text
        fontStyle: "bold",
        lineWidth: {
          top: 2,
        },
        lineColor: [0, 0, 0],
        cellPadding: 2,
      },
    });

The result is on the following image:

[simonbengtsson]

For future reference the issue here is that bottom and left borders can only be 1 pt wide when using filled background cells due to that the next cell is drawn on top of them. Solution would either be to draw all borders after all cells or change so that border widths are included in the cell width calculation.

Here is a more minimal example of this issue:

Screenshot

Code

doc.autoTable({
    theme: 'plain',
    body: [
      [
        {
          content: 'Cell with 2 pt border',
          styles: {
            fillColor: [240, 240, 240],
            lineColor: [0, 0, 0],
            lineWidth: {
              bottom: 2,
            },
          },
        },
        {
          content: 'Cell with 2 pt border',
          styles: {
            fillColor: [240, 240, 240],
            lineColor: [0, 0, 0],
            lineWidth: {
              bottom: 2,
            },
          },
        },
      ],
      [
        {
          content: 'Filled',
          styles: {
            fillColor: [200, 200, 255],
          },
        },
        {
          content: 'Transparent cell',
          styles: {
            fillColor: false,
          },
        },
      ],
    ],
  })