diff --git a/browser_tests/fixtures/ComfyPage.ts b/browser_tests/fixtures/ComfyPage.ts index 2f6fc0b14..1c2fbd78c 100644 --- a/browser_tests/fixtures/ComfyPage.ts +++ b/browser_tests/fixtures/ComfyPage.ts @@ -762,7 +762,7 @@ export class ComfyPage { y: 625 } }) - this.page.mouse.move(10, 10) + await this.page.mouse.move(10, 10) await this.nextFrame() } @@ -774,7 +774,7 @@ export class ComfyPage { }, button: 'right' }) - this.page.mouse.move(10, 10) + await this.page.mouse.move(10, 10) await this.nextFrame() } @@ -1046,6 +1046,8 @@ export class ComfyPage { } } +export const testComfySnapToGridGridSize = 50 + export const comfyPageFixture = base.extend<{ comfyPage: ComfyPage comfyMouse: ComfyMouse @@ -1072,7 +1074,8 @@ export const comfyPageFixture = base.extend<{ 'Comfy.EnableTooltips': false, 'Comfy.userId': userId, // Set tutorial completed to true to avoid loading the tutorial workflow. - 'Comfy.TutorialCompleted': true + 'Comfy.TutorialCompleted': true, + 'Comfy.SnapToGrid.GridSize': testComfySnapToGridGridSize }) } catch (e) { console.error(e) diff --git a/browser_tests/tests/interaction.spec.ts b/browser_tests/tests/interaction.spec.ts index 552878a26..fc1b5e8e1 100644 --- a/browser_tests/tests/interaction.spec.ts +++ b/browser_tests/tests/interaction.spec.ts @@ -1,6 +1,12 @@ import { expect } from '@playwright/test' +import { Position } from '@vueuse/core' -import { type ComfyPage, comfyPageFixture as test } from '../fixtures/ComfyPage' +import { + type ComfyPage, + comfyPageFixture as test, + testComfySnapToGridGridSize +} from '../fixtures/ComfyPage' +import { type NodeReference } from '../fixtures/utils/litegraphUtils' test.describe('Item Interaction', () => { test('Can select/delete all items', async ({ comfyPage }) => { @@ -57,8 +63,10 @@ test.describe('Node Interaction', () => { await expect(comfyPage.canvas).toHaveScreenshot('selected-node2.png') }) - test('Can drag-select nodes with Meta (mac)', async ({ comfyPage }) => { - const clipNodes = await comfyPage.getNodeRefsByType('CLIPTextEncode') + const dragSelectNodes = async ( + comfyPage: ComfyPage, + clipNodes: NodeReference[] + ) => { const clipNode1Pos = await clipNodes[0].getPosition() const clipNode2Pos = await clipNodes[1].getPosition() const offset = 64 @@ -74,10 +82,67 @@ test.describe('Node Interaction', () => { } ) await comfyPage.page.keyboard.up('Meta') + } + + test('Can drag-select nodes with Meta (mac)', async ({ comfyPage }) => { + const clipNodes = await comfyPage.getNodeRefsByType('CLIPTextEncode') + await dragSelectNodes(comfyPage, clipNodes) expect(await comfyPage.getSelectedGraphNodesCount()).toBe( clipNodes.length ) }) + + test('Can move selected nodes using the Comfy.Canvas.MoveSelectedNodes.{Up|Down|Left|Right} commands', async ({ + comfyPage + }) => { + const clipNodes = await comfyPage.getNodeRefsByType('CLIPTextEncode') + const getPositions = () => + Promise.all(clipNodes.map((node) => node.getPosition())) + const testDirection = async ({ + direction, + expectedPosition + }: { + direction: string + expectedPosition: (originalPosition: Position) => Position + }) => { + const originalPositions = await getPositions() + await dragSelectNodes(comfyPage, clipNodes) + await comfyPage.executeCommand( + `Comfy.Canvas.MoveSelectedNodes.${direction}` + ) + await comfyPage.canvas.press(`Control+Arrow${direction}`) + const newPositions = await getPositions() + expect(newPositions).toEqual(originalPositions.map(expectedPosition)) + } + await testDirection({ + direction: 'Down', + expectedPosition: (originalPosition) => ({ + ...originalPosition, + y: originalPosition.y + testComfySnapToGridGridSize + }) + }) + await testDirection({ + direction: 'Right', + expectedPosition: (originalPosition) => ({ + ...originalPosition, + x: originalPosition.x + testComfySnapToGridGridSize + }) + }) + await testDirection({ + direction: 'Up', + expectedPosition: (originalPosition) => ({ + ...originalPosition, + y: originalPosition.y - testComfySnapToGridGridSize + }) + }) + await testDirection({ + direction: 'Left', + expectedPosition: (originalPosition) => ({ + ...originalPosition, + x: originalPosition.x - testComfySnapToGridGridSize + }) + }) + }) }) test('Can drag node', async ({ comfyPage }) => { diff --git a/src/components/dialog/content/manager/packBanner/PackBanner.vue b/src/components/dialog/content/manager/packBanner/PackBanner.vue index d7386cb54..f6b9e93cd 100644 --- a/src/components/dialog/content/manager/packBanner/PackBanner.vue +++ b/src/components/dialog/content/manager/packBanner/PackBanner.vue @@ -1,11 +1,37 @@