molecule-ai/molecule-core
41
0
Fork 2
Code Issues 66 Pull Requests 45 Actions 361 Packages Projects Releases Wiki Activity

fix(canvas): guard querySelectorAll in ThemeToggle handleKeyDown #1001

Merged
devops-engineer merged 1 commits from fix/2088-themetoggle-queryselectorall-errors into main 2026-05-14 13:13:21 +00:00
Conversation 8 Commits 1 Files Changed 1 +11 -2
1 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
canvas/src/components/ThemeToggle.tsx
View File

@ -66,8 +66,17 @@ export function ThemeToggle({ className = "" }: { className?: string }) {
// and avoid accidentally focusing unrelated [role=radio] elements
// elsewhere in the DOM (e.g. React Flow canvas nodes).
const radiogroup = e.currentTarget.closest("[role=radiogroup]") as HTMLElement | null;
const btns = radiogroup?.querySelectorAll<HTMLButtonElement>("> [role=radio]");
btns?.[next]?.focus();
if (!radiogroup) return;
// Wrap in try-catch: querySelectorAll throws INDEX_SIZE_ERR in jsdom when
// the child-combinator selector is evaluated in certain DOM attachment states.
try {
const btns = radiogroup.querySelectorAll<HTMLButtonElement>("> [role=radio]");
btns?.[next]?.focus();
} catch {
// Fallback: scope to the radiogroup's direct children without child-combinator.
const allBtns = radiogroup.querySelectorAll<HTMLButtonElement>("[role=radio]");
allBtns?.[next]?.focus();
}
},
[]
);