[feature request] preventScroll Option on Focus Override #162
Description
Description of Feature
Currently, react-focus-lock allows you to pass in focus options (including preventScroll: true) to the returnFocus prop (see #84 and theKashey/focus-lock#23). I am looking for a prop to add focus options to the logic that brings focus back to the focus lock when a focus event occurs outside of the focus lock.
Use-Case
I am creating a Popover component that uses react-focus-lock that opens when an anchor/reference button is clicked. When the Popover is open, the user is able to scroll around the page. If the user scrolls to the point where the Popover is out of view and then clicks on a button outside of the Popover, some browsers (including Chrome) scroll back to the open Popover. The reason is that some browsers focus a button on mousedown, which I'm assuming causes the focus lock inside of the Popover to grab focus again. I would like to disable scrolling when this Popover focus event occurs using preventScroll: true.
Example
Here is a small example of the scroll behavior: https://codesandbox.io/s/react-focus-lock-prevent-scroll-1hjn3?file=/src/App.js
To reproduce:
- Make sure the focus lock is enabled (see button at the top)
- Scroll down to the bottom of the page
- Click and hold on the button called "Button outside of focus lock" to trigger the
mousedownevent. - Chrome will scroll back to the top of the page where the focus lock is. I want to be able to prevent this part of the reproduction.