tweak

web-plugin/index.js

@@ -503,33 +503,35 @@ const ext = {
       nodeType.prototype.onNodeCreated = function () {
         onNodeCreated ? onNodeCreated.apply(this, []) : undefined;
 
-        // Create a multiline text widget to display the output (similar to rgthree)
-        this.textDisplayWidget = app.widgets.STRING(
-          this,
-          "displayed_text",
-          ["STRING", { multiline: true }],
-          app2
-        ).widget;
+        // Wait a bit to ensure all other widgets are created first
+        setTimeout(() => {
+          // Import ComfyWidgets if not available globally
+          const ComfyWidgets = app2.widgets || window.ComfyWidgets;
 
-        // Style the widget to look like a proper text display box
-        if (this.textDisplayWidget.inputEl) {
+          // Create widget exactly like rgthree does
+          this.textDisplayWidget = ComfyWidgets["STRING"](
+            this,
+            "displayed_text",
+            ["STRING", { multiline: true }],
+            app2
+          ).widget;
+
+          // Make it read-only
           this.textDisplayWidget.inputEl.readOnly = true;
-          this.textDisplayWidget.inputEl.style.backgroundColor =
-            "var(--comfy-input-bg)";
-          this.textDisplayWidget.inputEl.style.border =
-            "1px solid var(--border-color)";
-          this.textDisplayWidget.inputEl.style.color = "var(--input-text)";
-          this.textDisplayWidget.inputEl.style.fontFamily = "monospace";
-          this.textDisplayWidget.inputEl.style.fontSize = "12px";
-          this.textDisplayWidget.inputEl.style.minHeight = "100px";
-          this.textDisplayWidget.inputEl.style.resize = "vertical";
-          this.textDisplayWidget.inputEl.style.padding = "8px";
-          this.textDisplayWidget.inputEl.style.whiteSpace = "pre-wrap";
-          this.textDisplayWidget.inputEl.style.wordWrap = "break-word";
-        }
 
-        // Override the serialize function to not save the display value
-        this.textDisplayWidget.serializeValue = () => "";
+          // Style it
+          this.textDisplayWidget.inputEl.style.fontFamily = "monospace";
+
+          // Ensure it doesn't get serialized
+          this.textDisplayWidget.serializeValue = () => undefined;
+          this.textDisplayWidget.serialize = false;
+
+          // Remove it from widgets_values array if it exists
+          const widgetIndex = this.widgets.indexOf(this.textDisplayWidget);
+          if (widgetIndex > -1 && this.widgets_values) {
+            this.widgets_values.splice(widgetIndex, 1);
+          }
+        }, 100);
       };
 
       const onExecuted = nodeType.prototype.onExecuted;
@@ -539,10 +541,6 @@ const ext = {
         // Display the text output on the node
         if (message.text && message.text.length > 0 && this.textDisplayWidget) {
           this.textDisplayWidget.value = message.text[0];
-
-          // Resize the node to fit the content
-          this.setSize(this.computeSize());
-          app.graph.setDirtyCanvas(true);
         }
       };
     }