[data grid] Pinned columns error when disable column virtualization

[ysf99842]

Steps to reproduce

Steps:

1. Open this link to live example: DEMO
2. Here are the codes:

import Box from '@mui/material/Box';
import { DataGridPro } from '@mui/x-data-grid-pro';
import { useDemoData } from '@mui/x-data-grid-generator';
import React from 'react';

export default function DataGridProDemo() {
  const { data, loading } = useDemoData({
    dataSet: 'Commodity',
    rowLength: 100,
    editable: true,
  });

  const apiRef = React.useRef<GridApiPro>();

  React.useEffect(() => {
    if (apiRef.current) {
      apiRef.current.unstable_setColumnVirtualization(false);
    }
  }, []);

  return (
    <Box sx={{ height: 520, width: '100%' }}>
      <DataGridPro
        {...data}
        apiRef={apiRef}
        columnBufferPx={100000}
        pinnedColumns={{ left: ['commodity'] }}
      />
    </Box>
  );
}

Current behavior

Frozen column display error, appeared twice. The setting for columnBufferPx is not in effect

Expected behavior

Normal display

Context

First, the setting for columnBufferPx did not take effect, and I set it to large, which still did not prevent column virtualization.
Second, using unstable_setColumnVirtualization can cause problems with the display of frozen columns, and I want to know if there is something wrong with my usage. Please refer to the demonstration I gave. Thank you for your support!

Your environment

System:
OS: Windows 11 10.0.26100
Binaries:
Node: 20.16.0 - C:\Program Files\nodejs\node.EXE
npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
pnpm: Not Found
Browsers:
Chrome: Not Found
Edge: Chromium (131.0.2903.99)
npmPackages:
@emotion/react: ^11.14.0 => 11.14.0
@emotion/styled: ^11.14.0 => 11.14.0
@mui/base: 5.0.0-beta.66
@mui/core-downloads-tracker: 6.3.1
@mui/icons-material: ^6.2.1 => 6.3.1
@mui/lab: 6.0.0-beta.19
@mui/material: ^6.2.1 => 6.3.1
@mui/private-theming: 6.3.1
@mui/styled-engine: 6.3.1
@mui/system: 6.3.1
@mui/types: 7.2.21
@mui/utils: 6.3.1
@mui/x-data-grid: 7.23.6
@mui/x-data-grid-pro: ^7.23.6 => 7.23.6
@mui/x-internals: 7.23.6
@mui/x-license: 7.23.6
@toolpad/core: ^0.11.0 => 0.11.0
@toolpad/utils: 0.11.0
@types/react: ^18.3.12 => 18.3.18
react: ^18.3.1 => 18.3.1
react-dom: ^18.3.1 => 18.3.1
typescript: ~5.6.2 => 5.6.3

Search keywords: virtualization, pinned columns

[michelengelen]

Thanks for opening this @ysf99842 ... in fact this is a regression since it was working before v7.23.3.

7.23.2

7.23.3

The issue was introduced with this PR: #15116 (picked into v7 with #15929)

[michelengelen]

cc @cherniavskii

[cherniavskii]

Fixed by #15666 (for v7 – #16195)
Demo: https://codesandbox.io/p/sandbox/currying-moon-4732ml

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

@ysf99842 How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.