From 9988fb8f1e15e197866e86cf52030014dd50b55e Mon Sep 17 00:00:00 2001
From: Chenlei Hu <huchenlei@proton.me>
Date: Tue, 25 Mar 2025 15:27:25 -0400
Subject: [PATCH] [Bug] Fix selection toolbox select+drag (#3235)

Co-authored-by: github-actions <github-actions@github.com>
---
 browser_tests/tests/selectionToolbox.spec.ts | 17 +++++++++++++++++
 src/components/graph/SelectionOverlay.vue    |  7 ++++++-
 src/locales/es/nodeDefs.json                 |  3 +++
 3 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/browser_tests/tests/selectionToolbox.spec.ts b/browser_tests/tests/selectionToolbox.spec.ts
index 6bc713b782..6aa891fa08 100644
--- a/browser_tests/tests/selectionToolbox.spec.ts
+++ b/browser_tests/tests/selectionToolbox.spec.ts
@@ -53,6 +53,23 @@ test.describe('Selection Toolbox', () => {
     expect(Math.round(boundingBox!.y)).toBeCloseTo(60, -1)
   })
 
+  test('hide when select and drag happen at the same time', async ({
+    comfyPage
+  }) => {
+    await comfyPage.loadWorkflow('single_ksampler')
+    const node = (await comfyPage.getNodeRefsByTitle('KSampler'))[0]
+    const nodePos = await node.getPosition()
+
+    // Drag on the title of the node
+    await comfyPage.page.mouse.move(nodePos.x + 100, nodePos.y - 15)
+    await comfyPage.page.mouse.down()
+    await comfyPage.page.mouse.move(nodePos.x + 200, nodePos.y + 200)
+    await comfyPage.nextFrame()
+    await expect(
+      comfyPage.page.locator('.selection-overlay-container')
+    ).not.toBeVisible()
+  })
+
   test('shows border only with multiple selections', async ({ comfyPage }) => {
     // Select single node
     await comfyPage.selectNodes(['KSampler'])
diff --git a/src/components/graph/SelectionOverlay.vue b/src/components/graph/SelectionOverlay.vue
index 5f13aedb88..13e16cfea2 100644
--- a/src/components/graph/SelectionOverlay.vue
+++ b/src/components/graph/SelectionOverlay.vue
@@ -91,7 +91,12 @@ watch(
         positionSelectionOverlay(canvasStore.canvas as LGraphCanvas)
       }, 100)
     } else {
-      visible.value = false
+      // Selection change update to visible state is delayed by a frame. Here
+      // we also delay a frame so that the order of events is correct when
+      // the initial selection and dragging happens at the same time.
+      requestAnimationFrame(() => {
+        visible.value = false
+      })
     }
   }
 )
diff --git a/src/locales/es/nodeDefs.json b/src/locales/es/nodeDefs.json
index d331990b31..3bc03c2631 100644
--- a/src/locales/es/nodeDefs.json
+++ b/src/locales/es/nodeDefs.json
@@ -3064,6 +3064,9 @@
       "extra_pos_embedder_": {
         "name": "extra_pos_embedder."
       },
+      "final_layer_": {
+        "name": "capa_final."
+      },
       "model1": {
         "name": "model1"
       },