Comcast / Comcast/react-data-grid

[Bug] Duplicate frozen column elements in DOM and key collision warning when enableVirtualization={false}

Open
#4,120 1 comment 0 reactions 1 assignee Claimed by @nstepien View on GitHub
Dominant language
TypeScript
Stars
7.7k
Forks
2.2k
Avg merge
1d 2h
Merged PRs (30d)
33

Description

**Describe the bug**
When enableVirtualization is set to false, frozen/pinned columns are rendered twice in the DOM structure.

While the second set of frozen columns may not be visibly apparent on the screen in regular view, it causes duplicate key warnings (Warning: Encountered two children with the same key) in the console. Furthermore, when exporting the grid to PDF (where enableVirtualization={false} is typically used to render all items), these duplicated frozen columns appear twice side-by-side in the resulting PDF document.

**To Reproduce**
1. Render a grid containing frozen/pinned columns.
2. Set enableVirtualization={false} on the grid component.
3. Open the browser DevTools and inspect the DOM structure for the grid header/row elements.
4. Check the browser console for React key collision warnings.
5. Export to PDF (or trigger print view) with enableVirtualization={false}.

**Expected behavior**
1. Frozen columns should only be rendered once in the DOM.
2. No React key duplicate warnings should occur in the console.
3. Exported PDFs should only display frozen columns once.

**Actual behavior**
1. Inspecting the DOM reveals that the frozen column elements are duplicated.
2. Console logs a React warning about duplicate keys for the frozen column elements.
3. Exported PDF output shows the frozen columns printed twice side-by-side.

**Environment**
1. Library Version: 7.0.0-beta.61
2. React Version: 19.2.0
3. Browser/OS: Chrome / Windows 11

**Additional Context**
It appears that when virtualization is disabled (enableVirtualization={false}), the internal rendering logic duplicates the frozen column container/cells alongside the main column list, resulting in duplicate DOM nodes and key conflicts.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.