mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 14:30:41 +00:00
fix: set topbar menus to non-modal so they dismiss on canvas interaction (#10310)
## Summary Set topbar menus to non-modal so they dismiss when clicking inputs/textareas inside nodes with Nodes 2.0 enabled. ## Changes - **What**: Add `:modal="false"` to `ContextMenuRoot` in WorkflowTab and `DropdownMenuRoot` in WorkflowActionsDropdown.  ## Review Focus Modal reka-ui menus set `body.pointer-events: none` and prevent `focusOutside` dismissal. With Nodes 2.0, widget components use `@pointerdown.capture.stop` to prevent node dragging, which also blocks reka-ui's document-level outside-click detection. Non-modal menus allow `focusin`-based dismissal, which is unaffected by pointerdown stopping. ## Testing An E2E regression test for this fix requires Nodes 2.0 to be explicitly enabled (feature-flag guarded), opening a specific topbar menu, and then clicking inside a canvas node's textarea — an interaction sequence that has no existing Playwright fixture/helper pattern in the codebase; the fix itself is a one-line :modal="false" attribute change on reka-ui primitives whose behavior is documented and tested upstream. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-10310-fix-set-topbar-menus-to-non-modal-so-they-dismiss-on-canvas-interaction-3286d73d3650815287d1c66c6ffd4814) by [Unito](https://www.unito.io) Co-authored-by: Amp <amp@ampcode.com>
This commit is contained in:
@@ -80,7 +80,11 @@ const tooltipPt = {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<DropdownMenuRoot v-model:open="dropdownOpen" @update:open="handleOpen">
|
||||
<DropdownMenuRoot
|
||||
v-model:open="dropdownOpen"
|
||||
:modal="false"
|
||||
@update:open="handleOpen"
|
||||
>
|
||||
<slot name="button" :has-unseen-items="hasUnseenItems">
|
||||
<div
|
||||
class="pointer-events-auto inline-flex items-center rounded-lg bg-secondary-background"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<ContextMenuRoot>
|
||||
<ContextMenuRoot :modal="false">
|
||||
<ContextMenuTrigger as-child>
|
||||
<div
|
||||
ref="workflowTabRef"
|
||||
|
||||
Reference in New Issue
Block a user