Sync node help with selection and add watcher tests (#7105)

## Summary
- add a watcher to sync the node help panel with the currently selected
node
- add unit coverage for help auto-switching and guard cases

## Testing
- pnpm typecheck
- pnpm lint:fix
- pnpm exec vitest
tests-ui/tests/composables/graph/useSelectionState.test.ts

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7105-Sync-node-help-with-selection-and-add-watcher-tests-2bd6d73d36508140b5acd3f3c65c5680)
by [Unito](https://www.unito.io)
This commit is contained in:
Benjamin Lu
2025-12-19 20:51:10 -08:00
committed by GitHub
parent 68ccd683ad
commit f6bc10bb9d
5 changed files with 121 additions and 10 deletions

View File

@@ -19,14 +19,31 @@
</template>
<script setup lang="ts">
import { whenever } from '@vueuse/core'
import Button from 'primevue/button'
import NodeHelpContent from '@/components/node/NodeHelpContent.vue'
import { useSelectionState } from '@/composables/graph/useSelectionState'
import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
import { useNodeHelpStore } from '@/stores/workspace/nodeHelpStore'
const { node } = defineProps<{ node: ComfyNodeDefImpl }>()
defineEmits<{
(e: 'close'): void
}>()
const nodeHelpStore = useNodeHelpStore()
const { nodeDef } = useSelectionState()
// Keep the open help page synced with the current selection while help is open.
whenever(
() => (nodeHelpStore.isHelpOpen ? nodeDef.value : null),
(def) => {
if (!def) return
const currentHelpNode = nodeHelpStore.currentHelpNode
if (currentHelpNode?.nodePath === def.nodePath) return
nodeHelpStore.openHelp(def)
}
)
</script>

View File

@@ -105,12 +105,11 @@ export function useSelectionState() {
const isSidebarActive =
sidebarTabStore.activeSidebarTabId === nodeLibraryTabId
const currentHelpNode: any = nodeHelpStore.currentHelpNode
const currentHelpNode = nodeHelpStore.currentHelpNode
const isSameNodeHelpOpen =
isSidebarActive &&
nodeHelpStore.isHelpOpen &&
currentHelpNode &&
currentHelpNode.nodePath === def.nodePath
currentHelpNode?.nodePath === def.nodePath
if (isSameNodeHelpOpen) {
nodeHelpStore.closeHelp()