Skip to content

fix #10333 Tool-tip Closes using Keyboard in Table - #10363

Open
jsmitrah wants to merge 8 commits into
adobe:mainfrom
jsmitrah:fix/10333/tooltip-closes-using-keyboard-in-table
Open

fix #10333 Tool-tip Closes using Keyboard in Table#10363
jsmitrah wants to merge 8 commits into
adobe:mainfrom
jsmitrah:fix/10333/tooltip-closes-using-keyboard-in-table

Conversation

@jsmitrah

Copy link
Copy Markdown

Closes #10333

✅ 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:

  • Open React Aria Components->Table->TableTooltipScrollExample in Storybook.
  • Click into the table, then Tab until focus reaches the button in the first row. Its tooltip should appear. Press Tab once more to move focus out of the table entirely.
  • Press Shift+Tab to move focus back into the table. The tooltip should stay visible. Before the fix, it would flash open and immediately close.

🧢 Your Project:

@snowystinger snowystinger left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

How did you arrive at this solution? What alternatives did you consider?

What other reasons might a user invoke scrollIntoView where the tooltip should close? Do we really want this to blanket ignore all?

@jsmitrah

Copy link
Copy Markdown
Author

Hi @snowystinger, Thanks for reviewing this.

The main issue was that useCloseOnScroll treats every nearby scroll as a user scroll. But components like Table and GridList call scrollIntoView themselves during keyboard navigation, so those internal scrolls were also closing the tooltip.

I first thought about ignoring scrolls after a focus event, but that doesn't work because the scroll listener is added only after the overlay opens. I also tried ignoring all scrolls for a short time after scrollIntoView, but that was too broad and broke existing tests.

So I changed the approach. Instead of ignoring every scroll, the code now tracks only the specific scroll container that was scrolled by scrollIntoView. useCloseOnScroll ignores only those scroll events, and we shouldn't ignore every scrollIntoView call. The current implementation doesn't do that anymore. An unrelated scrollIntoView from another component won't prevent a Tooltip, Popover, or Menu from closing, and I added a regression test to verify that behavior.

@jsmitrah
jsmitrah requested a review from snowystinger July 28, 2026 07:49
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.

Tooltip in Table closes automatically for keyboard users

2 participants