Trap keyboard navigation inside of the dialogs popup (#4032)

* test(dialoghost): add failing test for the focus not being trapped inside of the dialogs popup

* fix(dialoghost): trap focus inside of the dialogs popup

* test(dialoghost): stabilize focus tests by using Wait.For

Replace fixed Task.Delay calls with polling assertions to improve test reliability during focus transitions.

Fixes #4027

---------

Co-authored-by: corvinsz <[email protected]>
Co-authored-by: Kevin Bost <[email protected]>

Author: 3 people

src/MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.DialogHost.xaml

@@ -452,6 +452,7 @@
                         Focusable="True"
                         Foreground="{DynamicResource MaterialDesign.Brush.Foreground}"
                         IsTabStop="False"
+                        KeyboardNavigation.TabNavigation="Cycle"
                         Opacity="0"
                         RenderTransformOrigin=".5,.5"
                         Tag="{TemplateBinding DialogBackground}"

tests/MaterialDesignThemes.UITests/WPF/DialogHosts/DialogHostTests.cs

@@ -4,7 +4,6 @@
 
 using static MaterialDesignThemes.UITests.MaterialDesignSpec;
 
-
 namespace MaterialDesignThemes.UITests.WPF.DialogHosts;
 
 public class DialogHostTests : TestBase
@@ -514,4 +513,66 @@ await Wait.For(async () =>
 
         recorder.Success();
     }
+
+    [Test]
+    [Description("Issue 4027")]
+    [Arguments("", new[] { Key.Tab })]
+    [Arguments("", new[] { Key.LeftShift, Key.Tab })]
+    [Arguments("MaterialDesignEmbeddedDialogHost", new[] { Key.Tab })]
+    [Arguments("MaterialDesignEmbeddedDialogHost", new[] { Key.LeftShift, Key.Tab })]
+    public async Task DialogHost_TrapsFocusInsidePopup_WhenTabbing(string dialogHostStyle, Key[] inputActions)
+    {
+        await using var recorder = new TestRecorder(App);
+
+        var dialogHost = await LoadXaml<DialogHost>("""
+    <materialDesign:DialogHost>
+        <Grid>
+            <StackPanel>
+                <TextBox />
+                <Button x:Name="btnOpenDialog"
+                        Content="Open dialog"
+                        Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}" />
+            </StackPanel>
+        </Grid>
+
+        <materialDesign:DialogHost.DialogContent>
+            <StackPanel Width="300">
+                <TextBox x:Name="TextBoxOne" />
+                <TextBox x:Name="TextBoxTwo" />
+            </StackPanel>
+        </materialDesign:DialogHost.DialogContent>
+    </materialDesign:DialogHost>
+    """);
+
+        if (!string.IsNullOrEmpty(dialogHostStyle))
+        {
+            await dialogHost.RemoteExecute(SetDialogHostStyle, dialogHostStyle);
+        }
+
+        var openDialogButton = await dialogHost.GetElement<Button>("btnOpenDialog");
+        var textBoxOne = await dialogHost.GetElement<TextBox>("TextBoxOne");
+        var textBoxTwo = await dialogHost.GetElement<TextBox>("TextBoxTwo");
+
+        await openDialogButton.LeftClick();
+
+        // By default the first focusable element should be focused
+        await Wait.For(async () => await Assert.That(await textBoxOne.GetIsFocused()).IsTrue());
+
+        await textBoxOne.SendInput(new KeyboardInput(inputActions));
+        
+        await Wait.For(async () => await Assert.That(await textBoxTwo.GetIsFocused()).IsTrue());
+
+        await textBoxTwo.SendInput(new KeyboardInput(inputActions));
+
+        await Wait.For(async () => await Assert.That(await textBoxOne.GetIsFocused()).IsTrue());
+
+        recorder.Success();
+
+        static object SetDialogHostStyle(DialogHost dialogHost, string styleName)
+        {
+            var style = (Style)dialogHost.FindResource(styleName);
+            dialogHost.Style = style;
+            return null!;
+        }
+    }
 }