diff --git a/browser_tests/tests/maskEditor.spec.ts b/browser_tests/tests/maskEditor.spec.ts index badf78e6210..4c77bfba2ce 100644 --- a/browser_tests/tests/maskEditor.spec.ts +++ b/browser_tests/tests/maskEditor.spec.ts @@ -1,6 +1,10 @@ -import { expect } from '@playwright/test' +import { expect, mergeTests } from '@playwright/test' +import { ExecutionHelper } from '@e2e/fixtures/helpers/ExecutionHelper' import { maskEditorTest as test } from '@e2e/fixtures/helpers/MaskEditorHelper' +import { webSocketFixture } from '@e2e/fixtures/ws' + +const wstest = mergeTests(test, webSocketFixture) test.describe('Mask Editor', { tag: '@vue-nodes' }, () => { test( @@ -301,3 +305,39 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => { } ) }) + +wstest( + 'Will not use stale litegraph previews', + async ({ comfyPage, getWebSocket }) => { + const executionHelper = new ExecutionHelper(comfyPage, await getWebSocket()) + await comfyPage.menu.topbar.newWorkflowButton.click() + await comfyPage.searchBoxV2.addNode('Preview Image') + + async function getNodeOutput() { + return await comfyPage.page.evaluate( + () => graph!.getNodeById('1')!.images?.[0]?.filename + ) + } + + executionHelper.executed('', '1', { images: [{ filename: 'test1.png' }] }) + await comfyPage.page.evaluate(() => app!.canvas.setDirty(true)) + await expect.poll(getNodeOutput).toBe('test1.png') + + await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true) + + const resolvableFile = { filename: 'example.png', type: 'input' } + executionHelper.executed('', '1', { images: [resolvableFile] }) + await expect.poll(getNodeOutput).toBe('example.png') + + const node = await comfyPage.vueNodes.getFixtureByTitle('Preview Image') + await node.imagePreview.hover() + await node.imagePreview + .getByRole('button', { name: 'Edit or mask image' }) + .click() + + // On previous versions, attempting to open the mask editor here would + // incorrectly reference the non-existant test1.png + // This causes the mask editor to throw in setup and not display + await expect(comfyPage.page.locator('.mask-editor-dialog')).toBeVisible() + } +) diff --git a/src/stores/nodeOutputStore.ts b/src/stores/nodeOutputStore.ts index e8cc0752fb6..6764352d644 100644 --- a/src/stores/nodeOutputStore.ts +++ b/src/stores/nodeOutputStore.ts @@ -473,6 +473,9 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => { node.imgs = [element] node.imageIndex = activeIndex + + const outputs = getNodeOutputs(node) + if (outputs?.images) node.images = outputs.images } return {