Skip to content

Focus/clicking issues with dialogs triggered from a table cell #1810

@jluyau

Description

@jluyau

🐛 Bug Report

If a dialog is triggered from an action button in a table cell, clicking the dialog or the underlay will select the row from where the dialog was triggered. This prevents any dialog text selection or focus of any focusable children in the dialog content area. Clicking dialog buttons does still work however.

🤔 Expected Behavior

Clicks should not pass through the dialog/underlay and focusable children in the dialog should be focusable.

😯 Current Behavior

Clicks pass through the dialog (and select the table row). Focusable children in the dialog cannot be focused (e.g., textfields).

💁 Possible Solution

🔦 Context

💻 Code Sample

https://codesandbox.io/s/blue-dew-z0woi?file=/src/App.js

Click any of the action buttons to trigger a dialog. Click the dialog body or underlay and observe that the row will toggle selection or that clicking the textfield will not focus the textfield for text input.

🌍 Your Environment

Software Version(s)
react-spectrum 3.9.0
Browser Chrome
Operating System MacOS Catalina

🧢 Your Company/Team

Adobe/Quarry

🕷 Tracking Issue (optional)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions