question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Dialog] Closing controlled dialog does not return focus properly

See original GitHub issue

Bug report

Current Behavior

When closing the Dialog via <kbd>Escape</kbd>, focus correctly restores to the trigger. However, if you activate and close the Dialog via a keybind, for example, closing the Dialog does not seem to restore focus anywhere. Even global event listeners on window do not work.

Here’s an example:

  • Open and close via click and Escape, works fine
  • Open via ⌘K, listeners work while it’s open
  • Close via ⌘K, listeners stop working entirely
  • Click on the body, listeners start working again

https://user-images.githubusercontent.com/34928425/106521620-bd165d00-649b-11eb-8c81-0718829016bb.mov

Expected behavior

Focus should be restored to the body (or the trigger? not sure) in a way such that global window listeners still work. I’m not even sure how it’s possible that it doesn’t work right now.

Reproducible example

https://codesandbox.io/s/infallible-curie-8gkof?file=/src/App.tsx

Suggested solution

Change the way focus is restored on unmount

Additional context

N/A

Your environment

Software Name(s) Version
Radix Package(s) dialog 0.0.5
React n/a
Browser n/a
Assistive tech n/a
Node n/a
npm/yarn n/a
Operating System n/a

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:10

github_iconTop GitHub Comments

4reactions
benoitgrelardcommented, Feb 2, 2021

I’m going to investigate this a little more, thanks for bringing this up @raunofreiberg!

3reactions
pacocourseycommented, Feb 10, 2021

Confirmed that it’s working now, thanks!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Closing dialog does not return focus to the original element.
When a dialog opens, anything outside of it should not be focusable. The only way to open another dialog would be from the...
Read more >
Dialog doesn't properly close when initiated by focus
Upon closing a dialog, focus is automatically returned to the element that had focus when the dialog was opened.
Read more >
Where should keyboard focus after closing a dialog with the ...
The focus should go to the next item. In that way you can go easily go through each item and delete it.
Read more >
Focus restore on dialog close can cause unwanted scrolling
If the originally-focused element is not in view at the time of closing the dialog, this call to .focus() will result in it...
Read more >
298078 - When a modal dialog is closed, focus should return ...
Issue 298078: When a modal dialog is closed, focus should return to the element that had focus when it was opened · 1)...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found