fix groups dragging children with control held (#12867)

When control is held, an active drag operation should cease applying
movements to nodes contained by selected groups. This functionality was
broken in vue mode because of unnecessary reimplementation of the code
for calculating items contained by groups during drag operations

Author: AustinMroz

browser_tests/tests/vueNodes/groups/groups.spec.ts

@@ -177,6 +177,30 @@ test.describe('Vue Node Groups', { tag: ['@screenshot', '@vue-nodes'] }, () => {
     }).toPass({ timeout: 5000 })
   })
 
+  test('does not drag contents when control is held', async ({ comfyPage }) => {
+    await comfyPage.keyboard.selectAll()
+    await comfyPage.page.keyboard.press(CREATE_GROUP_HOTKEY)
+    const groupCount = () => comfyPage.page.evaluate(() => graph!.groups.length)
+    await expect.poll(groupCount, 'create group').toBe(1)
+    await comfyPage.page.mouse.click(100, 100)
+
+    const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
+    const initialNodeBounds = await ksampler.boundingBox()
+    expect(initialNodeBounds).toBeTruthy()
+
+    const groupPos = await getGroupTitlePosition(comfyPage, 'Group')
+    await comfyPage.page.mouse.move(groupPos.x, groupPos.y)
+    await comfyPage.page.mouse.down()
+    await comfyPage.page.keyboard.down('Control')
+    await comfyPage.page.mouse.move(groupPos.x + 100, groupPos.y)
+    await comfyPage.page.mouse.up()
+    await comfyPage.page.keyboard.up('Control')
+    await expect
+      .poll(() => getGroupTitlePosition(comfyPage, 'Group'))
+      .not.toEqual(groupPos)
+    expect(await ksampler.boundingBox()).toEqual(initialNodeBounds)
+  })
+
   test('should keep groups aligned after loading legacy Vue workflows', async ({
     comfyPage
   }) => {

src/lib/litegraph/src/LGraphCanvas.ts

@@ -8931,71 +8931,20 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
     }
   }
 
-  /**
-   * Collect all nodes that are children of groups in the selection
-   */
-  private collectNodesInGroups(items: Set<Positionable>): Set<LGraphNode> {
-    const nodesInGroups = new Set<LGraphNode>()
-    for (const item of items) {
-      if (item instanceof LGraphGroup) {
-        for (const child of item._children) {
-          if (child instanceof LGraphNode) {
-            nodesInGroups.add(child)
-          }
-        }
-      }
-    }
-    return nodesInGroups
-  }
-
-  /**
-   * Move group children (both nodes and non-nodes)
-   */
-  private moveGroupChildren(
-    group: LGraphGroup,
-    deltaX: number,
-    deltaY: number,
-    nodesToMove: Array<{ node: LGraphNode; newPos: { x: number; y: number } }>
-  ): void {
-    for (const child of group._children) {
-      if (child instanceof LGraphNode) {
-        const node = child as LGraphNode
-        nodesToMove.push({
-          node,
-          newPos: this.calculateNewPosition(node, deltaX, deltaY)
-        })
-      } else if (!(child instanceof LGraphGroup)) {
-        // Non-node, non-group children (reroutes, etc.)
-        // Skip groups here - they're already in allItems and will be
-        // processed in the main loop of moveChildNodesInGroupVueMode
-        child.move(deltaX, deltaY, true)
-      }
-    }
-  }
-
   moveChildNodesInGroupVueMode(
     allItems: Set<Positionable>,
     deltaX: number,
     deltaY: number
   ) {
-    const nodesInMovingGroups = this.collectNodesInGroups(allItems)
     const nodesToMove: NewNodePosition[] = []
 
     // First, collect all the moves we need to make
     for (const item of allItems) {
-      const isNode = item instanceof LGraphNode
-      if (isNode) {
-        const node = item as LGraphNode
-        if (nodesInMovingGroups.has(node)) {
-          continue
-        }
+      if (item instanceof LGraphNode) {
         nodesToMove.push({
-          node,
-          newPos: this.calculateNewPosition(node, deltaX, deltaY)
+          node: item,
+          newPos: this.calculateNewPosition(item, deltaX, deltaY)
         })
-      } else if (item instanceof LGraphGroup) {
-        item.move(deltaX, deltaY, true)
-        this.moveGroupChildren(item, deltaX, deltaY, nodesToMove)
       } else {
         // Other items (reroutes, etc.)
         item.move(deltaX, deltaY, true)