diff --git a/browser_tests/tests/vueNodes/interactions/zoom.spec.ts b/browser_tests/tests/vueNodes/interactions/canvas/zoom.spec.ts similarity index 96% rename from browser_tests/tests/vueNodes/interactions/zoom.spec.ts rename to browser_tests/tests/vueNodes/interactions/canvas/zoom.spec.ts index b28caec40..b87309f10 100644 --- a/browser_tests/tests/vueNodes/interactions/zoom.spec.ts +++ b/browser_tests/tests/vueNodes/interactions/canvas/zoom.spec.ts @@ -1,7 +1,7 @@ import { comfyExpect as expect, comfyPageFixture as test -} from '../../../fixtures/ComfyPage' +} from '../../../../fixtures/ComfyPage' test.describe('Vue Nodes Zoom', () => { test.beforeEach(async ({ comfyPage }) => { diff --git a/browser_tests/tests/vueNodes/interactions/zoom.spec.ts-snapshots/zoomed-in-ctrl-shift-chromium-linux.png b/browser_tests/tests/vueNodes/interactions/canvas/zoom.spec.ts-snapshots/zoomed-in-ctrl-shift-chromium-linux.png similarity index 100% rename from browser_tests/tests/vueNodes/interactions/zoom.spec.ts-snapshots/zoomed-in-ctrl-shift-chromium-linux.png rename to browser_tests/tests/vueNodes/interactions/canvas/zoom.spec.ts-snapshots/zoomed-in-ctrl-shift-chromium-linux.png diff --git a/browser_tests/tests/vueNodes/linkInteraction.spec.ts b/browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts similarity index 97% rename from browser_tests/tests/vueNodes/linkInteraction.spec.ts rename to browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts index d6b1bccc1..531f25c7a 100644 --- a/browser_tests/tests/vueNodes/linkInteraction.spec.ts +++ b/browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts @@ -1,11 +1,11 @@ import type { Locator } from '@playwright/test' -import { getSlotKey } from '../../../src/renderer/core/layout/slots/slotIdentifier' +import { getSlotKey } from '../../../../../src/renderer/core/layout/slots/slotIdentifier' import { comfyExpect as expect, comfyPageFixture as test -} from '../../fixtures/ComfyPage' -import { fitToViewInstant } from '../../helpers/fitToView' +} from '../../../../fixtures/ComfyPage' +import { fitToViewInstant } from '../../../../helpers/fitToView' async function getCenter(locator: Locator): Promise<{ x: number; y: number }> { const box = await locator.boundingBox() diff --git a/browser_tests/tests/vueNodes/linkInteraction.spec.ts-snapshots/vue-node-dragging-link-chromium-linux.png b/browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts-snapshots/vue-node-dragging-link-chromium-linux.png similarity index 100% rename from browser_tests/tests/vueNodes/linkInteraction.spec.ts-snapshots/vue-node-dragging-link-chromium-linux.png rename to browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts-snapshots/vue-node-dragging-link-chromium-linux.png diff --git a/browser_tests/tests/vueNodes/deleteKeyInteraction.spec.ts b/browser_tests/tests/vueNodes/interactions/node/remove.spec.ts similarity index 98% rename from browser_tests/tests/vueNodes/deleteKeyInteraction.spec.ts rename to browser_tests/tests/vueNodes/interactions/node/remove.spec.ts index 51b52e7ce..e7a610643 100644 --- a/browser_tests/tests/vueNodes/deleteKeyInteraction.spec.ts +++ b/browser_tests/tests/vueNodes/interactions/node/remove.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test' -import { comfyPageFixture as test } from '../../fixtures/ComfyPage' +import { comfyPageFixture as test } from '../../../../fixtures/ComfyPage' test.beforeEach(async ({ comfyPage }) => { await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled') diff --git a/browser_tests/tests/vueNodes/interactions/node/rename.spec.ts b/browser_tests/tests/vueNodes/interactions/node/rename.spec.ts new file mode 100644 index 000000000..3984989e1 --- /dev/null +++ b/browser_tests/tests/vueNodes/interactions/node/rename.spec.ts @@ -0,0 +1,76 @@ +import { + comfyExpect as expect, + comfyPageFixture as test +} from '../../../../fixtures/ComfyPage' +import { VueNodeFixture } from '../../../../fixtures/utils/vueNodeFixtures' + +test.describe('Vue Nodes Renaming', () => { + test.beforeEach(async ({ comfyPage }) => { + await comfyPage.setSetting('Comfy.Graph.CanvasMenu', false) + await comfyPage.setSetting('Comfy.VueNodes.Enabled', true) + await comfyPage.setup() + }) + + test('should display node title', async ({ comfyPage }) => { + // Get the KSampler node from the default workflow + const nodes = await comfyPage.getNodeRefsByType('KSampler') + expect(nodes.length).toBeGreaterThanOrEqual(1) + + const node = nodes[0] + const vueNode = new VueNodeFixture(node, comfyPage.page) + + const title = await vueNode.getTitle() + expect(title).toBe('KSampler') + + // Verify title is visible in the header + const header = await vueNode.getHeader() + await expect(header).toContainText('KSampler') + }) + + test('should allow title renaming by double clicking on the node header', async ({ + comfyPage + }) => { + const nodes = await comfyPage.getNodeRefsByType('KSampler') + const node = nodes[0] + const vueNode = new VueNodeFixture(node, comfyPage.page) + + // Test renaming with Enter + await vueNode.setTitle('My Custom Sampler') + const newTitle = await vueNode.getTitle() + expect(newTitle).toBe('My Custom Sampler') + + // Verify the title is displayed + const header = await vueNode.getHeader() + await expect(header).toContainText('My Custom Sampler') + + // Test cancel with Escape + const titleElement = await vueNode.getTitleElement() + await titleElement.dblclick() + await comfyPage.nextFrame() + + // Type a different value but cancel + const input = (await vueNode.getHeader()).locator( + '[data-testid="node-title-input"]' + ) + await input.fill('This Should Be Cancelled') + await input.press('Escape') + await comfyPage.nextFrame() + + // Title should remain as the previously saved value + const titleAfterCancel = await vueNode.getTitle() + expect(titleAfterCancel).toBe('My Custom Sampler') + }) + + test('Double click node body does not trigger edit', async ({ + comfyPage + }) => { + const loadCheckpointNode = + comfyPage.vueNodes.getNodeByTitle('Load Checkpoint') + const nodeBbox = await loadCheckpointNode.boundingBox() + if (!nodeBbox) throw new Error('Node not found') + await loadCheckpointNode.dblclick() + + const editingTitleInput = comfyPage.page.getByTestId('node-title-input') + await expect(editingTitleInput).not.toBeVisible() + }) +}) diff --git a/browser_tests/tests/vueNodes/nodeInteractions/selectionState.spec.ts b/browser_tests/tests/vueNodes/interactions/node/select.spec.ts similarity index 97% rename from browser_tests/tests/vueNodes/nodeInteractions/selectionState.spec.ts rename to browser_tests/tests/vueNodes/interactions/node/select.spec.ts index 591c1d307..7ae859caf 100644 --- a/browser_tests/tests/vueNodes/nodeInteractions/selectionState.spec.ts +++ b/browser_tests/tests/vueNodes/interactions/node/select.spec.ts @@ -1,7 +1,7 @@ import { comfyExpect as expect, comfyPageFixture as test -} from '../../../fixtures/ComfyPage' +} from '../../../../fixtures/ComfyPage' test.beforeEach(async ({ comfyPage }) => { await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled') diff --git a/browser_tests/tests/vueNodes/NodeHeader.spec.ts b/browser_tests/tests/vueNodes/nodeStates/collapse.spec.ts similarity index 50% rename from browser_tests/tests/vueNodes/NodeHeader.spec.ts rename to browser_tests/tests/vueNodes/nodeStates/collapse.spec.ts index 83e6b8aae..a339a0a25 100644 --- a/browser_tests/tests/vueNodes/NodeHeader.spec.ts +++ b/browser_tests/tests/vueNodes/nodeStates/collapse.spec.ts @@ -1,80 +1,20 @@ import { comfyExpect as expect, comfyPageFixture as test -} from '../../fixtures/ComfyPage' -import { VueNodeFixture } from '../../fixtures/utils/vueNodeFixtures' +} from '../../../fixtures/ComfyPage' +import { VueNodeFixture } from '../../../fixtures/utils/vueNodeFixtures' -test.describe('NodeHeader', () => { +test.describe('Vue Node Collapse', () => { test.beforeEach(async ({ comfyPage }) => { - await comfyPage.setSetting('Comfy.UseNewMenu', 'Top') await comfyPage.setSetting('Comfy.Graph.CanvasMenu', false) await comfyPage.setSetting('Comfy.EnableTooltips', true) await comfyPage.setSetting('Comfy.VueNodes.Enabled', true) await comfyPage.setup() }) - test('displays node title', async ({ comfyPage }) => { - // Get the KSampler node from the default workflow - const nodes = await comfyPage.getNodeRefsByType('KSampler') - expect(nodes.length).toBeGreaterThanOrEqual(1) - - const node = nodes[0] - const vueNode = new VueNodeFixture(node, comfyPage.page) - - const title = await vueNode.getTitle() - expect(title).toBe('KSampler') - - // Verify title is visible in the header - const header = await vueNode.getHeader() - await expect(header).toContainText('KSampler') - }) - - test('allows title renaming', async ({ comfyPage }) => { - const nodes = await comfyPage.getNodeRefsByType('KSampler') - const node = nodes[0] - const vueNode = new VueNodeFixture(node, comfyPage.page) - - // Test renaming with Enter - await vueNode.setTitle('My Custom Sampler') - const newTitle = await vueNode.getTitle() - expect(newTitle).toBe('My Custom Sampler') - - // Verify the title is displayed - const header = await vueNode.getHeader() - await expect(header).toContainText('My Custom Sampler') - - // Test cancel with Escape - const titleElement = await vueNode.getTitleElement() - await titleElement.dblclick() - await comfyPage.nextFrame() - - // Type a different value but cancel - const input = (await vueNode.getHeader()).locator( - '[data-testid="node-title-input"]' - ) - await input.fill('This Should Be Cancelled') - await input.press('Escape') - await comfyPage.nextFrame() - - // Title should remain as the previously saved value - const titleAfterCancel = await vueNode.getTitle() - expect(titleAfterCancel).toBe('My Custom Sampler') - }) - - test('Double click node body does not trigger edit', async ({ + test('should allow collapsing node with collapse icon', async ({ comfyPage }) => { - const loadCheckpointNode = - comfyPage.vueNodes.getNodeByTitle('Load Checkpoint') - const nodeBbox = await loadCheckpointNode.boundingBox() - if (!nodeBbox) throw new Error('Node not found') - await loadCheckpointNode.dblclick() - - const editingTitleInput = comfyPage.page.getByTestId('node-title-input') - await expect(editingTitleInput).not.toBeVisible() - }) - - test('handles node collapsing', async ({ comfyPage }) => { // Get the KSampler node from the default workflow const nodes = await comfyPage.getNodeRefsByType('KSampler') const node = nodes[0] @@ -103,7 +43,7 @@ test.describe('NodeHeader', () => { expect(expandedSize.height).toBeGreaterThanOrEqual(collapsedSize.height) }) - test('shows collapse/expand icon state', async ({ comfyPage }) => { + test('should show collapse/expand icon state', async ({ comfyPage }) => { const nodes = await comfyPage.getNodeRefsByType('KSampler') const node = nodes[0] const vueNode = new VueNodeFixture(node, comfyPage.page) @@ -123,7 +63,9 @@ test.describe('NodeHeader', () => { expect(iconClass).toContain('pi-chevron-down') }) - test('preserves title when collapsing/expanding', async ({ comfyPage }) => { + test('should preserve title when collapsing/expanding', async ({ + comfyPage + }) => { const nodes = await comfyPage.getNodeRefsByType('KSampler') const node = nodes[0] const vueNode = new VueNodeFixture(node, comfyPage.page) diff --git a/browser_tests/tests/vueNodes/lod.spec.ts b/browser_tests/tests/vueNodes/nodeStates/lod.spec.ts similarity index 95% rename from browser_tests/tests/vueNodes/lod.spec.ts rename to browser_tests/tests/vueNodes/nodeStates/lod.spec.ts index 2ed598ef8..f8c94aba5 100644 --- a/browser_tests/tests/vueNodes/lod.spec.ts +++ b/browser_tests/tests/vueNodes/nodeStates/lod.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@playwright/test' -import { comfyPageFixture as test } from '../../fixtures/ComfyPage' +import { comfyPageFixture as test } from '../../../fixtures/ComfyPage' test.beforeEach(async ({ comfyPage }) => { await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled') diff --git a/browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-default-chromium-linux.png b/browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-default-chromium-linux.png similarity index 100% rename from browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-default-chromium-linux.png rename to browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-default-chromium-linux.png diff --git a/browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-lod-active-chromium-linux.png b/browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-lod-active-chromium-linux.png similarity index 100% rename from browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-lod-active-chromium-linux.png rename to browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-lod-active-chromium-linux.png diff --git a/browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-lod-inactive-chromium-linux.png b/browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-lod-inactive-chromium-linux.png similarity index 100% rename from browser_tests/tests/vueNodes/lod.spec.ts-snapshots/vue-nodes-lod-inactive-chromium-linux.png rename to browser_tests/tests/vueNodes/nodeStates/lod.spec.ts-snapshots/vue-nodes-lod-inactive-chromium-linux.png