Type LGraphNode.onDragOver/onDragDrop (#2389)

src/scripts/app.ts

@@ -422,7 +422,6 @@ export class ComfyApp {
       this.dragOverNode = null
       // Node handles file drop, we dont use the built in onDropFile handler as its buggy
       // If you drag multiple files it will call it multiple times with the same file
-      // @ts-expect-error This is not a standard event. TODO fix it.
       if (n && n.onDragDrop && (await n.onDragDrop(event))) {
         return
       }
@@ -462,7 +461,6 @@ export class ComfyApp {
         this.canvas.adjustMouseEvent(e)
         const node = this.graph.getNodeOnPos(e.canvasX, e.canvasY)
         if (node) {
-          // @ts-expect-error This is not a standard event. TODO fix it.
           if (node.onDragOver && node.onDragOver(e)) {
             this.dragOverNode = node
 

src/scripts/widgets.ts

@@ -707,8 +707,7 @@ export const ComfyWidgets: Record<string, ComfyWidgetConstructor> = {
     uploadWidget.serialize = false
 
     // Add handler to check if an image is being dragged over our node
-    // @ts-expect-error
-    node.onDragOver = function (e) {
+    node.onDragOver = function (e: DragEvent) {
       if (e.dataTransfer && e.dataTransfer.items) {
         const image = [...e.dataTransfer.items].find((f) => f.kind === 'file')
         return !!image
@@ -718,8 +717,7 @@ export const ComfyWidgets: Record<string, ComfyWidgetConstructor> = {
     }
 
     // On drop upload files
-    // @ts-expect-error
-    node.onDragDrop = function (e) {
+    node.onDragDrop = function (e: DragEvent) {
       console.log('onDragDrop called')
       let handled = false
       for (const file of e.dataTransfer.files) {

src/types/litegraph-augmentation.d.ts

@@ -51,6 +51,20 @@ declare module '@comfyorg/litegraph' {
     applyToGraph?(extraLinks?: LLink[]): void
     updateLink?(link: LLink): LLink | null
     onExecutionStart?(): unknown
+    /**
+     * Callback invoked when the node is dragged over from an external source, i.e.
+     * a file or another HTML element.
+     * @param e The drag event
+     * @returns {boolean} True if the drag event should be handled by this node, false otherwise
+     */
+    onDragOver?(e: DragEvent): boolean
+    /**
+     * Callback invoked when the node is dropped from an external source, i.e.
+     * a file or another HTML element.
+     * @param e The drag event
+     * @returns {boolean} True if the drag event should be handled by this node, false otherwise
+     */
+    onDragDrop?(e: DragEvent): Promise<boolean> | boolean
 
     index?: number
     runningInternalNodeId?: NodeId