Skip to content

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

Description

@kminyoung

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.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions