From aca81a99c8d69010e4baf37658dbee2e95f6101c Mon Sep 17 00:00:00 2001
From: filtered <176114999+webfiltered@users.noreply.github.com>
Date: Tue, 4 Mar 2025 04:42:00 +1100
Subject: [PATCH] Fix regression in legacy search (#698)

- Resolves https://github.com/Comfy-Org/ComfyUI_frontend/issues/2828
- Issue caused by earlier instantiation of `input` object
---
 src/LGraphCanvas.ts | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/src/LGraphCanvas.ts b/src/LGraphCanvas.ts
index 011240ebe..b2c311ceb 100644
--- a/src/LGraphCanvas.ts
+++ b/src/LGraphCanvas.ts
@@ -6061,12 +6061,6 @@ export class LGraphCanvas implements ConnectionColorContext {
     const canvas = graphcanvas.canvas
     const root_document = canvas.ownerDocument || document
 
-    const input = Object.assign(document.createElement("input"), {
-      autofocus: true,
-      type: "text",
-      className: "value rounded",
-    } satisfies Partial<HTMLInputElement>)
-
     const div = document.createElement("div")
     const dialog = Object.assign(div, {
       close(this: typeof div) {
@@ -6076,14 +6070,12 @@ export class LGraphCanvas implements ConnectionColorContext {
         root_document.body.style.overflow = ""
 
         // important, if canvas loses focus keys wont be captured
-        setTimeout(canvas.focus, 20)
+        setTimeout(() => canvas.focus(), 20)
         dialog.remove()
       },
     } satisfies Partial<HTMLDivElement> & ICloseable)
     dialog.className = "litegraph litesearchbox graphdialog rounded"
-    dialog.innerHTML = "<span class='name'>Search</span> "
-    dialog.append(input)
-
+    dialog.innerHTML = "<span class='name'>Search</span> <input autofocus type='text' class='value rounded'/>"
     if (options.do_type_filter) {
       dialog.innerHTML += "<select class='slot_in_type_filter'><option value=''></option></select>"
       dialog.innerHTML += "<select class='slot_out_type_filter'><option value=''></option></select>"
@@ -6163,6 +6155,11 @@ export class LGraphCanvas implements ConnectionColorContext {
     let timeout: ReturnType<typeof setTimeout> | null = null
     let selected: ChildNode | null = null
 
+    const maybeInput = dialog.querySelector("input")
+    if (!maybeInput) throw new TypeError("Could not create search input box.")
+
+    const input = maybeInput
+
     if (input) {
       input.addEventListener("blur", function () {
         this.focus()