Table.enableColumnReordering causes ColumnHeader.handleResizeDoubleClick to calculate wrong column width

[zwerg44]

Hello.

Looks like Table.enableColumnReordering causes ColumnHeader.handleResizeDoubleClick to calculate wrong column width.

Environment

• Package version(s): @blueprintjs/table@3.7.0, @blueprintjs/core@3.18.0
• Browser and OS versions: firefox 69.0, chromium 76.0.3809.100, ubuntu 16.04

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

Steps to reproduce

1. Create component with Table.enableColumnReordering={true} and resizable columns.
2. Set column name to Some column name
3. Its more reproducable, when Column name is longer then cells data
4. Doubleclick right border of the column’s header

Actual behavior

1. The width of the column is adjusted like there is somethins like drag-handle-verticalSome column name in it.

Expected behavior

1. The width of the column shuold be adjusted like there is Some column name in it, ignoring drag-handle-vertical element.

Possible solution

Looks like Header.maybeRenderReorderHandle method here misses bp-table-text-no-measure class.

This leads to incorrect calculation at ColumnHeader.handleResizeDoubleClick method, as drag-handle-vertical text appears in dom element's textContent.

Adding bp-table-text-no-measure class should fix the bug.

[zwerg44]

Also looks like there is the similar bug with handleResizeDoubleClick and enabled header's right menu. Reproducable here https://blueprintjs.com/docs/#table/features.sorting

[adidahiya]

I can reproduce the bug. It may have been introduced when we switched from the icon font to rendering SVG icons with <Icon>.