primefaces / primefaces/primereact

DataTable: The height of the DataTable component becomes 0 when using virtualScrollerOptions

Open
#8,360 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Status: Needs Triage
Dominant language
CSS
Stars
8.3k
Forks
1.2k
PR merge metrics
No merged PRs in 30d

Description

Describe the bug

When the style of the outer div of the DataTable changes from display: none to display: block, the height of the DataTable is 0.

Reproducer

https://stackblitz.com/edit/mqjupcpd-m4ezspg7?file=src%2FApp.jsx,package.json

System Information
System:
    OS: Windows 10 10.0.19045
    CPU: (20) x64 Intel(R) Core(TM) i5-14600K
    Memory: 29.76 GB / 63.70 GB
Binaries:
    Node: 22.16.0 - D:\node.js\node.EXE
    npm: 10.9.2 - D:\node.js\npm.CMD
    pnpm: 10.5.2 - D:\node.js\pnpm.CMD
Browsers:
    Chrome: 141.0.7390.108
    Edge: Chromium (140.0.3485.54)
npmPackages:
    primereact: ^10.9.7 => 10.9.7
    react: ^18.3.1 => 18.3.1
    tailwindcss: ^3.4.18 => 3.4.18
Steps to reproduce the behavior

No response

Expected behavior

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked StackBlitz reproducer and inspect the DataTable behavior when its outer div changes from display: none to display: block while virtualScrollerOptions is enabled. Confirm the zero-height result and identify the component behavior that should be covered by a regression test; done means the DataTable has the expected height after becoming visible.

Written by the indexing model from the issue text.

Assessment

Tech stack
react
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.