fix: allow first table drag interaction #10423

[anu-priya-1999]

Summary

Fixes #10423

Fixes an issue where the first drag interaction on a draggable React Aria Table row could fail when initiated from the row's drag handle.

Root cause

useGridCell temporarily removes the cell's tabIndex on pointer down when selection occurs on press up. This prevents the browser from focusing the cell while starting a drag.

The logic previously only installed this handler when gridCellProps.onPointerDown was not already defined. With the current useSelectableItem behavior, the cell can already have an onPointerDown handler, causing the useGridCell handler to be skipped entirely.

As a result, the cell keeps its tabIndex during the first drag interaction and the drag handle can fail to start the drag correctly.

Fix

• Always install the useGridCell pointer-down handling when shouldSelectOnPressUp and tabIndex are applicable.
• Preserve and invoke any existing onPointerDown handler instead of replacing it.
• Continue temporarily removing and restoring the cell's tabIndex during pointer interaction.

Testing

Added a regression test verifying that the cell's tabIndex is removed on the first drag interaction and restored afterward.

Validated with:

• packages/react-aria-components/test/Table.test.js
• 177 passed, 1 skipped

[snowystinger]

Looks like this is failing a test

[snowystinger]

What did

keyboardNavigationBehavior="tab"

have to do with this? seems like mouse drag would work the same regardless?

Is there an equivalent test to the one that was failing that showed the opposite? Or do you have a test that shows the original issue with both keyboardNavigationBehavior behaviours set?

[anu-priya-1999]

You're right — keyboardNavigationBehavior itself isn't relevant to the mouse drag interaction.

I initially added keyboardNavigationBehavior !== 'tab' because the existing S2 test (textfield in cell works with tab mode) started failing with my first version of the fix. I confirmed that this test passed before the change, failed after the first commit, and passed again after the workaround was adjusted.

I then changed the implementation so the workaround is based on the pointer target instead of the keyboard navigation mode. It now only removes the cell's tabIndex when getEventTarget(e) === e.currentTarget, so the behavior is tied to a direct interaction with the cell rather than to keyboardNavigationBehavior.

I also ran the affected test suites successfully:

packages/@react-spectrum/s2/test/TableView.test.tsx
packages/react-aria-components/test/Table.test.js

Both suites pass with the updated implementation.