Table is not interactive on first click in SSR

[gijsroge]

Provide a general summary of the issue here

React Aria's table is not interactive on the first click when the page was loaded through SSR.

🤔 Expected Behavior?

The table should be interactive/hydrated on page load, not only after a user clicked on the page.

😯 Current Behavior

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

https://github.com/gijsroge/react-aria-table-issue

npm install && npm run dev

On page load you will notice the table is not interactive on the first click, only on the second click.

If you start on page 2: http://localhost:5174/2 and then use the link on this page to navigate to the table using a client side navigation, the table is interactive on first click.

Version

1.8.0

What browsers are you seeing the problem on?

Chrome, Microsoft Edge, Safari, Firefox

If other, please specify.

No response

What operating system are you using?

Windows

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[herkulano]

Reverted to version 1.7.1 to get it working again.

[snowystinger]

I can reproduce in the nightly version as well. I'm not sure why the checkboxes take two clicks.

The app you have is not going to be keyboard accessible until we support edit mode. See #6037

[gijsroge]

@snowystinger it's not just the checkbox specific, anything inside the table is somehow ignored on first click. Also it gets weird when I add a button inside a cell. If I do that the row is selected on first click, but the button did not handle the click event.

I pushed this in the repo as an example as well.

[splicebison]

Can confirm behavior though it's an upgrade for us where on 1.7.1 sometimes the table would disappear completely on first click.