[docs][base] FocusTrap basic demo not focusing back to the Box in Firefox

[ZeeshanTamboli]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example: https://mui.com/base-ui/react-focus-trap/#basics

Steps:

1. Go to https://mui.com/base-ui/react-focus-trap/#basics in Firefox browser
2. Click on "Open" to open the Box.
3. Scroll down and click anywhere.
4. It is focused back to the code snippet rather than the demo.

Current behavior 😯

After following the steps, the focus in the Firefox browser returns to the code snippet of the demo instead of the demo box.

Expected behavior 🤔

After following the steps, the focus should return to the Box demo instead of the code snippet in the Firefox browser.

Context 🔦

Originally reported in #37330, it was mistakenly assumed that two separate issues were related to each other. However, they are unrelated. I created this one specifically addressing the Focus trap problem, while keeping the original issue for the Base UI Modal demo. Please note that the issue only occurs in the Firefox browser; it works fine in Google Chrome.

Your environment 🌎

npx @mui/envinfo

Firefox Browser version 115.0.1 (64-bit)

[divyammadhok]

@ZeeshanTamboli I would definitely like to jump in and help in this bug if others don't have the bandwidth for it.

[ZeeshanTamboli]

@divyammadhok Thanks. Feel free to work on it.

[divyammadhok]

Hey @ZeeshanTamboli Please have a look at this PR, in the description I've highlighted 2 ways we can go with this, and have implemented solution #1 as well.

[gitstart]

We are currently working on this @ZeeshanTamboli, we'll be pushing a PR shortly.

[ZeeshanTamboli]

Reason for closing - #37891 (comment)