Page MenuHomePhabricator

[web] Escape focus trap when an outside node is clicked
ClosedPublic

Authored by rohan on Jun 1 2023, 9:15 AM.
Tags
None
Referenced Files
Unknown Object (File)
Tue, May 14, 4:03 AM
Unknown Object (File)
Sat, May 4, 7:57 AM
Unknown Object (File)
Mon, Apr 22, 2:53 PM
Unknown Object (File)
Mon, Apr 22, 2:53 PM
Unknown Object (File)
Mon, Apr 22, 2:53 PM
Unknown Object (File)
Mon, Apr 22, 2:42 PM
Unknown Object (File)
Mar 16 2024, 7:10 AM
Unknown Object (File)
Mar 16 2024, 7:10 AM
Subscribers

Details

Summary

All of the context and investigation is in ENG-3954, but encompassing ModalOverlay in a focus-trap
was blocking all tooltip actions, since it was not contained within the trapped DOM element.

There were a few solutions proposed, this one is just the simplest. There are two configurable options that can be passed into the component,
clickOutsideDeactivates and allowOutsideClick. Both seem to resolve the issue, but I opted for allowOutsideClick as instead of entirely deactivating the focus-trap and letting outside clicks to continue, it
just filters through the click and allows outside actions.

Test Plan

Please see the video below showing the solution

Diff Detail

Repository
rCOMM Comm
Branch
ENG-3954
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

rohan requested review of this revision.Jun 1 2023, 9:34 AM

Makes sense to me, but would be great to get @kuba to take a look and test it to make sure it doesn't break the edit message use case focus-trap was introduced to handle!

This revision is now accepted and ready to land.Jun 2 2023, 2:50 AM