Merge branch 'main' into fix/sync-node-imgs-legacy-context-menu

browser_tests/tests/vueNodes/interactions/node/bringToFront.spec.ts

@@ -5,11 +5,11 @@ import {
 import type { ComfyPage } from '../../../../fixtures/ComfyPage'
 import { fitToViewInstant } from '../../../../helpers/fitToView'
 
-test.describe('Vue Node Bring to Front', () => {
+test.describe('Vue Node Bring to Front', { tag: '@screenshot' }, () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.loadWorkflow('vueNodes/simple-triple')
+    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
+    await comfyPage.workflow.loadWorkflow('vueNodes/simple-triple')
     await comfyPage.vueNodes.waitForNodes()
     await fitToViewInstant(comfyPage)
   })
@@ -61,7 +61,7 @@ test.describe('Vue Node Bring to Front', () => {
     if (!ksamplerHeader) throw new Error('KSampler header not found')
 
     // Drag KSampler on top of CLIP Text Encode
-    await comfyPage.dragAndDrop(
+    await comfyPage.canvasOps.dragAndDrop(
       { x: ksamplerHeader.x + 50, y: ksamplerHeader.y + 10 },
       clipCenter
     )
@@ -108,7 +108,7 @@ test.describe('Vue Node Bring to Front', () => {
     const vaeHeader = await comfyPage.page.getByText('VAE Decode').boundingBox()
     if (!vaeHeader) throw new Error('VAE Decode header not found')
 
-    await comfyPage.dragAndDrop(
+    await comfyPage.canvasOps.dragAndDrop(
       { x: vaeHeader.x + 50, y: vaeHeader.y + 10 },
       { x: clipCenter.x - 50, y: clipCenter.y }
     )

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -1,13 +1,13 @@
 import {
-  type ComfyPage,
   comfyExpect as expect,
   comfyPageFixture as test
 } from '../../../../fixtures/ComfyPage'
+import type { ComfyPage } from '../../../../fixtures/ComfyPage'
 import type { Position } from '../../../../fixtures/types'
 
 test.describe('Vue Node Moving', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
     await comfyPage.vueNodes.waitForNodes()
   })
 
@@ -29,39 +29,47 @@ test.describe('Vue Node Moving', () => {
     expect(diffY).toBeGreaterThan(0)
   }
 
-  test('should allow moving nodes by dragging', async ({ comfyPage }) => {
-    const loadCheckpointHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await comfyPage.dragAndDrop(loadCheckpointHeaderPos, {
-      x: 256,
-      y: 256
-    })
+  test(
+    'should allow moving nodes by dragging',
+    { tag: '@screenshot' },
+    async ({ comfyPage }) => {
+      const loadCheckpointHeaderPos =
+        await getLoadCheckpointHeaderPos(comfyPage)
+      await comfyPage.canvasOps.dragAndDrop(loadCheckpointHeaderPos, {
+        x: 256,
+        y: 256
+      })
 
-    const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
+      const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
+      await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
 
-    await expect(comfyPage.canvas).toHaveScreenshot('vue-node-moved-node.png')
-  })
+      await expect(comfyPage.canvas).toHaveScreenshot('vue-node-moved-node.png')
+    }
+  )
 
-  test('@mobile should allow moving nodes by dragging on touch devices', async ({
-    comfyPage
-  }) => {
-    // Disable minimap (gets in way of the node on small screens)
-    await comfyPage.setSetting('Comfy.Minimap.Visible', false)
+  test(
+    '@mobile should allow moving nodes by dragging on touch devices',
+    { tag: '@screenshot' },
+    async ({ comfyPage }) => {
+      // Disable minimap (gets in way of the node on small screens)
+      await comfyPage.settings.setSetting('Comfy.Minimap.Visible', false)
 
-    const loadCheckpointHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await comfyPage.panWithTouch(
-      {
-        x: 64,
-        y: 64
-      },
-      loadCheckpointHeaderPos
-    )
+      const loadCheckpointHeaderPos =
+        await getLoadCheckpointHeaderPos(comfyPage)
+      await comfyPage.canvasOps.panWithTouch(
+        {
+          x: 64,
+          y: 64
+        },
+        loadCheckpointHeaderPos
+      )
 
-    const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
+      const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
+      await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
 
-    await expect(comfyPage.canvas).toHaveScreenshot(
-      'vue-node-moved-node-touch.png'
-    )
-  })
+      await expect(comfyPage.canvas).toHaveScreenshot(
+        'vue-node-moved-node-touch.png'
+      )
+    }
+  )
 })

browser_tests/tests/vueNodes/interactions/node/remove.spec.ts

@@ -3,14 +3,14 @@ import { expect } from '@playwright/test'
 import { comfyPageFixture as test } from '../../../../fixtures/ComfyPage'
 
 test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
+  await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
 })
 
 test.describe('Vue Nodes - Delete Key Interaction', () => {
   test.beforeEach(async ({ comfyPage }) => {
     // Enable Vue nodes rendering
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.setSetting('Comfy.Graph.CanvasMenu', false)
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
+    await comfyPage.settings.setSetting('Comfy.Graph.CanvasMenu', false)
     await comfyPage.setup()
   })
 
@@ -24,7 +24,7 @@ test.describe('Vue Nodes - Delete Key Interaction', () => {
     expect(initialNodeCount).toBeGreaterThan(0)
 
     // Select all Vue nodes
-    await comfyPage.ctrlA()
+    await comfyPage.keyboard.selectAll()
 
     // Verify all Vue nodes are selected
     const selectedCount = await comfyPage.vueNodes.getSelectedNodeCount()
@@ -83,7 +83,7 @@ test.describe('Vue Nodes - Delete Key Interaction', () => {
   test('Delete key does not delete node when typing in Vue node widgets', async ({
     comfyPage
   }) => {
-    const initialNodeCount = await comfyPage.getGraphNodesCount()
+    const initialNodeCount = await comfyPage.nodeOps.getGraphNodesCount()
 
     // Find a text input widget in a Vue node
     const textWidget = comfyPage.page
@@ -98,7 +98,7 @@ test.describe('Vue Nodes - Delete Key Interaction', () => {
     await textWidget.press('Delete')
 
     // Node count should remain the same
-    const finalNodeCount = await comfyPage.getGraphNodesCount()
+    const finalNodeCount = await comfyPage.nodeOps.getGraphNodesCount()
     expect(finalNodeCount).toBe(initialNodeCount)
   })
 

browser_tests/tests/vueNodes/interactions/node/rename.spec.ts

@@ -2,11 +2,12 @@ import {
   comfyExpect as expect,
   comfyPageFixture as test
 } from '../../../../fixtures/ComfyPage'
+import { TestIds } from '../../../../fixtures/selectors'
 
 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.settings.setSetting('Comfy.Graph.CanvasMenu', false)
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
     await comfyPage.setup()
     await comfyPage.vueNodes.waitForNodes()
   })
@@ -46,7 +47,9 @@ test.describe('Vue Nodes Renaming', () => {
     if (!nodeBbox) throw new Error('Node not found')
     await loadCheckpointNode.dblclick()
 
-    const editingTitleInput = comfyPage.page.getByTestId('node-title-input')
+    const editingTitleInput = comfyPage.page.getByTestId(
+      TestIds.node.titleInput
+    )
     await expect(editingTitleInput).not.toBeVisible()
   })
 })

browser_tests/tests/vueNodes/interactions/node/resize.spec.ts

@@ -5,7 +5,7 @@ import {
 
 test.describe('Vue Node Resizing', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
     await comfyPage.vueNodes.waitForNodes()
   })
 

browser_tests/tests/vueNodes/interactions/node/select.spec.ts

@@ -4,12 +4,12 @@ import {
 } from '../../../../fixtures/ComfyPage'
 
 test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
+  await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
 })
 
 test.describe('Vue Node Selection', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
+    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
     await comfyPage.vueNodes.waitForNodes()
   })
 
@@ -78,7 +78,7 @@ test.describe('Vue Node Selection', () => {
     const initialPos = await checkpointNodeHeader.boundingBox()
     if (!initialPos) throw new Error('Failed to get header position')
 
-    await comfyPage.dragAndDrop(
+    await comfyPage.canvasOps.dragAndDrop(
       { x: initialPos.x + 10, y: initialPos.y + 10 },
       { x: initialPos.x + 100, y: initialPos.y + 100 }
     )