Fix mode switch

browser_tests/tests/commandSearchBox.spec.ts

@@ -118,18 +118,15 @@ test.describe('Command search box', () => {
     expect(nodesAfter).toBe(0)
   })
 
-  test.skip('Returns to node search when removing ">"', async ({
-    comfyPage
-  }) => {
+  test('Returns to node search when removing ">"', async ({ comfyPage }) => {
     await comfyPage.doubleClickCanvas()
 
     // Enter command mode
     await comfyPage.searchBox.input.fill('>')
     await expect(comfyPage.page.locator('.filter-button')).not.toBeVisible()
 
-    // Return to node search by clearing input and triggering search
-    await comfyPage.searchBox.input.clear()
-    await comfyPage.searchBox.input.press('Backspace') // Trigger search event
+    // Return to node search by filling with empty string to trigger search
+    await comfyPage.searchBox.input.fill('')
 
     // Small wait for UI update
     await comfyPage.page.waitForTimeout(200)

src/components/searchbox/NodeSearchBox.vue

@@ -54,6 +54,7 @@
       @complete="search($event.query)"
       @option-select="onOptionSelect($event.value)"
       @focused-option-changed="setHoverSuggestion($event)"
+      @input="handleInput"
     >
       <template #option="{ option }">
         <CommandSearchItem
@@ -241,4 +242,19 @@ const getOptionLabel = (
   }
   return option.label || option.id
 }
+
+/**
+ * Handles direct input changes on the AutoCompletePlus component.
+ * This ensures search mode switching works properly when users clear the input
+ * or modify it directly, as the @complete event may not always trigger.
+ *
+ * @param event - The input event from the AutoCompletePlus component
+ */
+const handleInput = (event: Event) => {
+  const target = event.target as HTMLInputElement
+  const inputValue = target.value
+
+  // Trigger search to handle mode switching between node and command search
+  search(inputValue)
+}
 </script>