Fix trap initialFocus handling for nested trap content

Author: RtlZeroMemory

packages/core/src/runtime/__tests__/focus.traps.test.ts

@@ -171,6 +171,26 @@ describe("focus traps - finalizeFocusWithPreCollectedMetadata", () => {
     assert.equal(next.focusedId, "outside");
   });
 
+  test("empty trap focusables still honor valid initialFocus", () => {
+    const next = finalizeWith(
+      managerState({ focusedId: "outside" }),
+      ["outside", "nested-id"],
+      new Map<string, CollectedTrap>([
+        [
+          "modal",
+          trap({
+            id: "modal",
+            active: true,
+            initialFocus: "nested-id",
+            focusableIds: [],
+          }),
+        ],
+      ]),
+    );
+
+    assert.equal(next.focusedId, "nested-id");
+  });
+
   test("deactivation restores returnFocusTo when valid", () => {
     const prev = managerState({ focusedId: "inside", trapStack: Object.freeze(["modal"]) });
 
@@ -358,6 +378,34 @@ describe("focus traps - finalizeFocusForCommittedTreeWithZones integration", ()
     assert.deepEqual(next.trapStack, ["modal"]);
   });
 
+  test("empty trap focusables can still focus a valid nested initialFocus id", () => {
+    const tree: VNode = {
+      kind: "column",
+      props: {},
+      children: [
+        { kind: "button", props: { id: "outside", label: "Outside" } },
+        {
+          kind: "focusTrap",
+          props: { id: "modal", active: true, initialFocus: "nested-id" },
+          children: [
+            {
+              kind: "focusZone",
+              props: { id: "nested-zone", navigation: "linear" },
+              children: [{ kind: "button", props: { id: "nested-id", label: "Nested" } }],
+            },
+          ],
+        },
+      ],
+    };
+
+    const next = finalizeFocusForCommittedTreeWithZones(
+      createFocusManagerState(),
+      commitTree(tree),
+    );
+    assert.equal(next.focusedId, "nested-id");
+    assert.deepEqual(next.trapStack, ["modal"]);
+  });
+
   test("inactive trap does not capture focus", () => {
     const tree: VNode = {
       kind: "column",

packages/core/src/runtime/focus.ts

@@ -512,21 +512,19 @@ export function finalizeFocusWithPreCollectedMetadata(
     if (trap.active && !previousTrapStackSet.has(trapId)) {
       trapStack.push(trapId);
       const trapFocusables = trap.focusableIds;
-      if (trapFocusables.length > 0) {
-        const initialFocus = trap.initialFocus;
-        // initialFocus must resolve to an id contained by this trap.
-        if (
-          initialFocus !== null &&
-          trapFocusables.includes(initialFocus) &&
-          focusSet.has(initialFocus)
-        ) {
-          nextFocusedId = initialFocus;
-        } else {
-          // Invalid/missing initialFocus falls back to the first trap focusable.
-          const firstInTrap = trapFocusables[0];
-          if (firstInTrap !== undefined && focusSet.has(firstInTrap)) {
-            nextFocusedId = firstInTrap;
-          }
+      const initialFocus = trap.initialFocus;
+      const canApplyInitialFocus =
+        initialFocus !== null &&
+        focusSet.has(initialFocus) &&
+        (trapFocusables.length === 0 || trapFocusables.includes(initialFocus));
+
+      if (canApplyInitialFocus && initialFocus !== null) {
+        nextFocusedId = initialFocus;
+      } else if (trapFocusables.length > 0) {
+        // Invalid/missing initialFocus falls back to the first trap focusable.
+        const firstInTrap = trapFocusables[0];
+        if (firstInTrap !== undefined && focusSet.has(firstInTrap)) {
+          nextFocusedId = firstInTrap;
         }
       }
     }