Add support for node/input/output tooltips (#287)

* Add support for node/input/output tooltips

* pr feedback

* Remove

src/scripts/domWidget.ts

@@ -226,11 +226,8 @@ LGraphCanvas.prototype.computeVisibleNodes = function (): LGraphNode[] {
     if (elementWidgets.has(node)) {
       const hidden = visibleNodes.indexOf(node) === -1
       for (const w of node.widgets) {
-        // @ts-expect-error
         if (w.element) {
-          // @ts-expect-error
           w.element.hidden = hidden
-          // @ts-expect-error
           w.element.style.display = hidden ? 'none' : undefined
           if (hidden) {
             w.options.onHide?.(w)
@@ -282,6 +279,13 @@ LGraphNode.prototype.addDOMWidget = function (
     document.addEventListener('mousedown', mouseDownHandler)
   }
 
+  const { nodeData } = this.constructor
+  const tooltip = (nodeData?.input.required?.[name] ??
+    nodeData?.input.optional?.[name])?.[1]?.tooltip
+  if (tooltip && !element.title) {
+    element.title = tooltip
+  }
+
   const widget: DOMWidget = {
     type,
     name,

src/scripts/ui.ts

@@ -428,6 +428,13 @@ export class ComfyUI {
       defaultValue: 'default'
     })
 
+    this.settings.addSetting({
+      id: 'Comfy.EnableTooltips',
+      name: 'Enable Tooltips',
+      type: 'boolean',
+      defaultValue: true
+    })
+
     const fileInput = $el('input', {
       id: 'comfy-file-input',
       type: 'file',
@@ -437,7 +444,7 @@ export class ComfyUI {
       onchange: () => {
         app.handleFile(fileInput.files[0])
       }
-    }) as HTMLInputElement
+    })
 
     this.loadFile = () => fileInput.click()
 

src/scripts/widgets.ts

@@ -113,6 +113,8 @@ export function addValueControlWidgets(
       serialize: false // Don't include this in prompt.
     }
   )
+  valueControl.tooltip =
+    'Allows the linked widget to be changed automatically, for example randomizing the noise seed.'
   valueControl[IS_CONTROL_WIDGET] = true
   updateControlWidgetLabel(valueControl)
   widgets.push(valueControl)
@@ -133,6 +135,8 @@ export function addValueControlWidgets(
       }
     )
     updateControlWidgetLabel(comboFilter)
+    comboFilter.tooltip =
+      "Allows for filtering the list of values when changing the value via the control generate mode. Allows for RegEx matches in the format /abc/ to only filter to values containing 'abc'."
 
     widgets.push(comboFilter)
   }