[Table] prop Table.columnWidths breaks column resizing

[zwerg44]

Hello.

Looks like setting initial column width with Table.columnWidths breaks column resizing starting from @blueprintjs/[email protected].
Version 3.8.0 - seams working.

Environment

• Package version(s): @blueprintjs/[email protected], @blueprintjs/[email protected]
• Browser and OS versions: firefox 70.0.1, chromium 78.0.3904.70, ubuntu 16.04

Link to a minimal repro: https://codesandbox.io/s/blueprint-sandbox-l4l11

Steps to reproduce

1. Create component with defined Table.columnWidths and resizable columns.
2. Try to resize column with mouse.

Actual behavior

The layout looks broken like this

Possible solution

Don't have solution, I rolled back to package previous version.

[anurag060]

Did anyone find a work arround for this issue?
Hi @zwerg44 ... you got this fixed?

[zwerg44]

Hi @anurag060
No, I rolled back versions, I still at:
"@blueprintjs/core": "3.18.1",
"@blueprintjs/datetime": "3.13.0",
"@blueprintjs/select": "3.10.0",
"@blueprintjs/table": "3.7.1",

[bheklilr]

I've also experienced this issue. I attempted to work around it by keeping up with the column widths in a state variable and using the onColumnWidthChanged handler, but I happened to notice that when the table has to horizontally scroll I get a weird glitch on resize. Any columns to the right of the one that was just resized are blanked out and completely white (pic attached). The cells still exist and I can select them with a click. As soon as I scroll horizontally it renders properly. Sometimes it seems that react will just trigger a render anyway and it'll come back.

Glad to know there is a workaround to pin at 3.8.0 for now.

[bsdis]

I also have this issue. Any plan of fixing it?

[adolfogarcia]

Was this issue ever fixed?

[alecf]

I am seeing this in 3.8.17

[aamirbutt]

I am seeing the same issue on 3.8.17. Any update about an ETA for the fix?

[lanzhenw]

I am using 3.8.26. I use columnWidth and onColumnWidthChanged for setting default column width. I thought I would also have this issue, but it didn't break column resizing. It was working fine.

[MartinDawson]

I am using 3.8.26. I use columnWidth and onColumnWidthChanged for setting default column width. I thought I would also have this issue, but it didn't break column resizing. It was working fine.

Please give an example because this doesn't really make sense as it isn't the correct function to use for this.

[MartinDawson]

#3771

^ above PR broke it

3.80 works, 3.8.1 table PR broke it. Seems to be this file: https://github.com/palantir/blueprint/pull/3771/files

table.tsx change.

I'm gonna attempt to fix it now cause this bug is critical and we need to update.

[MartinDawson]

Here is the issue: https://github.com/palantir/blueprint/pull/3771/files

let { columnWidths, rowHeights } = props;
        if (columnWidths == null) {
            columnWidths = state.columnWidths;
        }
        if (rowHeights == null) {
            rowHeights = state.rowHeights;
        }

It is never setting the columnWidths if they are supplied by props due to it being in 'controlled' mode.

  const [columnWidths, setColumnWidths] = useState([200, 200, 150, 150]);

<Table 
        columnWidths={columnWidths}
        onColumnWidthChanged={(index, width) => {
          const newColumnWidths = [...columnWidths];

          newColumnWidths[index] = width;

          setColumnWidths(newColumnWidths);
        }}

        />

Although there's still a major issue that the cells go white blank if you update the columnWidths and such.

[adidahiya]

this should be fixed in table v4.0.0-rc.1. if it's not, let me know and I'll re-open.