diff --git a/src/table/__tests__/columns-width.test.tsx b/src/table/__tests__/columns-width.test.tsx index 2b1b976697..8f1b10e628 100644 --- a/src/table/__tests__/columns-width.test.tsx +++ b/src/table/__tests__/columns-width.test.tsx @@ -137,6 +137,33 @@ test('should use the fallback value for columns without explicit width', () => { ]); }); +test('should respect minWidth for dynamically added columns without explicit width', () => { + const columns: TableProps.ColumnDefinition[] = [ + { id: 'id', header: '', cell: item => item.id, width: 100 }, + { id: 'name', header: '', cell: () => '-', minWidth: 250 }, + { id: 'description', header: '', cell: () => '-', minWidth: 300 }, + ]; + const { wrapper, rerender } = renderTable( + + ); + expect(wrapper.findColumnHeaders().map(column => column.getElement().style.width)).toEqual(['100px']); + // Dynamically add columns that have minWidth but no explicit width + rerender( +
+ ); + // Bug #4236: Previously these would be '120px' (DEFAULT_COLUMN_WIDTH) instead of respecting minWidth + expect(wrapper.findColumnHeaders().map(column => column.getElement().style.width)).toEqual([ + '100px', + '250px', + '300px', + ]); +}); + describe('reading widths from the DOM', () => { const originalBoundingClientRect = HTMLElement.prototype.getBoundingClientRect; beforeEach(() => { diff --git a/src/table/use-column-widths.tsx b/src/table/use-column-widths.tsx index db41a79c8c..2662d4ca25 100644 --- a/src/table/use-column-widths.tsx +++ b/src/table/use-column-widths.tsx @@ -168,7 +168,10 @@ export function ColumnWidthsProvider({ visibleColumns, resizableColumns, contain const column = visibleColumns[index]; if (!columnWidths?.get(column.id) && lastVisible.indexOf(column.id) === -1) { updated = true; - newColumnWidths.set(column.id, (column.width as number) || DEFAULT_COLUMN_WIDTH); + // Handle minWidth consistently with readWidths() for initial render + const width = (column.width as number) || 0; + const minWidth = (column.minWidth as number) || width || DEFAULT_COLUMN_WIDTH; + newColumnWidths.set(column.id, Math.max(width, minWidth)); } } if (updated) {