diff --git a/browser_tests/tests/vueNodes/widgets/widgetReactivity.spec.ts b/browser_tests/tests/vueNodes/widgets/widgetReactivity.spec.ts index 11c8b646ec..cd505dbe21 100644 --- a/browser_tests/tests/vueNodes/widgets/widgetReactivity.spec.ts +++ b/browser_tests/tests/vueNodes/widgets/widgetReactivity.spec.ts @@ -55,4 +55,24 @@ test.describe('Vue Widget Reactivity', { tag: '@vue-nodes' }, () => { }) await expect(loadCheckpointNode).toHaveCount(3) }) + + test('Can load dynamic combos', async ({ comfyPage }) => { + await comfyPage.searchBoxV2.addNode('Resize Image/Mask') + const widgetTuple = ['Resize Image/Mask', 'resize_type'] as const + const widget = comfyPage.vueNodes.getWidgetByName(...widgetTuple) + + await test.step('Update value of the dynamic combo widget', async () => { + await comfyPage.vueNodes.selectComboOption(...widgetTuple, 'scale width') + await expect(widget).toHaveText('scale width') + }) + + await test.step('Swap to a different workflow and back', async () => { + await comfyPage.menu.topbar.newWorkflowButton.click() + await expect(widget).toBeHidden() + await comfyPage.menu.topbar.getTab(0).click() + await expect(widget).toBeVisible() + }) + + await expect(widget, 'Widget has restored value').toHaveText('scale width') + }) }) diff --git a/src/core/graph/widgets/dynamicWidgets.ts b/src/core/graph/widgets/dynamicWidgets.ts index 0df86bc377..0a304c07f1 100644 --- a/src/core/graph/widgets/dynamicWidgets.ts +++ b/src/core/graph/widgets/dynamicWidgets.ts @@ -11,6 +11,7 @@ import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode' import { LiteGraph } from '@/lib/litegraph/src/litegraph' import type { LLink } from '@/lib/litegraph/src/LLink' import { commonType } from '@/lib/litegraph/src/utils/type' +import { resolveNodeRootGraphId } from '@/lib/litegraph/src/utils/widget' import { transformInputSpecV1ToV2 } from '@/schemas/nodeDef/migration' import type { ComboInputSpec, InputSpec } from '@/schemas/nodeDefSchema' import type { InputSpec as InputSpecV2 } from '@/schemas/nodeDef/nodeDefSchemaV2' @@ -22,6 +23,7 @@ import { import { useLitegraphService } from '@/services/litegraphService' import { app } from '@/scripts/app' import type { ComfyApp } from '@/scripts/app' +import { useWidgetValueStore } from '@/stores/widgetValueStore' const INLINE_INPUTS = false @@ -185,11 +187,18 @@ function dynamicComboWidget( //A little hacky, but onConfigure won't work. //It fires too late and is overly disruptive let widgetValue = widget.value + const getState = () => { + const graphId = resolveNodeRootGraphId(node) + if (!graphId) return undefined + return useWidgetValueStore().getWidget(graphId, node.id, widget.name) + } Object.defineProperty(widget, 'value', { get() { - return widgetValue + return getState()?.value ?? widgetValue }, set(value) { + const state = getState() + if (state) state.value = value widgetValue = value updateWidgets(value) }