Skip to content

[EuiDataGrid][a11y] When cell popover contains interactive children, opening and closing the cell popover strands focus  #5646

@cee-chen

Description

@cee-chen

Screencap of issue

screencap

Repro steps

  1. Open Safari
  2. Go to https://elastic.github.io/eui/#/tabular-content/data-grid
  3. Click any Date or Amount cell (any cell that does not have cell actions or interactive popover children)
  4. Press the Enter key to open the popover
  5. Press the Escape key to close the popover
  6. Notice that focus is correctly restored back to the cell that opened the popover
  7. Click any Account or Name cell (any cell that has cell actions or interactive popover children)
  8. Press the Enter key to open the popover
  9. Press the Escape key to close the popover
  10. Notice that focus is not restored back to the cell that opened the popover but instead was returned to the entire document body

Browser info

I was testing in Safari+VO, but this happens in Safari without VO on (EDIT: or does it?? it appears not??). On Firefox I've experienced this intermittently and can't seem to isolate why, sometimes cell popover refocus works perfectly and other times it doesn't. It doesn't appear to happen for me on Chrome.

Thoughts/approach

I suspect FocusTrap is the underlying issue for this, but it looks like there's no difference in testing between 47.0.0 (the react and focus-trap upgrade) and 42.0.0 (a random old datagrid release) so it's unlikely that it's a recent issue. I'll probably work to address this at the data grid level rather than the focus trap level.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions