From fa48fe587d6fa48fe3ac7e1c03888e67df7d766e Mon Sep 17 00:00:00 2001
From: Fahd Arafat <fahdarft@gmail.com>
Date: Sun, 15 Dec 2024 22:50:32 +0200
Subject: [PATCH] forward mouse events from textareas to canvas (#1911)

* forward mouse events from textareas to canvas

* use arrow functions

* Apply suggestions from code review

Use pointer events instead of mouse to get extended properties
Remove workaround (only required due to missing extended properties)

* Apply code review - Adjust UX

- Do not prevent middle click from hitting DOM widgets
- Allow middle click and drag to continue functioning if another button is held down

---------

Co-authored-by: filtered <176114999+webfiltered@users.noreply.github.com>
---
 src/scripts/widgets.ts | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/scripts/widgets.ts b/src/scripts/widgets.ts
index 8013f08b1..fc180deb0 100644
--- a/src/scripts/widgets.ts
+++ b/src/scripts/widgets.ts
@@ -341,6 +341,24 @@ function addMultilineWidget(node, name: string, opts, app: ComfyApp) {
     widget.callback?.(widget.value)
   })
 
+  inputEl.addEventListener('pointerdown', (event: PointerEvent) => {
+    if (event.button === 1) {
+      app.canvas.processMouseDown(event)
+    }
+  })
+
+  inputEl.addEventListener('pointermove', (event: PointerEvent) => {
+    if ((event.buttons & 4) === 4) {
+      app.canvas.processMouseMove(event)
+    }
+  })
+
+  inputEl.addEventListener('pointerup', (event: PointerEvent) => {
+    if (event.button === 1) {
+      app.canvas.processMouseUp(event)
+    }
+  })
+
   return { minWidth: 400, minHeight: 200, widget }
 }