AG Grid: autoHeight breaks default vertical cell centering — fix + rationale

ag-grid-autoheight-note.md

AG Grid: autoHeight breaks default vertical cell centering

Context: cert-catalog grid (Svelte 5 + AG Grid Enterprise 35.x, themeQuartz) with SSRM. Some columns use autoHeight: true + wrapText: true to show tag/standard/model chips that wrap across multiple lines. Other columns in the same row stay short (issue key, dates, single-word badges).

Symptom

Short-cell content (badges, dates, plain text) rendered at the top of a tall row, not vertically centered. Out of the box themeQuartz centers cell content — but only for rows with uniform height.

Why

AG Grid applies its default display: flex; align-items: center wrapper only when all cells share the same row height. When any cell opts into autoHeight, AG Grid switches the row into a "natural flow" mode where each .ag-cell renders with vertical-align: top. Sibling cells without autoHeight inherit that same top alignment.

Fix

Set cellStyle on defaultColDef so every cell is an explicit flex container:

defaultColDef: {
  sortable: true,
  resizable: true,
  flex: 1,
  minWidth: 80,
  cellStyle: { display: 'flex', alignItems: 'center' },
}

This is the official AG Grid workaround documented at https://www.ag-grid.com/javascript-data-grid/row-height/#auto-row-height

Comparison

telegram-jira-bot/packages/warranty-admin/src/components/reference/ReferenceGrid.svelte does NOT hit this issue because its defaultColDef has no autoHeight and no cell uses wrapText — rows are all fixed 40px, so AG Grid's built-in centering works and no override is needed.

Performance impact

Near zero:

• cellStyle is inline style="display:flex;align-items:center" per cell — already part of the normal DOM render pipeline, no extra reflows.
• The real cost is autoHeight itself, which forces AG Grid to measure each wrapping cell once per render to pick the tallest row height. On 200 rows per SSRM page × 4 wrapping columns that is ~800 measurements per page load, milliseconds of layout work. Scroll stays smooth in practice.
• Fixed-height columns with the cellStyle override cost the same as before.

So the override is free; the expensive piece (autoHeight) was already in place to support chip wrapping, and the centering fix just makes the other cells look right.