Load CSS for ResolutionMaster only when needed

CSS is now loaded dynamically when a ResolutionMaster node is created, preventing global style interference in ComfyUI. The css-loader.js module was updated to export a loadStylesWhenNeeded function, and ResolutionMaster.js was updated to import and call this function during node setup. Minor improvements were also made to height adjustment and tooltip redraw logic.

Author: Azornes

js/ResolutionMaster.js

@@ -73,6 +73,14 @@ class ResolutionMasterCanvas {
         this.presetCategories = presetCategories;
 
         this.setupNode();
+        
+        // Load CSS only when this specific node instance is created
+        // This prevents global CSS loading that affects entire ComfyUI
+        import('./css-loader.js').then(module => {
+            module.loadStylesWhenNeeded();
+        }).catch(error => {
+            log.error('Failed to load CSS:', error);
+        });
     }
 
     ensureMinimumSize() {
@@ -401,8 +409,9 @@ class ResolutionMasterCanvas {
         }
 
         const neededHeight = currentY + 20;
-        // Always adjust height to match content, allowing shrinking when sections are collapsed
-        if (node.size[1] !== neededHeight) {
+        // Only adjust height if difference is significant (avoid micro-adjustments causing redraws)
+        const heightDiff = Math.abs(node.size[1] - neededHeight);
+        if (heightDiff > 1) {
             node.size[1] = Math.max(neededHeight, node.min_size[1]);
         }
 
@@ -1495,14 +1504,10 @@ class ResolutionMasterCanvas {
             }
         }
 
-        // Always update mouse position for tooltips
+        // Update mouse position for tooltips
         this.tooltipMousePos = { x: e.canvasX, y: e.canvasY };
 
-        // If tooltip is showing, update canvas to follow mouse
-        if (this.showTooltip && this.tooltipElement) {
-            app.graph.setDirtyCanvas(true);
-        }
-        
+        // Only trigger redraw if hover element changed
         if (newHover !== this.hoverElement) {
             this.hoverElement = newHover;
             this.handleTooltipHover(newHover, e);

js/css-loader.js

@@ -41,5 +41,10 @@ export function loadAllStyles() {
     }
 }
 
-// Auto-load styles when this module is imported
-loadAllStyles();
+/**
+ * Call this function when the ResolutionMaster node is actually created/used
+ * to load styles only when needed, preventing global UI interference
+ */
+export function loadStylesWhenNeeded() {
+    loadAllStyles();
+}