Skip to content

fix: make sure virtualized grid layouts dont disappear when hidden via display: none#10190

Draft
LFDanLu wants to merge 4 commits into
mainfrom
10171
Draft

fix: make sure virtualized grid layouts dont disappear when hidden via display: none#10190
LFDanLu wants to merge 4 commits into
mainfrom
10171

Conversation

@LFDanLu

@LFDanLu LFDanLu commented Jun 11, 2026

Copy link
Copy Markdown
Member

Closes #10171

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Test the "Virtualized Display None Toggle" gridlist story, the gridlist's items shouldn't disappear even when toggled a bunch

🧢 Your Project:

RSP

@rspbot

rspbot commented Jun 12, 2026

Copy link
Copy Markdown

// for that case we want to avoid reporting size 0 otherwise we get into a state
// where the virtualizer renders 0 items when it is hidden and thus won't remeasure when it is is unhidden
// in jsdom tests, offsetParent can be null, so skip the check there.
if (!navigator.userAgent.includes('jsdom') && ref.current.offsetParent === null) {

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

will need to think about this check since jsdom is probably not the only one used in tests

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe check isElementVisible() instead? This will inherit display and should work in test environments.

Comment thread vitest.browser.config.ts
export default defineConfig({
define: {
// make sure virtualizer actually runs since this is in browser
'process.env.VIRT_ON': '"1"'

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Isnt VIRT_ON only relevant for test environments? This is to say, why are the browser tests using the test environment instead of dev or prod?

A bunch of logic behind the test flag is tailored around JDOM and synthetic event quirks etc, which are not applicable to CDP and a real browser.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oh fair point, didn't really consider that but makes sense

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Virtualizer fails to resize properly when toggling the parent between display: flex/none

3 participants