[data grid] auto-sizing of column headers fails when header text exceeds cell content length

[ARAV7ND]

Steps to reproduce

Steps:

1. Open this link to live example: Sandbox
2. Make sure the "Include Headers" option is selected.
3. Press the "Autosize Columns" button.
4. Notice that the column headers are slightly too narrow, causing the header text to be partially hidden.

Current behavior

Columns auto-size based only on the cell content, causing the header text to be truncated if it's longer than the content.

Expected behavior

The column should auto-size to fit the header text and ensure that the header text is visible without manual resizing.

Context

When using the auto-sizing feature in MUI Data Grid, columns containing shorter content than the header text do not resize correctly to accommodate the full header text. This results in truncated headers, affecting readability and the overall user experience.

Your environment

Tested on Edge and Chrome

npx @mui/envinfo

 System:
    OS: Windows 11 10.0.26100
  Binaries:
    Node: 21.7.3 - C:\Program Files\nodejs\node.EXE
    npm: 10.3.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: Not Found
  Browsers:
    Chrome: Not Found
    Edge: Chromium (132.0.2957.127)
  npmPackages:
    @emotion/react: ^11.11.3 => 11.13.3
    @emotion/styled: ^11.11.0 => 11.13.0
    @mui/core-downloads-tracker:  6.1.5
    @mui/icons-material: ^6.1.4 => 6.1.5
    @mui/material: ^6.1.4 => 6.1.5
    @mui/private-theming:  6.1.5
    @mui/styled-engine:  6.1.5
    @mui/styled-engine-sc: ^6.1.4 => 6.1.5
    @mui/system:  6.1.5
    @mui/types:  7.2.18
    @mui/utils:  6.1.5
    @mui/x-data-grid:  7.21.0
    @mui/x-data-grid-pro: ^7.20.0 => 7.21.0
    @mui/x-internals:  7.21.0
    @mui/x-license:  7.21.0
    @types/react: ^18.2.46 => 18.3.12
    react: ^18.2.0 => 18.3.1
    react-dom: ^18.2.0 => 18.3.1
    styled-components: ^6.1.6 => 6.1.13
    typescript: ^4.9.5 => 4.9.5

Search keywords: data grid header text cut off

Order ID: 98399

[KenanYusuf]

Thanks for raising the issue @ARAV7ND

Seems like this is still an issue on v7.24.0, autosizeOptions.includeHeaders has no effect:

Screen.Recording.2025-02-04.at.16.26.04.mov