[Bug]: Focus goes behind backdrop when Dialog closed via mouse click

[nigolaj]

trafficstars

Component

Dialog

Package version

9.54.13

React version

18.3.1

Environment

System: OS: Linux 6.10 Debian GNU/Linux 12 (bookworm) 12 (bookworm) CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1145G7 @ 2.60GHz Memory: 6.77 GB / 15.01 GB Container: Yes Shell: 5.2.15 - /bin/bash npmPackages: @fluentui/react-components: ^9.54.13 => 9.54.13 @types/react: ^18.3.3 => 18.3.4 @types/react-dom: ^18.3.0 => 18.3.0 react: ^18.3.1 => 18.3.1 react-dom: ^18.3.1 => 18.3.1

Current Behavior

Closing Dialog B opened via a Button from Dialog A causes focus to go behind Dialog A's backdrop despite useRestoreFocusTarget() being set on the Button. This renders form inputs in Dialog A unusable. The issue only manifests when Dialog B is closed with a mouse click, not Esc.

Expected Behavior

Closing Dialog B causes focus to go back to the Button in all cases.

Reproduction

https://stackblitz.com/edit/83wvqv-ndwglu?file=src%2Fexample.tsx

Steps to reproduce

Open BOTTOM dialog Open TOP dialog Close TOP dialog WITH A MOUSE CLICK (not keyboard) Attempt to focus the input in BOTTOM dialog Note how focus immediately goes behind BOTTOM dialog's backdrop

Are you reporting an Accessibility issue?

None

Suggested severity

Medium - Has workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [x] The provided reproduction is a minimal reproducible example of the bug.