mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-01-26 19:09:52 +00:00
fix: context menu not opening when right-clicking different Vue nodes (#7644)
## Summary - Fixed issue where right-clicking on one Vue node then another would close the context menu instead of repositioning it - Added `showNodeOptions` function that always shows the menu at the new position (used for contextmenu events) - Kept `toggleNodeOptions` for the "More Options" button where toggle behavior is expected ## Test plan - [ ] Right-click on a Vue node to open context menu - [ ] Right-click on a different Vue node - menu should immediately show for the new node - [ ] Click "More Options" button when menu is open - should close the menu - [ ] Click "More Options" button when menu is closed - should open the menu https://github.com/user-attachments/assets/bb31c2e4-12b4-4786-96ac-23b1e2b4daa0 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7644-fix-context-menu-not-opening-when-right-clicking-different-Vue-nodes-2ce6d73d36508145bc30fe6947b6808a) by [Unito](https://www.unito.io)
This commit is contained in:
committed by
GitHub
parent
01a7c6ee54
commit
552452622d
@@ -263,7 +263,7 @@ function onMenuHide() {
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
registerNodeOptionsInstance({ toggle, hide, isOpen })
|
||||
registerNodeOptionsInstance({ toggle, show, hide, isOpen })
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
|
||||
@@ -55,11 +55,23 @@ export function toggleNodeOptions(event: Event) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the node options popover (always shows, doesn't toggle)
|
||||
* Use this for contextmenu events where we always want to show at the new position
|
||||
* @param event - The trigger event (must be MouseEvent for position)
|
||||
*/
|
||||
export function showNodeOptions(event: MouseEvent) {
|
||||
if (nodeOptionsInstance?.show) {
|
||||
nodeOptionsInstance.show(event)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Hide the node options popover
|
||||
*/
|
||||
interface NodeOptionsInstance {
|
||||
toggle: (event: Event) => void
|
||||
show: (event: MouseEvent) => void
|
||||
hide: () => void
|
||||
isOpen: Ref<boolean>
|
||||
}
|
||||
|
||||
@@ -136,7 +136,7 @@ import { computed, nextTick, onErrorCaptured, onMounted, ref, watch } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import type { VueNodeData } from '@/composables/graph/useGraphNodeManager'
|
||||
import { toggleNodeOptions } from '@/composables/graph/useMoreOptionsMenu'
|
||||
import { showNodeOptions } from '@/composables/graph/useMoreOptionsMenu'
|
||||
import { useErrorHandling } from '@/composables/useErrorHandling'
|
||||
import { st } from '@/i18n'
|
||||
import {
|
||||
@@ -290,7 +290,7 @@ const handleContextMenu = (event: MouseEvent) => {
|
||||
handleNodeRightClick(event as PointerEvent, nodeData.id)
|
||||
|
||||
// Show the node options menu at the cursor position
|
||||
toggleNodeOptions(event)
|
||||
showNodeOptions(event)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
Reference in New Issue
Block a user